Proč řešit UX/UI design při vývoji softwaru na míru od začátku projektu

Firemní systém může obsahovat všechny požadované funkcionality, a přesto zpomalovat každodenní práci. Pokud zpracování jedné objednávky vyžaduje procházení několika obrazovkami, opakované zadávání stejných údajů nebo dodatečné vysvětlování méně běžných situací, problém nemusí spočívat v samotné funkcionalitě, ale v návrhu uživatelského toku.

Software tak může být technicky funkční, ale provozně neefektivní. Právě tento rozdíl řeší UX/UI design.

Jaký je rozdíl mezi UX a UI

UX a UI se často používají společně, ale neznamenají totéž.

Oblast	Co řeší
UX – user experience	Jak uživatel prostřednictvím systému provede svůj úkol
UI – user interface	Jak vypadá a funguje konkrétní uživatelské rozhraní

 

UX design řeší pracovní postupy, navigaci, informační architekturu, logiku jednotlivých kroků, prevenci chyb i zpětnou vazbu systému.

UI design tyto principy převádí do konkrétního rozhraní: obrazovek, formulářů, tlačítek, typografie, vizuální hierarchie a stavů jednotlivých prvků.

Dobré UI tedy není jen „pěkný vzhled“. Musí podporovat úkol, který chce uživatel provést. A dobré UX neznamená, že odborný firemní systém nevyžaduje žádné školení. Komplexní skladový, finanční nebo výrobní systém může vyžadovat znalost samotného pracovního procesu. Uživatel by však neměl potřebovat školení k tomu, aby pochopil nejasná tlačítka, nekonzistentní navigaci nebo zbytečně komplikované kroky.

Špatné UX není jen otázkou komfortu

Pokud se se systémem pracuje špatně, následky se postupně přenesou do každodenního provozu. Uživatel může:

• provádět více kroků, než úkol skutečně vyžaduje,
• nesprávně zadávat nebo vynechávat údaje,
• častěji žádat o pomoc kolegy či podporu,
• vytvářet si vlastní návody a pomůcky,
• zapisovat informace mimo systém,
• některým funkcím se zcela vyhýbat.

Problém se pak netýká jen uživatelského pohodlí. Prodlužuje se čas potřebný k provedení práce, roste chybovost a firma ztrácí kontrolu nad tím, jak se proces ve skutečnosti provádí.

Pokud například zaměstnanci pravidelně exportují data do Excelu, aby s nimi mohli dále pracovat, může jít o problém rozhraní. Může to však být i širší signál, že systém již neodpovídá aktuálním procesům firmy. Další podobné situace rozebíráme v článku 5 varovných signálů, že váš současný software již nestačí.

UX začíná ještě před prvním řádkem kódu

Jednou z nejčastějších chyb je představa, že nejprve vzniknou funkcionality a uživatelské rozhraní se na konci „dodělá“. UX však není grafická vrstva nad hotovým systémem.

Začíná otázkami:

• Kdo bude systém používat?
• Čeho potřebuje uživatel dosáhnout?
• Jak tento úkol provádí dnes?
• Kde při něm ztrácí čas?
• Které informace potřebuje k rozhodnutí?
• Jaké výjimky mohou během procesu nastat?
• Co má systém udělat automaticky a co má potvrdit člověk?

Proto návrh uživatelské zkušenosti přirozeně navazuje na analytickou fázi projektu. Jak vysvětluje i analytička ANASOFT v rozhovoru „Analýza není dokument, ale proces“, podstatou analýzy je pochopení potřeb a use caseů, z nichž následně vzniká funkční systém. UX tyto poznatky převádí do pracovních toků a rozhraní, se kterým bude uživatel skutečně pracovat.

Dobrý návrh nezačíná otázkou, kam umístit tlačítko

Pokud manažer řekne: „Potřebujeme na hlavní obrazovce tlačítko pro vytvoření reportu.“ Designér může tlačítko nakreslit. Lepší postup je však nejprve zjistit:

• Kdo report používá?
• Co v něm potřebuje vidět?
• Jak často ho vytváří?
• Na základě čeho se pak rozhoduje?
• Musí report vůbec vytvářet ručně?
• Neměl by systém důležitou informaci zobrazit automaticky?

Výsledkem může být zcela jiné řešení než původně požadované tlačítko. Tato schopnost správně formulovat problém je důležitá i při produktovém designu. Produktový designér ANASOFT o propojování potřeb uživatele, byznysu a technologií hovoří v rozhovoru „Nejdůležitější je umět se dobře ptát“.

Jak vzniká UX návrh softwaru na míru

Konkrétní postup závisí na projektu, ale návrh uživatelské zkušenosti obvykle prochází několika úrovněmi.

1. Pochopení uživatelů a jejich práce

Nejprve je třeba zjistit, kdo bude systém používat a v jakém kontextu. Účetní pracující většinu dne u počítače potřebuje jiné rozhraní než servisní technik používající telefon v terénu.

Rozdílné potřeby má také:

• skladník pracující se skenerem,
• administrativní pracovník zpracovávající desítky podobných záznamů,
• manažer sledující především výjimky a výsledky,
• zákazník, který se do portálu přihlásí pouze několikrát ročně.

UX se proto nenavrhuje pro abstraktního „uživatele“, ale pro konkrétní role, úkoly a pracovní podmínky.

2. Uživatelské toky

Následně se navrhne, jak má uživatel projít konkrétním úkolem. Například:

přijetí požadavku → kontrola údajů → rozhodnutí → potvrzení → další proces.

Zde lze odhalit:

• nepotřebné kroky,
• duplicitní zadávání údajů,
• nejasná rozhodnutí,
• chybějící informace,
• procesní výjimky.

Cílem přitom není za každou cenu dosáhnout co nejmenšího počtu kliknutí. Čtyři jasné a bezpečné kroky mohou být lepší než jedna přeplněná obrazovka. Důležité je odstranit kroky, které nepřinášejí uživateli, procesu ani kontrole žádnou hodnotu.

3. Wireframy

Wireframe je jednoduchý návrh obrazovky, který ukazuje rozložení informací a prvků bez finálního vizuálního designu. Pomáhá ověřit například:

• které informace musí být viditelné,
• co má mít na obrazovce prioritu,
• jak uživatel přejde k dalšímu kroku,
• které funkce patří k sobě.

V této fázi se řeší především logika.

4. Interaktivní prototyp

Z wireframů může vzniknout klikatelný prototyp, na kterém lze simulovat používání budoucího systému ještě před jeho naprogramováním. Uživatel si může vyzkoušet například:

• založit objednávku,
• vyhledat zákazníka,
• schválit požadavek,
• vyřešit chybu,
• dokončit konkrétní pracovní proces.

Tým tak nezískává zpětnou vazbu k abstraktnímu seznamu požadavků, ale k něčemu, co se již podobá budoucímu systému.

5. Uživatelské testování

Prototyp by měli vyzkoušet lidé, kteří budou s výsledným systémem skutečně pracovat. Místo otázky: „Líbí se vám tato obrazovka?“ je užitečnější zadat konkrétní úkol: „Přišla nová objednávka od stávajícího zákazníka. Zkuste ji zaevidovat a předat ke zpracování.“ Sleduje se, zda uživatel:

• ví, kde začít,
• rozumí dostupným možnostem,
• nachází potřebné informace,
• dělá chyby,
• dokončí úkol bez pomoci.

Problém objevený v prototypu lze upravit ještě předtím, než se stane součástí implementovaného řešení.

Jak vypadá uživatelsky přívětivý firemní software

Neexistuje jedno rozhraní, které by bylo správné pro všechny. Dobré UX však obvykle dodržuje několik základních principů.

Zobrazuje informace podle úkolu a role

Skladník nepotřebuje na pracovní obrazovce kompletní finanční analytiku. Manažer zase nemusí sledovat každý jednotlivý skladový pohyb. Rozhraní má uživateli přednostně ukázat to, co potřebuje pro svou práci a rozhodování.

Snižuje opakovanou manuální práci

Pokud již systém určitou informaci zná, neměl by uživatele bezdůvodně nutit zadávat ji znovu. Údaje lze například:

• automaticky doplnit,
• převzít z jiného systému,
• předvyplnit podle kontextu,
• nabídnout k potvrzení.

Předchází chybám

Dobré rozhraní nenechá uživatele nejprve udělat chybu a teprve poté mu oznámí, že něco nefunguje. Může mu předem ukázat:

• které údaje chybějí,
• jaký formát se očekává,
• jaké důsledky bude operace mít,
• které možnosti v dané situaci nedávají smysl.

Používá jazyk uživatele

Názvy funkcí a polí by měly odpovídat terminologii, kterou lidé používají při práci. Interní technická struktura aplikace nemusí určovat slovník uživatelského rozhraní.

Zohledňuje prostředí

Rozhraní používané v kanceláři na velkém monitoru může obsahovat více údajů než mobilní aplikace používaná v terénu. Podobně je třeba při návrhu myslet na čitelnost, kontrast, ovládání klávesnicí, velikost aktivních prvků, chybové stavy či další aspekty přístupnosti. Použitelnost vzniká v kontextu reálné práce.

Jak zjistíte, že UX stávajícího systému nefunguje dobře

Problematické UX se nemusí projevit jako jednoznačná chyba systému. Častěji je odhalí chování uživatelů.

Uživatelé si vytvářejí vlastní způsoby obcházení

Excel, poznámkové bloky, vlastní seznamy či paralelní evidence často vznikají proto, že uživatel v systému nedokáže jednoduše udělat to, co potřebuje.

Běžné úkoly vyvolávají opakované otázky

Pokud podpora nebo zkušení kolegové stále odpovídají na stejné otázky, je třeba prověřit, zda problém nelze vyřešit přímo návrhem rozhraní.

Rutinní činnosti způsobují chyby

Opakované chyby na stejném místě mohou naznačovat, že formulace, pořadí kroků nebo zpětná vazba systému nejsou dostatečně srozumitelné.

Noví lidé se učí systém, nikoli svou práci

Komplexní proces může přirozeně vyžadovat školení. Pokud však velkou část školení tvoří vysvětlování, kde se nacházejí funkce a jak obejít zvláštnosti rozhraní, existuje prostor pro zlepšení UX.

Část systému se prakticky nepoužívá

Funkcionalita může technicky fungovat, ale pokud je příliš komplikovaná nebo nepřirozená pro reálný pracovní tok, uživatelé si najdou jinou cestu.

Jak měřit, zda se UX skutečně zlepšilo

Použitelnost nemusí být hodnocena pouze podle pocitu. Před změnou a po ní lze sledovat konkrétní ukazatele.

Ukazatel	Co může odhalit
Doba dokončení úkolu	Zbytečně komplikované kroky
Chybovost	Nejasné nebo rizikové části procesu
Úspěšnost úkolu	Zda uživatel dokáže proces dokončit
Požadavky na podporu	Místa, kterým uživatelé nerozumějí
Doba zaškolení	Náročnost osvojení systému

 

Důležité je měřit úkoly, které mají pro firmu skutečný význam. U objednávkového systému může být důležitá doba zpracování objednávky. U interního schvalování počet vrácených požadavků. U zákaznického portálu podíl úkolů, které zákazník dokončí bez kontaktování podpory. UX se tak propojuje s konkrétním výkonem procesu.

Nejčastější chyby při návrhu UX/UI

Nejprve vyvineme funkce, design vyřešíme později

Pokud již technická architektura předurčila uživatelský tok, může být pozdější změna rozhraní náročnější, než kdyby byl scénář ověřen před implementací.

Zkopírujeme starý systém

Při modernizaci může být lákavé jednoduše převést stávající obrazovky do nové technologie. Tím se však do nového systému mohou přenést i staré neefektivní procesy.

Rozhraní navrhne pouze vedení nebo projektový tým

Manažer, analytik a koncový uživatel vidí proces z rozdílné perspektivy. Návrh bez uživatelů může být logický z pohledu projektu, ale nepraktický v každodenním provozu.

UX se zaměňuje za grafický design

Nová barevnost nebo modernější ikony nevyřeší špatný pracovní tok. Pokud uživatel stále provádí sedm zbytečných kroků, vizuálně hezčí verze zůstává sedmikrokovým problémem.

Testování začne až po dokončení vývoje

Čím později firma zjistí, že pracovní tok uživatelům nevyhovuje, tím více dalších částí systému již může být na daném rozhodnutí postaveno.

Proto je prototypování jedním ze způsobů, jak snižovat zbytečnou složitost ještě před implementací. Podobný princip rozebíráme také v článku o tom, jak se vyhnout zbytečnému komplikování softwarového projektu na míru.

Dobrý návrh neznamená více designu. Znamená méně předělávání

UX/UI design u softwaru na míru nemá za cíl vytvořit co nejvíce obrazovek nebo co nejefektnější rozhraní. Jeho úkolem je ověřit, zda navrhovaný systém:

• podporuje reálný pracovní proces,
• poskytuje uživateli potřebné informace,
• nevyžaduje zbytečnou manuální práci,
• pomáhá předcházet chybám,
• funguje pro různé uživatelské role,
• a lze jej rozumně rozvíjet spolu s firmou.

Právě proto se vyplatí UX řešit ještě před programováním. Čím dříve firma ověří, jak mají lidé se systémem pracovat, tím dříve může odhalit nesprávný předpoklad, zbytečný krok nebo chybějící informaci. Výsledkem není jen příjemnější software. Je to systém lépe přizpůsobený práci, kterou má podporovat.

Máte systém, který lidé používají jinak, než jste plánovali?

Obcházení pomocí Excelu, opakované otázky, chybné zadávání údajů nebo komplikované každodenní úkoly mohou mít společnou příčinu: software již neodpovídá tomu, jak firma skutečně pracuje.

Při návrhu softwaru na míru je proto vhodné nejprve zmapovat pracovní scénáře, uživatelské role a procesy a teprve následně rozhodnout, které funkcionality a rozhraní je třeba vytvořit. ANASOFT poskytuje také , které pomáhají převést byznysové potřeby do návrhu budoucího řešení.

Nejčastější dotazy