Prečo riešiť UX/UI dizajn pri vývoji softvéru na mieru od začiatku projektu

Firemný systém môže obsahovať všetky požadované funkcionality a napriek tomu spomaľovať každodennú prácu. Ak spracovanie jednej objednávky vyžaduje prechádzanie viacerými obrazovkami, opakované zadávanie rovnakých údajov alebo dodatočné vysvetľovanie menej bežných situácií, problém nemusí byť vo funkcionalite samotnej, ale v návrhu používateľského toku.

Softvér tak môže byť technicky funkčný, no prevádzkovo neefektívny. Práve tento rozdiel rieši UX/UI dizajn.

Aký je rozdiel medzi UX a UI

UX a UI sa často používajú spoločne, ale neznamenajú to isté.

Oblasť	Čo rieši
UX – user experience	Ako používateľ prostredníctvom systému vykoná svoju úlohu
UI – user interface	Ako vyzerá a funguje konkrétne používateľské rozhranie

 

UX dizajn rieši pracovné postupy, navigáciu, informačnú architektúru, logiku jednotlivých krokov, prevenciu chýb aj spätnú väzbu systému.

UI dizajn tieto princípy premieňa do konkrétneho rozhrania: obrazoviek, formulárov, tlačidiel, typografie, vizuálnej hierarchie a stavov jednotlivých prvkov.

Dobrý UI teda nie je iba „pekný vzhľad“. Musí podporovať úlohu, ktorú chce používateľ vykonať. A dobré UX neznamená, že odborný firemný systém nepotrebuje žiadne školenie. Komplexný skladový, finančný alebo výrobný systém môže vyžadovať znalosť samotného pracovného procesu. Používateľ však nemá potrebovať školenie preto, aby pochopil nejasné tlačidlá, nekonzistentnú navigáciu alebo zbytočne komplikované kroky.

Zlé UX nie je iba otázka komfortu

Ak sa so systémom pracuje zle, následky sa postupne prenesú do každodennej prevádzky. Používateľ môže:

• robiť viac krokov, než úloha reálne potrebuje,
• nesprávne zadávať alebo vynechávať údaje,
• častejšie žiadať pomoc kolegov či podpory,
• vytvárať si vlastné návody a pomôcky,
• zapisovať informácie mimo systému,
• vyhýbať sa niektorým funkciám úplne.

Problém sa potom netýka iba používateľského pohodlia. Zvyšuje sa čas potrebný na vykonanie práce, rastie chybovosť a firma stráca kontrolu nad tým, ako sa proces v skutočnosti vykonáva.

Ak napríklad zamestnanci pravidelne exportujú dáta do Excelu, aby v nich mohli ďalej pracovať, môže ísť o problém rozhrania. Môže to však byť aj širší signál, že systém už nezodpovedá aktuálnym procesom firmy. Ďalšie podobné situácie rozoberáme v článku 5 varovných signálov, že váš súčasný softvér už nestačí.

UX začína ešte pred prvým riadkom kódu

Jednou z najčastejších chýb je predstava, že najskôr vzniknú funkcionality a používateľské rozhranie sa „dorobí“ na konci. UX však nie je grafická vrstva nad hotovým systémom.

Začína otázkami:

• Kto bude systém používať?
• Čo potrebuje používateľ dosiahnuť?
• Ako túto úlohu vykonáva dnes?
• Kde pri nej stráca čas?
• Ktoré informácie potrebuje na rozhodnutie?
• Aké výnimky môžu počas procesu vzniknúť?
• Čo má systém spraviť automaticky a čo má potvrdiť človek?

Preto návrh používateľskej skúsenosti prirodzene nadväzuje na analytickú fázu projektu. Ako vysvetľuje aj analytička ANASOFT v rozhovore „Analýza nie je dokument, ale proces“, podstatou analýzy je pochopenie potrieb a use case-ov, z ktorých následne vzniká funkčný systém. UX tieto poznatky premieňa do pracovných tokov a rozhrania, s ktorým bude používateľ reálne pracovať.

Dobrý návrh nezačína otázkou, kam umiestniť tlačidlo

Ak manažér povie: „Potrebujeme na hlavnej obrazovke tlačidlo na vytvorenie reportu.“ Dizajnér môže tlačidlo nakresliť. Lepší postup je však najskôr zistiť:

• Kto report používa?
• Čo v ňom potrebuje vidieť?
• Ako často ho vytvára?
• Na základe čoho sa potom rozhoduje?
• Musí report vôbec manuálne vytvárať?
• Nemá systém dôležitú informáciu zobraziť automaticky?

Výsledkom môže byť úplne iné riešenie než pôvodne požadované tlačidlo. Táto schopnosť správne formulovať problém je dôležitá aj pri produktovom dizajne. Produktový dizajnér ANASOFT o prepájaní potrieb používateľa, biznisu a technológií hovorí v rozhovore „Najdôležitejšie je vedieť sa dobre pýtať“.

Ako vzniká UX návrh softvéru na mieru

Konkrétny postup závisí od projektu, no návrh používateľskej skúsenosti typicky prechádza niekoľkými úrovňami.

1. Pochopenie používateľov a ich práce

Najskôr treba zistiť, kto bude systém používať a v akom kontexte. Účtovník pracujúci väčšinu dňa pri počítači potrebuje iné rozhranie než servisný technik používajúci telefón v teréne.

Rozdielne potreby má aj:

• skladník pracujúci so skenerom,
• administratívny pracovník spracúvajúci desiatky podobných záznamov,
• manažér sledujúci najmä výnimky a výsledky,
• zákazník, ktorý sa do portálu prihlási iba niekoľkokrát ročne.

UX sa preto nenavrhuje pre abstraktného „používateľa“, ale pre konkrétne roly, úlohy a podmienky práce.

2. Používateľské toky

Následne sa navrhne, ako má používateľ prejsť konkrétnou úlohou. Napríklad:

prijatie požiadavky → kontrola údajov → rozhodnutie → potvrdenie → ďalší proces.

Tu sa dajú odhaliť:

• nepotrebné kroky,
• duplicitné zadávanie údajov,
• nejasné rozhodnutia,
• chýbajúce informácie,
• procesné výnimky.

Cieľom pritom nie je dosiahnuť čo najmenší počet kliknutí za každú cenu. Štyri jasné a bezpečné kroky môžu byť lepšie než jedna preplnená obrazovka. Dôležité je odstrániť kroky, ktoré neprinášajú používateľovi, procesu ani kontrole žiadnu hodnotu.

3. Wireframy

Wireframe je jednoduchý návrh obrazovky, ktorý ukazuje rozloženie informácií a prvkov bez finálneho vizuálneho dizajnu. Pomáha overiť napríklad:

• ktoré informácie musia byť viditeľné,
• čo má mať na obrazovke prioritu,
• ako používateľ prejde k ďalšiemu kroku,
• ktoré funkcie patria k sebe.

V tejto fáze sa rieši predovšetkým logika.

4. Interaktívny prototyp

Z wireframov môže vzniknúť klikateľný prototyp, na ktorom sa dá simulovať používanie budúceho systému ešte pred jeho naprogramovaním. Používateľ si môže skúsiť napríklad:

• založiť objednávku,
• vyhľadať zákazníka,
• schváliť požiadavku,
• vyriešiť chybu,
• dokončiť konkrétny pracovný proces.

Tím tak nezískava spätnú väzbu na abstraktný zoznam požiadaviek, ale na niečo, čo sa už podobá budúcemu systému.

5. Používateľské testovanie

Prototyp by mali vyskúšať ľudia, ktorí budú s výsledným systémom skutočne pracovať. Namiesto otázky: „Páči sa vám táto obrazovka?“ je užitočnejšie zadať konkrétnu úlohu: „Prišla nová objednávka od existujúceho zákazníka. Skúste ju zaevidovať a odovzdať na spracovanie.“ Sleduje sa, či používateľ:

• vie, kde začať,
• rozumie dostupným možnostiam,
• nachádza potrebné informácie,
• robí chyby,
• dokončí úlohu bez pomoci.

Problém objavený v prototype možno upraviť ešte pred tým, než sa stane súčasťou implementovaného riešenia.

Ako vyzerá používateľsky dobrý firemný softvér

Neexistuje jedno rozhranie, ktoré by bolo správne pre všetkých. Dobré UX však zvyčajne dodržiava niekoľko základných princípov.

Zobrazuje informácie podľa úlohy a roly

Skladník nepotrebuje na pracovnej obrazovke kompletnú finančnú analytiku. Manažér zasa nemusí sledovať každý jednotlivý skladový pohyb. Rozhranie má používateľovi prioritne ukázať to, čo potrebuje pre svoju prácu a rozhodovanie.

Znižuje opakovanú manuálnu prácu

Ak už systém určitú informáciu pozná, nemal by používateľa bezdôvodne nútiť zadávať ju znova. Údaje možno napríklad:

• automaticky doplniť,
• prevziať z iného systému,
• predvyplniť podľa kontextu,
• ponúknuť na potvrdenie.

Predchádza chybám

Dobré rozhranie používateľa nenechá najskôr urobiť chybu a až potom mu oznámi, že niečo nefunguje. Môže mu vopred ukázať:

• ktoré údaje chýbajú,
• aký formát sa očakáva,
• čo bude mať operácia za následok,
• ktoré možnosti v danej situácii nedávajú zmysel.

Používa jazyk používateľa

Pomenovania funkcií a polí by mali zodpovedať terminológii, ktorú ľudia používajú pri práci. Interná technická štruktúra aplikácie nemusí určovať slovník používateľského rozhrania.

Zohľadňuje prostredie

Rozhranie používané v kancelárii na veľkom monitore môže obsahovať viac údajov než mobilná aplikácia používaná v teréne. Podobne treba pri návrhu myslieť na čitateľnosť, kontrast, ovládanie klávesnicou, veľkosť aktívnych prvkov, chybové stavy či ďalšie aspekty prístupnosti. Použiteľnosť vzniká v kontexte reálnej práce.

Ako zistíte, že UX existujúceho systému nefunguje dobre

Problematické UX sa nemusí prejaviť ako jednoznačná chyba systému. Častejšie ho prezradí správanie používateľov.

Používatelia vytvárajú vlastné obchádzky

Excel, poznámkové bloky, vlastné zoznamy či paralelné evidencie často vznikajú preto, že používateľ v systéme nedokáže jednoduchým spôsobom urobiť to, čo potrebuje.

Bežné úlohy vyvolávajú opakované otázky

Ak podpora alebo skúsení kolegov stále odpovedajú na rovnaké otázky, treba preveriť, či problém nemožno vyriešiť priamo návrhom rozhrania.

Rutinné činnosti spôsobujú chyby

Opakované chyby na rovnakom mieste môžu naznačovať, že formulácia, poradie krokov alebo spätná väzba systému nie sú dostatočne zrozumiteľné.

Noví ľudia sa učia systém, nie svoju prácu

Komplexný proces môže prirodzene vyžadovať školenie. Ak však veľkú časť školenia tvorí vysvetľovanie, kde sa nachádzajú funkcie a ako obísť zvláštnosti rozhrania, existuje priestor na zlepšenie UX.

Časť systému sa prakticky nepoužíva

Funkcionalita môže technicky fungovať, no ak je príliš komplikovaná alebo neprirodzená pre reálny pracovný tok, používatelia si nájdu inú cestu.

Ako merať, či sa UX skutočne zlepšilo

Použiteľnosť sa nemusí hodnotiť iba podľa pocitu. Pred zmenou a po nej možno sledovať konkrétne ukazovatele.

Ukazovateľ	Čo môže odhaliť
Čas dokončenia úlohy	Zbytočne komplikované kroky
Chybovosť	Nejasné alebo rizikové časti procesu
Úspešnosť úlohy	Či používateľ dokáže proces dokončiť
Požiadavky na podporu	Miesta, ktorým používatelia nerozumejú
Čas zaškolenia	Náročnosť osvojenia systému

 

Dôležité je merať úlohy, ktoré majú pre firmu reálny význam. Pri objednávkovom systéme môže byť dôležitý čas spracovania objednávky. Pri internom schvaľovaní počet vrátených požiadaviek. Pri zákazníckom portáli podiel úloh, ktoré zákazník dokončí bez kontaktovania podpory. UX sa tak prepája s konkrétnym výkonom procesu.

Najčastejšie chyby pri návrhu UX/UI

Najskôr vyvinieme funkcie, dizajn vyriešime neskôr

Ak už technická architektúra predurčila používateľský tok, môže byť neskoršia zmena rozhrania náročnejšia, než keby sa scenár overil pred implementáciou.

Skopírujeme starý systém

Pri modernizácii môže byť lákavé jednoducho preniesť existujúce obrazovky do novej technológie. Tým sa však do nového systému môžu preniesť aj staré neefektívne procesy.

Rozhranie navrhne iba vedenie alebo projektový tím

Manažér, analytik a koncový používateľ vidia proces z rozdielnej perspektívy. Návrh bez používateľov môže byť logický z pohľadu projektu, ale nepraktický v každodennej prevádzke.

UX sa zamieňa za grafický dizajn

Nová farebnosť alebo modernejšie ikony nevyriešia zlý pracovný tok. Ak používateľ stále vykonáva sedem zbytočných krokov, vizuálne krajšia verzia zostáva sedemkrokovým problémom.

Testovanie začne až po dokončení vývoja

Čím neskôr firma zistí, že pracovný tok používateľom nevyhovuje, tým viac už môže byť na danom rozhodnutí postavených ďalších častí systému.

1. Preto je prototypovanie jedným zo spôsobov, ako znižovať zbytočnú zložitosť ešte pred implementáciou. Podobný princíp rozoberáme aj v článku o tom, ako sa vyhnúť zbytočnému komplikovaniu softvérového projektu na mieru.

Dobrý návrh neznamená viac dizajnu. Znamená menej prerábania

UX/UI dizajn pri softvéri na mieru nemá za cieľ vytvoriť čo najviac obrazoviek alebo čo najefektnejšie rozhranie. Jeho úlohou je overiť, či navrhovaný systém:

• podporuje reálny pracovný proces,
• poskytuje používateľovi potrebné informácie,
• nevyžaduje zbytočnú manuálnu prácu,
• pomáha predchádzať chybám,
• funguje pre rozdielne používateľské roly,
• a dá sa rozumne rozvíjať spolu s firmou.

Práve preto sa UX oplatí riešiť ešte pred programovaním. Čím skôr firma overí, ako majú ľudia so systémom pracovať, tým skôr môže odhaliť nesprávny predpoklad, zbytočný krok alebo chýbajúcu informáciu. Výsledkom nie je iba príjemnejší softvér. Je to systém lepšie prispôsobený práci, ktorú má podporovať.

Máte systém, ktorý ľudia používajú inak, než ste plánovali?

Excelové obchádzky, opakované otázky, chybné zadávanie údajov alebo komplikované každodenné úlohy môžu mať spoločnú príčinu: softvér už nezodpovedá tomu, ako firma reálne pracuje.

Pri návrhu softvéru na mieru je preto vhodné najskôr zmapovať pracovné scenáre, používateľské roly a procesy a až následne rozhodnúť, ktoré funkcionality a rozhrania treba vytvoriť. ANASOFT poskytuje aj , ktoré pomáhajú previesť biznis potreby do návrhu budúceho riešenia.

Najčastejšie otázky