Návrh webu (UX design) většinou rozhoduje o úspěchu nebo neúspěchu webu. Tvořit web bez návrhu je totiž jako stavět dům bez plánů architekta. Možná se povede dle představ, ale možná také spadne nebo se zcela mine s očekáváními.
Promyšlený návrh si na sebe bohatě vydělá, protože web vám přinese více tržeb a nemusí se tolik předělávat.
Jak navrhujeme weby?
Při tvorbě webu vybíráme ty nejvhodnější metody návrhu webu (UX designu) pro daný projekt. Výsledkem návrhu je projektová dokumentace webu. Co je v naší paletě služeb UX designu?
![Návrh webu a UX design - analýza](https://www.netmagnet.cz/wp-content/uploads/2020/07/navrh-webu-a-UX-design-1-analyza.png)
1. Brief a stanovení směru
Co vlastně budeme tvořit? E-shop, prezentační web, platformu? Pro koho má web být a jak zhruba má web fungovat? Např. „bude to prezentační web úklidové firmy, který má získat nové soukromé zákazníky z řad domácností přes placenou a neplacenou návštěvnost; časem chceme rozhraní, kam budou stálí zákazníci vkládat své požadavky“.
![Návrh webu a UX design - storyboard](https://www.netmagnet.cz/wp-content/uploads/2020/07/navrh-webu-a-UX-design-2-storyboard.png)
2. Uživatelský výzkum a storyboard
Než začneme navrhovat konkrétní stránky webu, potřebujeme se na chování zákazníka podívat z ptačí perspektivy. Jeho cílem není navštívit web, ale vyřešit nějakou potřebu. Jak vypadá typický zákazník? Jakou řeší potřebu? Jak se o webu dozví? Co na něm udělá? Kam pokračuje dál? Jak se tato zkušenost promítne v jeho životě? Formou jednoduchého komiksu nebo posloupností událostí navrhneme jednoduchý příběh (narativ), jak má navrhovaný web nebo aplikace zapadat do života tohoto zákazníka.
![Návrh webu a UX design - obsah](https://www.netmagnet.cz/wp-content/uploads/2020/07/navrh-webu-a-UX-design-4-obsahova-strategie.png)
4. Obsahová strategie
Navrhneme obsah podle See Think Do Care frameworku, aby na webu byl obsah pro uživatele ve všech fázích nákupního procesu. Zmapujeme aktuální obsah, domluvíme se na migraci původního a naplánujeme tvorbu nového.
![Návrh webu a UX design - prototoyp](https://www.netmagnet.cz/wp-content/uploads/2020/07/navrh-webu-a-UX-design-5-prototyp.png)
5. Prototyp
Černobílá podoba webu s víceméně hotovými texty, interakcemi a testovacími daty. Prototyp má co nejlépe popisovat strukturu, funkčnost a obsah finálního webu. Zároveň ho lze snadno měnit na základě vašich připomínek a výsledků uživatelského testování.
![Návrh webu a UX design - A/B testování](https://www.netmagnet.cz/wp-content/uploads/2020/07/navrh-webu-a-UX-design-6-testovani.png)
6. Testování
Provedeme uživatelské testování prototypu a zapracujeme podněty jak od uživatelů, tak od Vás. Zpravidla provádíme několik kol a několik druhů a uživatelského testování. Testování provádíme i dále v průběhu tvorby webu – po tvorbě grafiky a spuštění alfa verze webu.
![Návrh webu a UX design - specifikace funkcionality](https://www.netmagnet.cz/wp-content/uploads/2020/07/navrh-webu-a-UX-design-7-specifikace-funkcionality.png)
7. Specifikace funkcionality
U webových aplikací potřebujeme definovat konkrétní funkčnost a požadované „nefunkční“ vlastnosti webu. Ne všechno je totiž vidět z uživatelského rozhraní prototypu. Co importy/exporty dat? E-maily? Jaké technologie budou použity? Jsou specifické požadavky na dostupnost, rychlost nebo přístupnost webu?