Jan Stárek / 04.06.2025

Participativní příprava nemoderovaného testování redesignu webu organizace Villa Vallila

1.Úvodem: vstup do projektu a proč redesign webu?

Aktuální web organizace Villa Vallila

Na podzim loňského roku jsem se setkal se Štěpánkou Míchalovou, vedoucí chráněného bydlení a odlehčovací služby Villa Vallila. Během rozhovoru jsme se dostali k tématu mého studia, a postupně také k webovým stránkám jejich organizace, které už nevyhovují současným potřebám. Štěpánka zmínila, že plánují redesign webu, ale zatím nemají jasný termín – vždy je totiž potřeba řešit jiné priority.

Na jaře jsem ji znovu oslovil s nabídkou zapojit se do projektu v rámci své praxe. Načasování bylo ideální. Organizace právě začínala s přípravou nové struktury webu a objevily se první otázky: Co je pro naše uživatele důležité? Jak by mělo vypadat hlavní menu? Vyjadřuje web správně, o jakou organizaci se jedná?

V úvodní fázi jsem vedl rozhovor se Štěpánkou a kladl spoustu otázek, abych lépe porozuměl kontextu. 

Identifikace výzkumného tématu

Villa Vallila, zapsaný ústav, poskytuje sociální službu chráněné bydlené a odlehčovací službu. Cílovou skupinou jsou lidé s mentálním postižením, zdravotním postižením či kombinovaným postižením, kteří jsou schopni života v komunitě. Ústav je součástí světové organizace
Jelikož současné webové stránky Villy nejsou vyhovující, pustila se komunita do kompletního redesignu. Hlavní struktura a grafická podoba webu vychází ze šablony L´Arche, kterou si komunita přizpůsobuje svým potřebám. Právě v této fázi…

Jaké otázky nebo nejistoty aktuálně vnímáte ohledně navrhovaného webu? Co byste si přáli od uživatelského testování zjistit?

Co nás aktuálně zajímá, jsou hlavně otázky ohledně srozumitelnosti a přehlednosti – konkrétně pro naše hlavní uživatele, tedy rodiče klientů a jejich opatrovníky. Zajímá nás, jestli je struktura webu pro ně intuitivní, jestli se v něm dokážou snadno zorientovat a rychle najdou to, co potřebují – dokumenty, kontakty, základní informace o službě. Uvědomujeme si, že návrhy, které dostáváme z L’Arche, ne vždy odpovídají naší “české realitě”, takže je částečně upravujeme, ale pořád se snažíme držet společného designového jazyka. V současné verzi webu jsou texty dlouhé, někdy i opakující se, a člověk se v nich snadno ztratí. Snažíme se to teď zjednodušovat, ale nechceme přitom přijít o nic důležitého. Přemýšlíme, co má být přímo na stránce a co už dát třeba do PDF přílohy. Řešíme i to, co udělat pro to, aby web působil atraktivně – aby si třeba rodič řekl: „To je hezké, to si chci přečíst,“ nebo aby někdo nový pomyslel: „Tohle je zajímavá komunita, tam bych chtěl zajít.“ Do toho ještě ladíme výběr fotek – občas víme, co chceme vyjádřit, ale nemáme fotku, která by to řekla za nás. A do budoucna bychom rádi věděli i to, jestli jde sledovat, co lidi na webu nejčastěji navštěvují – ale to už je spíš technická otázka…

 

Z tohoto rozhovoru vznikla následující matice, která shrnuje hlavní problémy, cíle, otázky k řešení a jednotlivé cílové skupiny.

2. Nastavení časového plánu

Jak už jsem zmiňoval, do projektu jsem se zapojil ve chvíli, kdy komunita ladila texty pro nový web a snažila se zpřehlednit navigační menu. Zároveň začali spolupracovat s Ariane z Kanady, která má na starosti web v rámci mezinárodní organizace L’Arche. Cílem bylo držet se sjednoceného designového stylu, aby web působil konzistentně napříč jednotlivými regiony.

První návrhy vznikly ve Figmě a ty následně Ariane přenášela do testovací verze webu. Na začátku jsme se domluvili, že moje hlavní aktivní zapojení bude časově ohraničené odevzdáním případové studie, takže bylo potřeba si jednotlivé kroky dobře naplánovat.

Vytvořil jsem proto jednoduchý časový harmonogram, viz níže. Samotné testování jsme spustili 21. května. 

3. Příprava testovacího scénáře

V návaznosti na náš rozhovor jsme se spolu se Štěpánkou, vedoucí komunity, zaměřili na konkrétní cílové skupiny. Pomocí brainstormingových a prioritizačních metod jsme společně vytvořili klíčové kategorie, ke kterým jsme přiřazovali navazující otázky. Bylo zajímavé sledovat, jak jsme se během procesu postupně dostávali do větší hloubky – od obecných témat až po velmi konkrétní situace, které mohou uživatelé na webu řešit. Právě tyto otázky se nakonec staly výchozím stavebním kamenem pro přípravu testovacího scénáře.

3.1. Miro jako skvělý kolaborativní nástroj!

Celý projekt jsme vedli v nástroji Miro, který se ukázal jako ideální pro spolupráci na dálku – ať už člověk sedí kdekoliv, třeba i v Kanadě. 😉 V průběhu celého procesu bylo klíčové efektivně si předávat nápady, myšlenky a konkrétní úkoly k úpravám testovacího webu – nejen mezi mnou a Štěpánkou, ale hlavně i s Ariane. Na začátku probíhala komunikace mezi Štěpánkou a Ariane převážně přes e-maily a občasné online cally. Posílání úkolů e-mailem a příloh v příloze ale nebylo moc pružné ani uživatelsky přívětivé. Jsem proto rád, že jsem mohl do procesu přinést Miro a usnadnit tak práci všem zúčastněným. Celé to postupně nabralo pěkné tempo – však posuďte sami. 😀

3.2 Úvod a demografie

Už na začátku testování jsme si uvědomovali, jak důležitá je úvodní obrazovka – tedy to, jak účastníky přivítáme, co jim o testu řekneme a jak je naladíme na celý průběh. Chtěli jsme, aby se testující cítili v klidu a bez stresu, proto jsme úvod doplnili i jednoduchým sdělením:

„Nebojte se, že uděláte při testování chybu – nehodnotíme vás, ale náš web. Každý váš klik a názor nám pomůže ho vylepšit. ❤️“

Zároveň jsme se rozhodli na začátku testu zeptat na několik doplňujících informací: demografické údaje, zkušenost s prací na počítači a také na to, jaký mají testující vztah ke komunitě Villa Vallila. Věděli jsme, že cílové skupiny pojímáme poměrně široce, ale během příprav se nám podařilo některé skupiny sloučit a celkový počet zjednodušit. Než jsme se k tomu dostali, vedli jsme dlouhé diskuze – například nad tím, jaký věk mají mít jednotlivé skupiny návštěvníků, podporovatelů nebo jak široký záběr vůbec chceme testem obsáhnout.

3.3 Jednotlivé testovací metody

Metoda: není 5s málo? (5sekundový test)

Po úvodní stránce se testeři dostali k prvnímu úkolu – tzv. 5sekundovému testu. Na několik vteřin jsme jim zobrazili hlavní stránku webu a po uplynutí času jsme se jich zeptali na několik otázek. Cílem bylo zjistit, co si zapamatovali, co je zaujalo a jak na ně web působil na první pohled. Níže je vidět i proces, jak jsme jednotlivé otázky k tomuto testu tvořili.

Po pilotním kole testování jsme se rozhodli zobrazovací čas lehce navýšit z 5 na 7 sekund – ukázalo se, že pro většinu testerů je to příjemnější a stále dostatečně krátká doba na zachycení prvního dojmu.

Metoda: Card sorting

Strukturu navigačního menu jsme se rozhodli otestovat pomocí metody třídění karet. Původní záměr byl jednoduchý – vypsat hlavní kategorie a jejich podkategorie a nechat testery a testerky, aby je roztřídili podle toho, jak by jim dávalo smysl je na webu najít.

Během přípravy jsme ale narazili na to, že tato forma není pro většinu lidí úplně přirozená. Nakonec jsme se proto rozhodli zvolit přístup postavený na konkrétních otázkách ze života – tedy na tom, co by uživatelé skutečně na webu hledali. Hlavní zadání pro testující pak znělo:

„Ve kterých záložkách byste hledali odpověď na následující otázky?“

Tato forma nám umožnila získat cennější vhled do toho, jak lidé web vnímají a co od něj intuitivně očekávají.

Metoda: Preference test

Dalším testem, který jsme zařadili, byl preference test. Tentokrát jsme zkoumali, v jakém pořadí by uživatelé očekávali záložky „Dokumenty“ a „Spolupracujte s námi“ v hlavním menu. Požadavek na testování vznikl během diskuze nad strukturou a logikou navigace – v týmu nepanovala úplná shoda, a tak jsme se rozhodli zapojit do rozhodování i samotné uživatele.

Metoda: Single tasks

Následovaly interaktivní úkoly, jejichž cílem bylo otestovat konkrétní uživatelské cesty a lépe porozumět způsobu, jakým lidé na webu přemýšlejí. Zadání jednotlivých úkolů najdete níže – jde o jejich první podobu, připravenou před spuštěním pilotního testování.

Na základě zpětné vazby jsme pak ještě některé formulace upravovali, aby byly pro testující co nejsrozumitelnější. Tyto úpravy už probíhaly přímo v nástroji Useberry (https://www.useberry.com/), který jsme použili pro samotné nemoderované testování.

Volné procházení webu před závěrečnými otázkami

V této fázi jsme dali uživatelům volnost – mohli si web sami projít a proklikat bez zadání konkrétního úkolu. Do té doby se pohybovali pouze v rámci předem připravených scénářů, a tak bylo důležité, aby si web „osahali“ i podle vlastního uvážení. Chtěli jsme, aby získali celkový dojem z prostředí a lépe tak odpověděli na otázky v závěrečné části testování.

Pokud ještě neběží finální verze webu, můžete si jeho testovací podobu proklikat zde: 

https://larche-villa-vallila.basa.larche.org/

Závěrečné otázky

Na volné procházení webu navazovala série závěrečných otázek, ve kterých jsme se zaměřili na celkové dojmy, důvěryhodnost a srozumitelnost webu. Hodnocení probíhalo pomocí emoční škály od 1 do 5, kde uživatelé vyjadřovali své pocity z webu.

Ve druhé části jsme použili také otevřené otázky – ptali jsme se, co se jim na webu líbilo či nelíbilo a proč, jestli je něco zmátlo nebo jestli narazili na úkol, který nedokázali dokončit. Zajímala nás nejen fakta, ale i důvody a kontext jejich zkušenosti.

Po vyplnění všech otázek se tester/ka dostal na závěrečnou obrazovku s poděkováním. Zároveň zde měl možnost kliknout na odkaz a porovnat si nový návrh se starou verzí webu.

6. Testování

V rámci procesu navrhování vznikly obrazovky, které znázorňují způsob podávání zpětné vazby z pohledu pacienta a přijmutí zpětné vazby z pohledu lékaře. Je zde zobrazen způsob podání zpětné vazby jak emailem, tak sms zprávou. 
Lékaři přijde zpráva na email a je zároveň nasměrován na portál Entity, kde má možnost celou zprávu vyřídit. Entita ho celým procesem provede, hlídá mu termíny a případně ho spojí s koordinátorem. 

Pohled Pacienta

Pacient obdrží po návštěvě lékaře emailovou výzvu k hodnocení služby a případné zpětné vazbě.
Pacient obdrží po návštěvě lékaře sms výzvu k hodnocení služby a případné zpětné vazbě.

Pohled lékaře

Email, který přijde lékaři v případě, že pacient podá stížnost. Email ho vybízí k řešení stížnosti v portálu Entity.
Portál Entity pro vyřízení stížností. Zahrnuje podporu při vyřizování stížnosti v podobě desatera a AI assistenta.

Testování emailu a platformy Entity (muž 30 - 40 let)

Testování emailu

Rozumíš o čem e-mail je?

Rozumí mu, pamatuje si na situaci.

 

Kdo je odesílatelem e-mailu? Jaký je jeho účel?
Myslí si, že ta paní, rozumí sdělení.

 

Našel jsi všechny informace? Pokud ne, jaké informace bys potřeboval?
Nebylo to dokončené, chyběl tam text ❗nenapadlo ho, že by měl klikat

 

Víš, co máš dělat dál?

Neví, naštvalo ho to. Ta paní když přišla, byla zmatená a neměla tu být ❓pak zmínil, že to nedočetl celé

 

Jaké pocity v tobě e-mail vyvolal? (čím to bylo způsobeno)

Naštvání, protože to byla neoprávněná stížnost.

 Šlo by e-mail udělat tak, abys neměl negativní pocity?
Jsem zaregistrovaný, asi jsem to udělal dobrovolně. Bylo by fajn připomenutí, že jsem tam dobrovolně a že mi to má pomoct.

 

Testování Portálu

…aha, tam jsem to nedočetl, ❗dočetl do jedna – dva -tři❗ . Chybí mi kontext, jak funguje celá služba nebo proces. Je potřeba to vyřešit do 7. 3 a přemýšlím, co dál? ❓Původně jsme měli uvedené přesné datum

 ❗do 7. 3. versus do 30 dnů pro něho není rozdíl

…paní tu neměla co dělat, měla to řešit s těmi, kdo jí sem poslali. Nejraději bych to zahodil. Řekl bych sestře ať ji zavolá, omluví se a zkusí ji znovu vysvětlit situaci.

❗tlačítko generováno AI – nebyl si jistý, zda to je součástí prototypu❗

💡doplnili jsme do hodnocení (1-5) škálu, co je dobré a co je špatné 💡

7. Závěrem

Závěrem bych chtěl říci, že jsem si hackathon v Brně velmi užil. Byla to ideální akce na závěr semestru, během níž jsem měl možnost prakticky si vyzkoušet různé designové metody, o kterých jsem se v uplynulých měsících učil. Podařilo se nám projít celým dvojitým diamantem, i když na testování nám zbylo velmi málo času, a na závěr jsme náš výstup odprezentovali ostatním.

V České republice máme zdravotnictví v porovnání se světem na velmi dobré úrovni, ale i tak je zde mnoho prostoru pro zlepšení! Doufám, že tímto víkendem jsme nastartovali něco, nad čím můžeme dále přemýšlet a případně to v nějaké podobě přenášet do praxe.

Šárko, mrk, mrk 😉.

Přehled toto, čím jsme si prošli
Závěrečná prezentace

designed with ❤️ Jan Stárek