Naučte se používat jednoduché drátěné rámy k zahájení návrhů
Webový wireframe je jednoduchý vizuální průvodce, který vám ukáže, jak vypadá webová stránka . Navrhuje strukturu stránky bez použití grafiky nebo textu. Webový portál webových stránek by zobrazoval celou strukturu webu - včetně odkazů, na které stránky odkazuje.
Web wireframes jsou skvělý způsob, jak spustit projektovou práci. A i když je možné vytvářet složité drátěné snímky s obrovským množstvím detailů, vaše plánování může začít s ubrouskem a perem. Klíčem k vytváření dobrých drátových rámů je vynechání všech vizuálních prvků. Použijte pole a řádky pro zobrazení obrázků a textu.
Věci, které mají být zahrnuty do wireframe webové stránky:
- krabice pro primární grafické prvky
- umístění titulků a podtitulů
- jednoduchá struktura uspořádání
- výzvy k akci
- textové bloky
Jak vytvořit jednoduchý webový wireframe
Vytvoření wireframe webové stránky pomocí libovolného šrotu papíru, který máte k dispozici. Zde je postup, jakým to dělám:
- Nakreslete velký obdélník - to může znamenat buď celou stránku nebo pouze viditelnou část. Obvykle začínám s viditelnou částí a pak ji rozbalím tak, aby obsahovala prvky, které by byly pod záhybem.
- Nakreslete rozvržení - jsou to 2 sloupce, 3 sloupce?
- Přidejte do pole pro grafiku záhlaví - nakreslete sloupce, chcete-li, aby se jednalo o jednu hlavičku nad sloupci, nebo je jednoduše přidejte tam, kde chcete.
- Napište "Nadpis", kde chcete, aby byl váš titul H1.
- Napište "Sub-Head", kde chcete mít H2 a nižší titulky. Pomáhá-li je proporcionálně - h2 menší než h1, h3 menší než h2 atd.
- Přidat do rámečků další obrázky
- Přidat do navigace. Pokud plánujete karty, stačí nakreslit pole a nahoře napsat "navigaci". Nebo umístěte seznamy s odrážkami do sloupců, kde chcete navigaci. Nepsat obsah. Stačí napsat "navigaci" nebo použít řádek pro zobrazení textu.
- Přidání dalších prvků na stránku - určit, co jsou s textem, ale nepoužívejte text skutečného obsahu. Chcete-li například tlačítko s výzvou k akci vpravo dole, vložte do ní rámeček a označte jej "výzvu k akci". Nepište "Koupit teď!" v tomto poli.
Jakmile budete mít svůj jednoduchý drátěný rám napsaný a nemělo by vás trvat déle než 15 minut, abyste si načrtli jeden, ukažte to někomu jinému. Zeptejte se jich, jestli něco chybí a pro další zpětnou vazbu. Na základě toho, co říkají, můžete napsat jiný wireframe nebo udržet ten, který máte.
Proč jsou papírové drátěné rámy nejlepší pro první koncepty
Zatímco je možné vytvářet drátové snímky pomocí programů jako Visio, měli byste se na počáteční brainstorming setkat na papír. Papír se nezdá být trvalý a mnozí lidé předpokládají, že jste ho hodili dohromady za 5 minut, a proto neváhejte, abyste vám poskytli dobrou zpětnou vazbu. Ale když použijete program k vytvoření ozdobných drátových rámů s perfektními čtverci a barvami, vystavujete se riziku, že se dostanete do samotného programu a strávíte hodiny zdokonalováním něčeho, co nikdy nebude fungovat.
Papírové dráty se dělají snadno. A pokud se vám to nelíbí, stačí jen rozdrtit papír, hodit ho do recyklace a uchopit nový list.