Všechny články

Jak postupujeme při redesignu webu? Stavíme na datech a opakovaném testování

Trojnásobný konverzní poměr, návratnost investice za necelých 8 měsíců, mnohonásobně vyšší počet návštěv nebo 24% navýšení zisku jen díky redesignu webu. Díky čemu se nám to daří? Stavíme na datech a výzkumech, ne na dojmech a představách. Přečtěte si, jak o redesignu přemýšlíme a jak při něm postupujeme.

K dobrým výsledkům jdeme přes výzkum a testování

Náš design proces vychází z přístupu proč-jak-co od Simona Sinka a z metodiky pro návrh webů. Obvykle náš postup zahrnuje následující kroky, ve kterých se oběma přístupy inspirujeme:

  • poznání (odpovídá na otázku proč?), ve kterém důkladně poznáváme klienta, jeho cíle, potřeby a motivace, jeho byznys a to, jak vnímá zákazníky,
  • výzkum, ve kterém poznáváme zákazníky klienta, odhalujeme jejich potřeby a motivace, a to pomocí různých výzkumných metod, hloubkových rozhovorů a uživatelských testování webu klienta i konkurence nebo analýzy zákaznických dat a dalších,
  • návrh (odpovídá na otázku jak? a co?), kdy na základě výzkumu a dat z externích studií rozhodneme, jak budeme dále postupovat, abychom se dobrali cíle, a pomocí zvolených nástrojů a metod vytváříme návrh webu a jeho prototyp,
  • evaluace, tedy testování a úpravu návrhů až do podoby, kdy fungují a splňují stanovené cíle.
Design proces tvorby webu nebo e-shopu
Design proces tvorby webu nebo e-shopu.

Poznání našeho klienta

Abychom pochopili, co přesně klient potřebuje a jak mu k tomu pomůžeme, musíme ho důkladně poznat a pochopit, jaký problém řeší a jak mu můžeme pomoct. Buď uspořádáme společný workshop, nebo klienta necháme vyplnit brief se základními otázkami, nad kterým se pak sejdeme, zjišťujeme další informace a vyjasňujeme si detaily.

Cílem je zjistit maximum informací o tom:

  • v jakém oboru se klient pohybuje, jak byznys funguje a jaká jsou jeho specifika,
  • co od nás potřebuje a s čím za námi přichází, jaké jsou jeho záměry a očekávání,
  • jaké jsou cíle projektu a čeho máme svou prací dosáhnout,
  • ale také osobní cíle klienta i člověka, který je u něj za projekt zodpovědný, abychom znali kontext a pomohli tyto cíle naplnit.

Zjišťujeme, co klient v projektu považuje za prioritu nebo jaká je jeho vize na 5 až 10 let. Tomu v průběhu projektu přizpůsobujeme celkovou strategii od výzkumných metod, časového plánu projektu až po návrh webu.

„Když víme, že klient plánuje rozšířit byznys, nabídnout nový produkt nebo inovovat službu, promítneme to do celkové digitální strategie, která ovlivní veškeré postupy a návrh webu. Jde nám o dlouhodobou udržitelnost řešení.“
Stáhnout vzorový brief v PDF

Stáhněte si vzorový brief, který používáme při poznání nového klienta. Otázky si můžete libovolně upravit a přizpůsobit. Pokud byste si nevěděli rady, napište nám na info@proofreason.com a určitě najdeme řešení.

Výzkum a pochopení chování zákazníků

Poznat potřebujeme také klientovy zákazníky. Klíčový, i když časově i finančně nejnáročnější, je primární výzkum. Díky němu se ale dostaneme přímo k návštěvníkům webu. Zjišťujeme jejich problémy a motivace spojené s používáním webu našeho klienta, navnímáme jejich kontext. Využíváme k tomu kvalitativní výzkumné metody.

Na základě kvalitativního výzkumu stavíme hypotézy, které pak testujeme a kvantitativně ověřujeme nejčastěji pomocí dotazníků. Získáváme tím přesnější a statisticky významná data.

Problémem u výzkumů bývá často nábor respondentů. Pokud nám klient nemůže dát přístup ke svým zákazníkům, využíváme panely a databáze. Obvykle se také bavíme s lidmi, kteří jsou zákazníkům nejblíž a znají jejich potřeby – to je třeba zákaznická podpora nebo obchodníci.

Zjištěné informace také doplňujeme o další data. Zkoumáme stávající web a provádíme uživatelské testování, procházíme data z analytických nástrojů a díváme se na výkon současného webu, dále třeba na to, jak klient monitoruje značku na internetu, jak dělá marketing nebo jak přivádí uživatele na web.

Všechny výsledky si zpracujeme a uděláme si v nich pořádek. Může to probíhat třeba takto:

  • z webové analytiky vidíme, že uživatelé nedokončují objednávky,
  • při analýze webu zjistíme, že objednávkový proces na e-shopu neodpovídá běžným standardům a předpokládáme, že kupující mu nerozumí,
  • průchod objednávkou otestujeme s respondenty, kteří při testování naráží na předpokládaný problém,
  • doptáváním zjišťujeme, čemu přesně nerozumí – neví, na které tlačítko mají kliknout, nebo zda tímto kliknutím objednávku finálně potvrdí,
  • ideálně ještě pomocí dotazníků ověříme, že má tento problém skutečně více lidí.

Díky tomuto postupu známe důkladně uživatele webu a víme, co na webu nefunguje a proč. Teprve poté hledáme řešení.

Návrh design procesu

Tvorbu webu můžeme přirovnat ke stavbě domu. Zákazník přijde za architektem se zadáním: chci dům s dvěma patry, sedlovou střechou a velkými okny. Jenže to odpovídá rodinnému domku, hotelu, stodole i školce. Zadání je neuchopitelné a stavitel ho může pojmout jakkoliv. Úkolem architekta je představy klienta přetavit v přesný nákres, podle kterého stavitel vytvoří to, co si klient přeje.

Tomuhle v naší práci odpovídá design proces. Zpřesníme zadání od klienta a nastavíme jasné mantinely pro úpravu webu. Na základě výzkumu například rozhodujeme, zda budeme kompletně stavět nový web nebo jen upravovat část webu stávajícího. Podle toho volíme způsoby a metody, jak navrhneme prototyp webu. Zkrátka si vytyčíme cíl a způsob, jakým se k němu dostaneme.

Čerpáme při tom také z externích studií a ověřujeme, zda v nich uvedená doporučení platí i pro náš případ. Nejčastěji vycházíme z výsledků uživatelských testování od Baymard Institute nebo z výzkumů webové použitelnosti NN Group.

Návrh design procesu probíhá například takto:

  • klient přijde se záměrem zvýšení prodeje vybrané kategorie zboží na e-shopu,
  • protože klient potřebuje zvýšit výkonnost webu rychle kvůli dalším navázaným aktivitám, volíme rychlejší cestu a vycházíme hlavně ze sekundárních dat,
  • analyzujeme výsledky studií výzkumných agentur a v kombinaci s expertní analýzou identifikujeme nejslabší části webu (např. produktové kategorie nebo detail produktu),
  • na základě dat z interního systému klienta, webové analytiky a dalších dat stanovíme výchozí cíl a definujeme cíl, kterého potřebujeme dosáhnout, díky tomu pak zpětně vyhodnotíme, jak se nám podařilo úpravou webu cíle naplnit,
  • navrhujeme úpravy dílčích stránek webu podle sekundárních dat a dat z používání webu (k tomu využíváme nástroje jako Google Analytics, Hotjar, Smartlook a další),
  • každou změnu průběžně a rychle testujeme pomocí nemoderovaných a moderovaných uživatelských testů se zástupci cílových skupin,
  • otestovaný návrh předáváme vývojářům k implementaci (včetně dokumentace),
  • pokud to situace umožňuje, volíme pro rychlé testování také A/B experimenty přímo na reálném provozu webu,
  • po odpovídající době vyhodnocujeme dopady změn.

Co? Návrhy a prototyp

Prvním krokem redesignu webu je obvykle návrh informační architektury. Díky ní máme možnost vidět web klienta jako celek ještě předtím, než se pustíme do dalších návrhů.. Pro každou stránku definujeme její cíl, sdělení a obsah. Umožňuje nám také dělat rychlé úpravy, můžeme snadno přidávat, odstraňovat i přesouvat podstránky webu.

Po návrhu informační architektury přicházíme s prototypem, tedy funkčním návrhem webu bez grafiky. Jeho součástí je už hotový obsah s přesnými texty. Jednak tím dáváme jasnou představu grafikovi, ale hlavně nám to v následném testování umožňuje ověřit, zda web ve svojí reálné podobě plní svůj cíl.

„Pracujeme vždy s reálnými texty, žádné lorem ipsum. Těžko bychom mohli zjistit, zda cílovka pochopí přidání do košíku, když je na tlačítku výplňový text.“
Prototyp webové stránky s přesnými texty, na kterém testujeme použitelnost webu
Prototyp webové stránky s přesnými texty, na kterém testujeme použitelnost webu.

Na prototyp navazuje práce grafika, který návrhu dává vizuální podobu podle brand manuálu klienta. Nenavrhujeme hned celý web, ale typové stránky spolu s prvky, které se pak dají použít kdekoliv na webu. Obvykle volíme klíčové a nejsložitější stránky, abychom navrhli zobrazení velkého množství prvků v různých kombinacích.

Grafický návrh webu dává stránkám konkrétní vizuální podobu
Grafický návrh webu dává stránkám konkrétní vizuální podobu.

Testování a evaluace

Všechny návrhy i prototypy hned od začátku průběžně testujeme, upravujeme a opět testujeme. Minimalizujeme tím riziko neúspěchu projektu.

„Nestane se, že bychom web kompletně navrhli a až poté zjistili, že návrh nefunguje a musíme jej celý předělat. Šetříme tím čas i peníze klienta a víme, že mu předáváme návrh správně fungujícího webu.“

Nejprve testujeme průchod informační architekturou. U prototypu pak ověřujeme použitelnost webu. Tedy jeho funkčnost, přehlednost a to, zda zákazníci web chápou a zvládnou na něm plnit požadované úkony. Při testování respondentům zadáváme úkoly podle toho, co na webu očekáváme od reálných uživatelů. Požadujeme například, aby si vyfiltrovali produkty, našli zboží určitých parametrů, přidali si ho do košíku a dokončili objednávku.

Návrhy testujeme i z pohledu emocí. Ověřujeme, zda web působí na cílovou skupinu tak, jak potřebujeme a jak chce značka působit, jaké emoce chce vzbuzovat. Můžeme také testovat, zda na něj web působí důvěryhodně. Podle toho pak upravujeme například barevnost návrhu nebo font písma.

Přečtěte si více o uživatelském testování webu.

Spuštění nového webu je začátek dlouhodobé spolupráce

Klientovi předáváme otestovaný web s vysokou pravděpodobností, že bude fungovat podle očekávání.

Kvalitní návrh je přesto jen polovina úspěchu. Tou druhou a neméně podstatnou je správná implementace. Klientům proto doporučujeme, aby nám kromě výzkumu a návrhu svěřili i vývoj webu, abychom zvýšili šance, že web bude fungovat přesně podle návrhu a očekávání.

„Když navržený web rovnou i vyvíjíme, máme jistotu, že vše uděláme přesně tak, jak bylo v návrhu zamýšleno.“

Pokud má klient vlastní vývojáře, předáme jim podrobnou dokumentaci, zajistíme supervizi implementace ze strany UX a poskytneme také oponenturu nebo pomoc našich vývojářů s řešením problémů. Snažíme se tak udělat vše pro úspěch projektu.

Vývojem webu a jeho předáním naše práce nekončí. Naopak začíná dlouhodobé partnerství. Pravidelně aktualizujeme a optimalizujeme web, testujeme a zkoumáme. Klientovi ale předáváme víc – učíme ho pracovat s výzkumy, aby je mohl využívat v rámci svého byznysu, pomáháme s optimalizací některých interních procesů, například se skladovou logistikou pro e-shopy.

Čím déle s klientem spolupracujeme, tím více mu jsme schopni pomoct nejen na webu, ale s byznysem celkově.