Ako sme zjednodušili cestovanie Bratislavským krajom II - Používateľské testovanie

Aneta Stašiková
Aneta Stašiková
Our work
April 7, 2025
5 min read

Wireframes a ich testovanie

Po fáze researchu a zadefinovaní funkcionalít a cieľov pre novú aplikáciu sme sa pustili do kreslenia wireframov. Nekreslili sme celú aplikáciu, to by pre túto fázu bolo zbytočné. Zamerali sme sa na hlavné flowy aplikácie ako je nákup lístka, vyhľadanie trasy či rozšírená registrácia v prípade nákupu električenky ale aj všetky nové funkcionality ako pridanie obľúbenej adresy.

Používateľské testovanie

Testovanie wireframov je efektívnejšie a lacnejšie ako odstraňovanie chýb v dizajne či po vývoji. Testovanie prebehlo s množstvom používateľov z rôznych cieľových skupín, ako napríklad  turista v Bratislave, starší človek, ktorý si kupuje papierové lístky či pravidelný používateľ aplikácie s električenkou.

Ciele testovania:

  • Splnenie hlavných cieľov – overiť, či nová aplikácia pomáha rýchlo a efektívne splniť hlavné ciele používateľa ako je nákup lístka, električenky či vyhľadanie trasy.
  • Identifikácia problémov – identifikovať problémy a frustrácie, ktoré používatelia zažívaju pri interakcii s produktom
  • Testovanie nových funkcií – zistiť, ako používatelia reagujú na nové funkcionality aplikácie

Výsledky testovania

Používateľské testovanie dopadlo nad naše očakávania. Aplikáciu používatelia všeobecne vnímali ako jednoduchú, logickú a vedeli ju bez väčších problémov používať.

Pravdaže, na pár zaujímavých zistení sme prišli:

Magic link funguje

Pre rýchlejšie prihlásenie/registráciu sme sa rozhodli ísť magic linkom. Používateľ si nemusí pamätať heslo, opadá frustrácia ak si ho zabudne a čas ktorý strávi nastavením si nového hesla. Mali sme však obavy, ako na to zareagujú starší používatelia.

Výsledok? Prihlásenie magic linkom poznajú, vedia s ním pracovať, preferujú ho a sú radi, že si nemusia pamätať ďalšie heslo.

Respondenti si pridávali lístky na neskôr

Pri nákupe jednorázového lístka si používateľ môže pridať lístok pre spolucestujúceho/batožinu alebo zviera. Ide o lístok na tú istú trasu, v tom istom čase.Z wireframov to jasné ale nebolo. 50% respondentov si myslelo, že lístok slúži “do zásoby” a budú ho môcť použiť neskôr. Takto by prišli o peniaze a boli by frustrovaní.

V dizajn fáze sme na tento screen pridali výrazný banner, ktorý túto funkcionalitu vysvetľuje.

Disclaimer: Pri testovaní dizajnu mala táto funkcionalita 100% úspešnosť

Turisti by s QR kódom mohli mať problém

Maličkosť, na ktorú by sme bez respondentov neprišli.QR kód aktívneho lístka slúži na to, aby ho pri kontrole revízor zoskenoval, používateľ s ním nemusí robiť nič iné. Pri testovaní sme ale zistili, že používateľom, hlavne turistom ktorý sú zvyknutý na rôzne formy cestovania to nemusí byť jasné. Respondenti si neboli istí, či QR kód musia niekde pri vstupe zoskenovať, ukázať šoférovi alebo čo s ním majú robiť.

Vo finálnej verzii už môžete vidieť, že QR kódu prislúcha menší badge, ktorý vysvetľuje že QR kód slúži pre revízora.

Zastávka, nástupište alebo názov spoja?

Od respondentov sme počas úvodných rozhovorov počuli, že na vyhľadávanie trás používajú Google Maps. Preto sme sa pri detaile trasy vo väčšej miere rozhodli kopírovať zaužívane patterny a rozloženie prvkov z tohto produktu.

Ako to ale dopadlo? Hoci používatelia vedeli akým číslom spoja idú a o akej hodine, väčšina z nich bola zmätená z písomných údajov - názov zastávky a názov spoja. Často si to vymenili, poprípadne zamenili za názov ulice či vôbec nevedeli, čo dané údaje znamenajú.

Počas dizajn fázy sme tieto údaje reorganizovali na základe UX princípov s cieľom zlepšiť prehľadnosť a používateľskú skúsenosť.

Disclaimer: Pri testovaní dizajnu mala táto funkcionalita 100% úspešnosť

Pomoc pri výbere zón

S týmto problémom sme sa stretávali od začiatku projektu. Ľudia nerozumejú zónam. Jednoducho povedané, nevedia, ako sú zóny rozmiestnené, ako súvisia s lístkami a často si kvôli tomu kupujú nesprávne lístky. Tento problém sa opakoval aj pri testovaní wireframov. Hoci vedeli zóny vybrať alebo odobrať, nevedeli, ktoré zóny potrebujú pri nákupe električenky.

Pôvodne sme chceli vytvoriť interaktívnu mapu, ktorá by im pomohla zóny objasniť a vybrať, ale toto riešenie bolo príliš komplikované, zdĺhavé a hlavne finančne náročné. Preto sme sa rozhodli pre jednoduchšiu verziu. Používateľ sa bannerom dostane na obrazovku, kde po zadaní začiatočnej a koncovej zastávky jeho trasy systém zobrazí všetky zóny, cez ktoré trasa prechádza. Jedným klikom si ich môže pridať do nákupu električenky.

Aneta Stašiková

Read what's next

Ako sme zjednodušili cestovanie Bratislavským krajom III - Design

The third part of our IDS BK app redesign series focuses on the final visual design. We cover the creation of the moodboard, visual direction, illustrations, animations, and the design of both light and dark modes.

Ako sme zjednodušili cestovanie Bratislavským krajom II  - Používateľské testovanie

Druhá časť zo série článkov o redizajne aplikácie IDS BK sa venuje tvorbe wireframov a používateľskému testovaniu. Overovali sme hlavné používateľské scenáre, testovali nové funkcie a odhalili cenné poznatky, ktoré nám pomohli vytvoriť intuitívnejšie a prístupnejšie riešenie.

Ako sme zjednodušili cestovanie Bratislavským krajom I - Výskum

Prvá časť zo série článkov o redizajne IDS BK aplikácie. V tomto diele sa venujeme výskumu, kľúčovým zisteniam a tomu, ako sme ich pretavili do funkčnej a prívetivej používateľskej skúsenosti.