User Experience v praxi

Transkript

1 Jiří Komár

2 Co je to vlastně UX?

3 UX je všechno

4 Nalezitelnost Užitečnost Důvěryhodnost Použitelnost Potřebnost Přístupnost

5 flow

6 O Flow můžeme rychle přijít

7 Pokud už najdete odkaz na košík, asi na něj nekliknete electroworld.cz

8 Přihlášení a hledání bylo dokonale zamaskováno megastreet.cz

9 Určitě tam ty peníze pošlu blackcomb.cz

10 Jak vložit do košíku? zoohit.cz

11 I pěkné věci můžou být špatně ceskasporitelna.cz

12 Co tedy dělat a co ne? Uživatelské rozhraní tvoříme dle znalostí našich uživatelů Neopisujeme staré řešení, děláme nové a lepší Učíme se z chyb jiných Soustředíme se na kritické místa aplikace 20% Pojmy: pozitivní stereotypy, návrhový vzory, mentální modely

13 Poznáváme svého uživatele

14 Poznáváme svého uživatele Analýza webu a potřeb uživatelů Kvantitativní průzkum Kvalitativní průzkum

15 Poznáváme svého uživatele Kvalitativní průzkum Etnografické rozhovory Hloubkové rozhovory a focus group Vytvoříme si personu/y

16

17

18

19

20

21 Poznáváme svého uživatele Kvantitativní průzkum Webová analytika Ankety Dotazníky Hodnocení

22 Navrhujte web správně

23 Card sorting (třídění kartiček) Tvoříme strukturu (celého webu, určitého prvku) Uživatel, zadavatel, designer Uvědomujeme si potřeby a priority uživatele Nástroje: tužka, malé papírky, tabule

24 Sketching (skicování) Rychlý návrh obrazovek a nabídek Vhodné v rané fázi projektu Skicy nám pomůžou vytvořit wireframe Nástroje: tužka a hodně papíru

25 Wireframe (drátěné kostry webu) Ušetří nám velké starosti (čas, peníze) Popisuje rozmístění prvků na webu Nechte to raději na profesionálech Nástroje: Axure RP, Balsamiq, Cacoo

26

27

28 Tvorba interaktivních prototypů Pokud je wireframe málo Můžeme otestovat na uživatelích nebo provést A/B testování Lze použít místo psané specifikace Lze vytvořit funkční aplikaci 1:1 Nástroje: Axure RP, Balsamiq, HTML a CSS

29 Testování webu Testujeme pravidelně (wireframe, prototyp, design, web) Typy testování Teplotní mapy, nahrávání obrazovky, A/B testování, MVT Vzdálené testování Moderované uživatelské testování

30 Teplotní mapy (heatmap) Nástroje: myx, CrazyEgg, userfly, ClickTale

31 A/B testování Nástroje: Google Website Optimizer

32 Moderované uživatelské testování Do testu vybíráme obyčejné uživatele, ne pracovníky firmy Testujeme na 3 6 uživatelích Před testem sestavíme scénář uživatelského testování Při testu nutíme uživatele uvažovat nahlas Testování nahráváme nebo si děláme poznámky Z poznámek vypracujeme výstupní analýzu, tu předáme k dalšímu zpracování Hledáme chyby v použitelnosti a ne v aplikaci, ani v uživatelích Každý uživatel je jiná osobnost

33 5 nejčastějších chyb internetových obchodů Velké množství produktů Malé fotky a špatný popis produktů Špatná navigační architektura webu Zbytečně složitý objednávkový proces Špatná práce s marketingovými nástroji (E mail marketing, Google Analytics, Sociální sítě, Cross selling, Up selling)

34 Děkuji za pozornost Čas na