Preskočiť na hlavný obsah
Oficiálna stránka SK

Doména gov.sk je oficálna

Toto je oficiálna webová stránka orgánu verejnej moci Slovenskej republiky. Oficiálne stránky využívajú najmä doménu gov.sk. Odkazy na jednotlivé webové sídla orgánov verejnej moci nájdete na tomto odkaze.

Táto stránka je zabezpečená

Buďte pozorní a vždy sa uistite, že zdieľate informácie iba cez zabezpečenú webovú stránku verejnej správy SR. Zabezpečená stránka vždy začína https:// pred názvom domény webového sídla.

Nová verzia ID-SK Frontend nahradzuje pôvodnú verziu. Dokumentáciu staršej verzie nájdete na ID-SK Elements

  1. ID-SK frontend
  2. Metodické usmernenie
Úvod

Metodické usmernenie

Obsah:

Čo je ID-SK:

ID-SK je jednotný dizajn manuál elektronických služieb Slovenska. Vznikol najmä za účelom:

  • Zaistenia konzistentnosti dizajnu používateľských rozhraní elektronických služieb slovenského e-Governmentu. Bez jeho existencie by služby pôsobili nekonzistentne a zmätočne, občania by služby nepovažovali za dostatočne kredibilné.
  • Zaistenie kvality dizajnu, zdrojového kódu a prístupnosti. Dizajn manuál poskytuje predpripravené komponenty, ktoré sú:
    • responzívne – teda správne sa zobrazujú na rôznych veľkostiach obrazoviek;
    • prístupné – sú použiteľné pre skupiny používateľov so zníženou motorickou alebo zrakovou schopnosťou;
    • použiteľné – implementujú základné heuristiky (best practice) použiteľnosti.

ID-SK sa skladá zo 4 častí:

  • Úvod – obsahuje všeobecný opis ID-SK a princípy tvorby kvalitného používateľského rozhrania.
  • Webové komponenty – táto časť je zdrojom pre komponenty, ktoré budete potrebovať pri tvorbe elektronických služieb, ako napríklad tlačidlo, text, ikony alebo dátové polia. Všetky tieto komponenty sú dodávané s popisom a HTML kódom.
  • Vzory – táto časť sa venuje správnemu používaniu webových komponentov a spôsobu zostavovania služieb, napríklad ako vytvoriť úvodnú stránku elektronickej služby, ako vytvoriť optimálnu následnosť otázok vo formulári alebo ako a kedy si vyžiadať od občana spätnú väzbu na služby.
  • Slovník - pozostáva z názvoslovia používaného v používateľských rozhraniach spolu so špecifikáciou ich správneho použitia.

Čo ID-SK nie je

ID-SK nemá ambíciu nahradiť dizajnový proces. Je len predpisom pre zostavovanie používateľských rozhraní. Použitím ID-SK nezabezpečíte, že služba bude kvalitná a bude poskytovať špičkový používateľský zážitok (User Experience). Aby ste zabezpečili špičkový používateľský zážitok, musíte do procesu tvorby elektronickej služby zahrnúť metodiku UCD – User-centered Design.

Metodika UCD

Elektronické služby štátu by mali byť pripravované metodikou user-centered dizajnu (UCD), aby sa zabezpečila zmysluplnosť a použiteľnosť služieb zo strany koncového používateľa – občana. Na dodržanie user-centered prístupu je nutné rozdeliť prípravnú fázu projektu do 4 fáz:

  • Úvodná analýza a výskum zákazníckych skupín.
  • Návrh navigácie, prototypu a testovanie.
  • Benchmarking používateľského rozhrania.
  • Optimalizácia používateľského rozhrania.

Úvodná analýza a výskum zákazníckych skupín

V prípravnej fáze projektu, kedy je vykonávaná biznis analýza a technická analýza, je nutné analýzy doplniť o výskum správania koncových používateľov, ktorý overí navrhnuté biznis koncepty, doplní očakávania občanov v doméne danej elektronickej služby a zanalyzuje ich motivácie, problémy, znalosti a potreby. Aktivita by mala byť realizovaná ako kvalitatívny výskum s účasťou všetkých relevantných cieľových skupín. Výstupmi takejto aktivity musia byť požiadavky zákazníkov na prínos systému, popis požiadaviek na používateľské rozhranie a argumentácia ako používateľské rozhranie adresuje zdokumentované potreby koncových používateľov. Ďalšími výstupmi môžu byť aj definícia persón alebo definícia zákazníckych ciest.

Návrh navigácie prototypu a testovanie

Realizované používateľské rozhranie musí byť tvorené v aktívnej kooperácii s koncovými používateľmi, aby projekt zabezpečil jeho úplnú použiteľnosť. Používatelia musia byť zapojení do tvorby informačnej architektúry a štruktúry navigácie. Tá by mala byť testovaná kvantitatívne so zapojením všetkých účastných cieľových skupín. Informačná architektúra musí zohľadňovať slovník, ktorý je definovaný v Jednotnom dizajn manuáli elektronických služieb.

Prototyp elektronickej služby musí byť testovaný aspoň 3x počas jeho prípravy so zástupcami všetkých relevantných cieľových skupín metódou formatívneho testovania použiteľnosti, ideálne však na týždennej báze. Zistenia z testovania musia byť následne zapracované do prototypu. Grafický dizajn a frontend programový kód elektronickej služby musí zohľadňovať Jednotný dizajn manuál elektronických služieb.

Benchmarking používateľského rozhrania

Pred uvedením systému do plnej prevádzky musí byť systém otestovaný sumatívnym testovaním použiteľnosti s účasťou všetkých relevantných skupín. Počas testovania budú zdokumentované metriky použiteľnosti (čas úlohy, chybovosť úlohy, efektivita úlohy, SUS skóre) pre kľúčové prípady použitia. Zároveň bude vykonané testovanie prístupnosti systému zohľadňujúce štandardy pre prístupnosť webu WCAG 2.0 AA- Web Content Accessibility Guidelines 2.0).

Používateľské rozhranie by malo spĺňať nasledovné kritéria:

  • namerané SUS skóre je vyššie ako 50 bodov;
  • miera dokončenia kľúčových úloh je vyššia ako 80%;
  • chybovosť kľúčových úloh je nižšia ako 40%.

Optimalizácia analytikou správania používateľa

Po nasadení systému do ostrej prevádzky bude systém iteratívne zlepšovaný na základe meraní z analytických nástrojov. Tieto by mali merať pri najmenšom chybovosť vykonávania úloh, čas úlohy, efektivitu úlohy a pomer transakcií vykonaných v používateľskom rozhraní (online) k počtu transakcií vykonaných pôvodným spôsobom (offline).

Forma výstupov plynúcich z metodiky UCD

V nasledujúcej časti uvádzame odporúčanú formu výstupov, ktoré sú dodávané počas realizácie projektu so zaimplementovanou metodikou User-centered dizajnu.

Report zákazníckeho výskumu

Je dokument, ktorý hĺbkovo analyzuje poznatky zozbierané kvalitatívnym výskumom (rozhovormi so zákazníkmi). Vyhodnocuje sa ním priorita potrieb budúcich používateľov, ich motivácie na používanie produktu, problémy, s ktorými sa aktuálne stretávajú a definuje ich znalostný kapitál. Pozostáva z častí:

  • Metóda výskumu poznatkov
  • Kľúčové požiadavky zákazníkov na prínos systému
  • Zákaznícke cesty (customer journeys) (nie je nutné)
  • Zákaznícke persóny (nie je nutné)

Metóda výskumu poznatkov

Táto časť obsahuje:

  • Použitú metodológiu
  • Scenár výskumu
  • Screener – zoznam špecifických kľúčových charakteristík oslovených používateľov pre daný výskum
  • Priebeh oslovovania a naplnenie screeneru
  • Dátum vykonania výskumu

Kľúčové požiadavky zákazníkov na prínos systému

Táto časť pozostáva z:

  • Opisu kľúčovej požiadavky
  • Rácio požiadavky opisujúcej poznatky z výskumu
  • Návrhu spôsobu validácie požiadavky kvantitatívnym výskumom
  • Konkrétnych návrhovriešení požiadavky v používateľskom rozhraní a ich prioritizácie

Zákaznícke cesty (customer journeys)

Je diagram, ktorý mapuje spôsob používania systému skutočnými zákazníkmi na základe ich doterajších skúseností. Diagram spravidla obsahuje na osi X fázy procesu a na osi Y nasledujúce poznatky pre každú fázu:

  • Diagram aktivít
  • Miesto, zariadenie, kanál
  • Časový horizont
  • Aktivita
  • Motivácia
  • Bariéry
  • Vynaložené úsilie
  • Cieľ a potreba

Zákaznícke cesty by mali uvádzať všetky kľúčové prípady použitia.

Zákaznícke persóny

Sú predstaviteľmi cieľových skupín používateľského rozhrania a agregujú typické správanie skupiny používateľov. Pre každú cieľovú skupinu by mali byť vytvorené 1-3 persóny.

Mapa stránky a/alebo “user flow” (cesty zákazníka)

Oba prístupy (mapa stránky aj “user flow”) môžu byť využité spolu alebo samostatne. Mapa stránky sa používa na popis stromových štruktúr aplikácii alebo webových sídiel. “User flow” (cesty zákazníka) opisuje lineárnu štruktúru aplikácie alebo webového sídla.

Prototyp

Prototyp je skupina čiernobielych skíc používateľského rozhrania (wireframov) vo forme obrázkov, ktoré sú navzájom poprepájané tak, aby používateľom pripomínali skutočné používateľské rozhranie. Wireframy sú pritom pripravené takým spôsobom, aby zohľadňovali pravidlá definované v Jednotnom dizajn manuáli elektronických služieb.

Report formatívneho testovania

Formatívne testovanie použiteľnosti prototypu je vykonané na vzorke aspoň 6 respondentov pre každú relevantnú cieľovú skupinu. Výstupom testovania je report, ktorý obsahuje:

  • Sprioritizovaný zoznam identifikovaných problémov použiteľnosti podľa frekvencie a závažnosti,
  • scenár testovania,
  • screener – zoznam špecifických kľúčových charakteristík oslovených používateľov pre daný výskum,
  • priebeh oslovovania a naplnenie screeneru,
  • dátum vykonania výskumu,
  • popis metodiky testovania.

Report sumatívneho testovania

Sumatívne testovanie použiteľnosti prototypu je vykonané na vzorke aspoň 21 respondentov, ktorí sú zvolení z cieľových skupín používateľského rozhrania. Výstupom testovania je report, ktorý obsahuje:

  • sprioritizovaný zoznam identifikovaných problémov použiteľnosti podľa frekvencie a závažnosti,
  • dokumentáciu meraných metrík pre kľúčové prípady použitia:
    • čas úlohy
    • chybovosť úlohy
    • efektivita úlohy
  • výsledok merania SUS skóre,
  • scenár testovania,
  • screener – zoznam špecifických kľúčových charakteristík oslovených používateľov pre daný výskum,
  • priebeh oslovovania a naplnenie screeneru,
  • dátum vykonania výskumu
  • popis metodiky testovania.

Report testovania prístupnosti

Report musí deklarovať splnenie požiadaviek podľa štandardu WCAG 2.0 AA a podľa výnosu Ministerstva financií Slovenskej republiky č. 55/2014 Z. z. o štandardoch pre informačné systémy verejnej správy.