Rozhovor se Sergeyem Senchikem, UX/UI a product designerem z agentury WDF
Sergey se v rámci své práce zaměřuje především na potřeby uživatelů. Specializuje se na prototypování a navrhování uživatelských rozhraní, webových stránek, mobilních či desktopových aplikací, které pomáhají uživatelům k pozitivním změnám. Zkušenosti má s uživatelským výzkumem, tvorbou uživatelských toků a příběhů, logikou interakce produktu s uživatelem či tvorbou wireframů a prototypů.
Za více než 15 let zkušeností už z oboru ledasco co viděl, slyšel, zažil, ať už ze strany klienta či agentury, a ne vždy to dávalo smysl. Kdo není online jako by nebyl, to víme už dávno a však odstartovat s úspěchem není jen tak. Na co dát pozor, jak poznat, že agentura pracuje systematicky s rozumem, a že se jen neschovává za pojmy, které možná působí profesionálně a však tím to končí? Sergey nám „poodhalil karty“ a podělil se o několik prvních kroků, které by agentura s klientem měla projít.
Začněme tedy od začátku. Firma potřebuje zlepšit svoje služby v online světě, třeba pro své uživatele připravit aplikaci. Najde agenturu a osloví ji. Co by mělo následovat, jakými kroky by agentura měla klienta provést?
Práce na každém projektu začíná s obdržením podkladů a následném briefingu. Během pohovoru zjišťujeme základní body jako je cíl projektu, vize, rizika, příležitosti, omezení, logistika projektu a tak dále. Součástí první fáze je taky audit veškerých podkladů obdržených od klienta, jako třeba byznys plán, průzkum trhu, produktové portfolio, konkurence a relevantní technologie. Dalším krokem je uživatelský výzkum. V této části provádíme pohovory s cílovými uživateli daného produkty (aplikace, webu) a definujeme jejich problémy a potřeby spojené s produktem a hledáme možná řešení těchto problémů. Tato část probíhá brainstormingem nebo děláme design workshop, kde je důležité zapojit také klienty.
A pak už následuje samotná práce designerů?
Přesně tak. Když máme jasně definované problémy uživatelů a jejich řešení, začínáme budovat design frameworku. Je to jednoduchý model produktu, kde jsou definovány a uspořádány veškeré funkce produktu podle příběhu uživatelů. Většinou jako výstup děláme user story mapu a sitemapu. Tyto výstupy budou posléze sloužit jako zadání pro vytvoření prototypu. Při jeho vytváření vždy začínáme wireframy, tedy návrhem definující funkci a obsah stránek webu, kde se zaměřujeme na rozložení všech funkcí a obsahu produktu podle layoutu stránky.
Jak poznáme, že to děláme dobře? Co když máme prototyp, třeba celé aplikace, a pak zjistíme, že vlastně nefunguje?
Aby se tohle nestalo, následovat musí uživatelské testování. Tím ověříme, že uživatel chápe logiku produktu, navigaci a jestli produkt řeší problémy, které jsme definovali a odpovídá očekáváním uživatelů. Po testování děláme pohovory s uživateli a zjišťujeme jejich celkový dojem, pak analyzujeme zjištěný výsledek a případně vylepšujeme wireframy. Až když jsou wireframy dokončené, pokračujeme s navrhováním vizuálního stylu a grafické podoby prototypu. Součástí této fáze je vytváření design systému, animace uživatelského rozhraní a příprava UI style guidu. Finálním výstupem u celého procesu vytváření designu produktu je nejen prototyp, ale i sepsáni technického zadáni pro vývoj. Ve chvíli, kdy se dostaneme do fáze vývoje, pokračujeme ve spolupráci s vývojovým týmem na všech etapách – pomáháme si řešit vznikající otázky týkající se logiky produktu z hlediska uživatelského chování.
Nejzásadnější je tedy uživatelský výzkum? Jak probíhá?
Jde o důležitý bod, protože v této fázi zjišťujeme, jaké problémy a potřeby má uživatel a co má řešit produkt, na kterém pracujeme. Když produkt nebude řešit potřeby uživatelů, nebude nikdy úspěšný. Když zjistíme konkrétní potřeby a problémy uživatelů, budeme schopni správně definovat funkce a nastavit logiku produktu, aby odpovídal očekáváním uživatelů. Základem uživatelského výzkumu jsou skutečná data, která dostáváme od cílových uživatelů, nikoliv na základě vlastní subjektivní zkušenosti. Proto uživatelská studie začíná už během náboru potenciálních nebo skutečných uživatelů produktu. Data sbíráme během pohovoru, skrze vyplněné dotazníky nebo testováním. Pak provádíme analýzu shromážděných dat a definujeme základní problémy a potřeby uživatelů. Důležitou částí uživatelského výzkumu je definice cílových skupin a vytvoření uživatelské persony (prototypu) pro každou ze skupin. Jde o podmíněný profil člověka, který má typické vlastnosti, návyky a životní styl, které jsou vhodné pro cílové skupinu daného produktu.
Jak se dál s uživatelskou personou pracuje a kde může pomoci?
Uživatelská persona pomáhá celému týmu správně rozhodovat o designu a funkcích produktu tak, aby vyhovovaly potřebám a přáním uživatelů. Vytvořením persony jsme schopni urovnat spory mezi produktovými a návrhářskými týmy, protože lépe rozumíme potřebám a očekáváním primárních zákazníků produktu. To nám opět pomáhá se dívat na produkt očima reálného uživatele.
Jako další krok jste zmínil uživatelské testování. Co obnáší tato fáze a jaké má cíle?
Uživatelské testování je testování buď existujícího digitálního produktu nebo jeho prototypu z hlediska uživatelského chování. Cílem tohoto testování je zjistit jaké má produkt uživatelské problémy, v jaké míře produkt odpovídá potřebám uživatelů a dostat tak zpětnou vazbu ohledně celkového dojmu, případně i zpětnou vazbu s nápady na zlepšení. Součástí testování je tedy shromáždění dostatečného množství dat, jejich analýza a následující definice základních problémových bodů. V praxi je uživatelské testování pozorování uživatelů, kteří se pokoušejí dokončit úkoly, které byly předem definovány a nastaveny. Často se provádí opakované testování od raného vývoje až po vydání produktu.
Jak takové uživatelské testování probíhá a jaké jsou možnosti?
Každé testování vychází z přípravy. Na začátku definujeme cíle testování, na jejich základě se připravuje scénář, který se skládá z konkrétních úkolů, které mají uživatelé během testování splnit. Také je důležité připravit otázky pro zpětnou vazbu. Testování může probíhat moderované nebo nemoderované. Může probíhat při osobním setkání v připravené místnosti nebo online. V tuto chvíli existuje několik výborných nástrojů, které používáme pro uživatelské testování online. Tyto nástroje umožňují provádět různé typy testování online, a také poskytují i možnost hledání cílových uživatelů mezi stovkami tisíc reálných lidí po celém světě. Je tam taky možnost pozvat i své vlastní uživatele. Poskytuje nám to například i možnost nahrávání obrazovky během testování, různé statistiky jako efektivita splňování úkolů, možnost provést pohovor one2one s uživateli a získat zpětnou vazbu. Vzhledem k aktuální situaci ve světě preferujeme právě online testování a pohovory s uživateli, abychom nikoho zbytečně neohrožovali.
A co se tedy vlastně testuje?
Je to například testování použitelnosti produktu. Ale existují i další metody uživatelského testování, které používáme pro zlepšování produktu. Je to třeba A/B testování. Na rozdíl od testování použitelnosti, které zkoumá chování uživatelů obecně a na základě definovaného scénáře, je A/B testování o experimentování s více verzemi produktu nebo částí produktu, abychom zjistili, která verze je nejlepší a nejúčinnější. Je to důležitý nástroj pro zvýšení konverzí. Další metoda, kterou taky používáme je teplotní mapa (heatmaps). Tuto metodu používáme abychom více pochopili, jak uživatel komunikuje s produktem, co vnímá prioritně a co naopak ignoruje. Ve zkratce, tepelná mapa umožňuje sledování ukazatelu myši uživatele na obrazovce. Data jsou poté prezentována pomocí barev, aby byla posléze snadno srozumitelná.
Jako další bod v procesu, jste zmínil user story mapu. Co si pod tímto pojmem představit a k čemu v praxi slouží?
Je to uspořádání funkcí produktu podle příběhu uživatele. Díky této mapě dostaneme obrázek toho, jak se produkt používá. Taky díky tomu, že má mapa jednoduchý vzhled a funkce vázané na konkrétní uživatelské příběhy, můžeme zjistit všechny mezery ve funkčnosti a logice používání produktu. A nakonec user story mapa může být použita pro stanovení priorit – lze pomoci ní nastavit jaké funkce bude obsahovat MVP verze (minimální životaschopný produkt), a jak se produkt bude rozvíjet v dalších verzích. Po schválení user story mapa slouží jako podklad pro zpracování sitemapy a informační architektury projektu.
To jsou určitě další dva pojmy, které bychom si měli vysvětlit…. Co je sitemapa a jak se liší od informační architektury?
Sitemapa je schematické zobrazení hierarchického systému stránek webu nebo aplikace. Obvykle znázorňuje vztah rodiče a sourozence mezi stránkami na webu nebo uvnitř aplikace a ukazuje, jak mohou být podstránky uspořádány. Informační architektura na rozdíl od sitemapy nezobrazuje hierarchii a propojení stránek, ale organizuje a strukturuje veškerý obsah a ukazuje, jak obsah na sebe vzájemně působí v rámci produktu. Sitemapa a informační architektura jsou součástí výstupu designu produktu a slouží svými podklady pro navržení prototypu a další vývoj produktu.
Co jsou wireframy a proč jsou tak důležité?
Jednodušeji řečeno, je to rozvržení stránky nebo obrazovky, které definuje umístění prvku uživatelského rozhraní a obsahu projektu na konkrétní stránce nebo obrazovce, považujte to za základní rámec pro webovou stránku nebo obrazovku aplikace. Wireframy neobsahují žádnou barvu, styl ani grafiku, protože hlavním cílem je porozumět funkcím, umístění klíčových prvků a tomu, jak s nimi uživatel bude interagovat. Mají velkou hodnotu, protože nám ušetří hodně času. Vzhledem k tomu, že wireframy mají jednoduchou vizuální podobu, je mnohem snazší provádět změny, než kdybychom to dělali ve finálním prototypu s velkým množstvím vizuálních prvků. Další výhoda je v tom, ze odstraněním barev, obrázků a dalších detailů jsme nuceni přemýšlet pouze o rozložení a funkčnosti každého prvku na stránce. Zaměříme se pouze na strukturu potřebnou pro nejlepší uživatelskou zkušenost.
Jaké programy a technologie používáte při tvorbě designu produktu?
Miro je náš základní nástroj, který používáme pro výzkumy a brainstormingy. Používáme ho taky pro mapování uživatelských procesů – vytváříme zmíněné user story mapy, user journey mapy, flow-charty. Používáme ho i na vedení design workshopu nebo design sprintu. Pro navrhování wireframu a prototypu používáme Sketch. Pak v InVision přidáváme vazby mezi stránkami a děláme prototyp interakčním, a dál používáme tyto prototypy pro uživatelské testování a prezentace klientům. Na animace uživatelských rozhraní máme Principle nebo AfterEffect pro více náročnější úkoly. Useberry a Lookback jsou naše nejoblíbenější nástroje pro uživatelské testování a rozhovory. Hotjar je skvělý nástroj na teplotní mapy (heatmaps) a analýzu uživatelské zkušenosti. Projektový management řešíme výjimečně v Jire. Taky používáme balíček Adobe na rastrové vizuály, ikony a ilustraci.
.jpg)