Proces návrhu webu: od nápadu k hotovým obrazovkám
Dobrý návrhový proces není byrokracie: je to pořadí, které brání přepracovávání. Každá fáze uzavře rozhodnutí, které následující fáze bere za vyřešené.
Tento průvodce prochází fáze, co každá dodává, jak dlouho trvají, a v kterých bodech se návrhové projekty obvykle zadrhnou.
Fáze a co každá dodává#
Na pořadí záleží. Přeskočit fázi ji neodstraní — jen posune rozhodnutí dál, kdy je jeho změna dražší.
| Fáze | Výstup | Typická doba |
|---|---|---|
| Objevování | Cíle, publikum, omezení | 3 až 5 dní |
| Struktura | Seznam stránek a navigace | 3 až 5 dní |
| Drátěné modely | Rozvržení bez vizuálního stylu | 1 až 2 týdny |
| Vizuální směr | Typografie, barva, tón — na jedné stránce | 3 až 5 dní |
| Hotové obrazovky | Aplikované šablony, desktop i mobil | 2 až 4 týdny |
| Prototyp | Proklikatelné cesty k testování | 2 až 4 dny |
| Předání | Systém, exporty, specifikace | 3 až 5 dní |
Vizuální směr na jediné stránce je fáze, která ušetří nejvíc času. Schválit tón dřív, než se aplikuje na třicet obrazovek, zabrání přepracování třiceti obrazovek.
Drátěné modely před stylem#
Drátěné modely bez barvy a typografie vynutí diskusi o obsahu a hierarchii, což je diskuse, na které záleží.
- Navrhujte nejdřív mobil. Vejde se míň, což nutí rozhodnout priority.
- Používejte skutečný obsah, nebo co nejbližší. Zástupný text skrývá problémy s prostorem.
- Ukažte prázdné, chybové a načítací stavy — bývají opomenuty a pak improvizovány.
- Označte hlavní akci na každé obrazovce. Pokud jsou tři, není žádná.
- V této fázi neřešte barvy. Pokud se objeví, jsou drátěné modely příliš detailní.
- Ověřte strukturu obsahu s tím, kdo ho bude psát, než půjdete dál.
Kde se proces obvykle zadrhne#
Blokace jsou téměř vždy stejné a téměř všechny organizační, ne tvůrčí.
| Blokace | Příčina | Řešení |
|---|---|---|
| Protichůdná zpětná vazba | Více rozhodovatelů bez hierarchie | Jediná odpovědná osoba |
| Nekonečná kola | Kola nedefinovaná ve smlouvě | Pevný počet s kritériem schválení |
| Chybějící obsah | Nikdo nebyl určen | Jméno a datum u každé stránky |
| «Tohle jsem si nepředstavoval» | Přeskočený vizuální směr | Nejdřív schválit tón na jedné stránce |
| Obrazovky, které nelze postavit | Návrh bez kontaktu s vývojem | Včasná revize s vývojářem |
| Mobil dodělaný nakonec | Navrženo jen pro desktop | Navrhovat nejdřív mobil |
«Nekonečná kola» je téměř vždy problém smlouvy, ne návrhu. Definujte, co je kolo a kolik jich je.
Předat návrh, který lze postavit#
Předání rozhoduje, zda stavba plyne, nebo se změní v cvičení z interpretace.
- Předejte malý systém, ne jen obrazovky: barvy, písma, odstupy, komponenty.
- Zdokumentujte stavy každé komponenty: běžný, fokus, aktivní, vypnutý, chyba.
- Specifikujte chování mezi zlomovými body, ne jen dvě pevné šířky.
- Zahrňte prázdné a chybové stavy každé obrazovky.
- Exportujte obrázky v moderních formátech a ve velikostech, ve kterých budou použity.
- Označte, co je pevné a co se může přizpůsobit — kdo staví, narazí na případy, které jste nepředvídali.
- Uspořádejte předání naživo. Půl hodiny ušetří týden dotazů.
Časté dotazy
Kolik kol připomínek je běžných?
Dvě až tři na fázi je obvyklé a mělo by to být ve smlouvě, s definicí, co se počítá jako kolo. Bez tohoto limitu má návrh tendenci se rozšiřovat donekonečna, protože každý nový člověk, který obrazovky uvidí, má názor. Jediná rozhodující osoba má větší cenu než jakýkoli číselný limit.
Potřebuji drátěné modely, když už mám reference?
Ano, protože reference ukazují styl, zatímco drátěné modely řeší strukturu. Přejít rovnou od referencí k hotovým obrazovkám obvykle skončí diskusí o barvách, když skutečným problémem je hierarchie informací. Drátěné modely se dělají rychle a mění ještě rychleji.
Mám navrhnout všechny stránky?
Navrhujte šablony, ne stránky. Web s padesáti stránkami má obvykle pět nebo šest odlišných šablon. Navrhněte každou s nejtěžším případem obsahu — nejdelším titulkem, nejdelším seznamem — a zbytek vyplyne bez další práce.
Kdo má návrh schvalovat?
Jedna osoba se skutečným mandátem. Můžete sbírat názory od více lidí, ale rozhodnutí musí někomu patřit. Schvalování komisí produkuje návrhy, které nikdo nenávidí a nikdo nehájí, a je nejčastější příčinou projektů táhnoucích se měsíce ve vizuální fázi.
proces návrhu webufáze návrhudrátěné modelydesignový systémkola připomínekpředání návrhu