BankSim

ineo, GetOne
UX/UI designer
2016-2017

„Simulace banky vyvinutá týmem ineo ve spolupráci s odborníky z českých bank i z ČNB je jedinečný produkt svého druhu. Na velkoformátových tabletech umožňuje týmům účastníků vžít se do řízení celé banky, od získávání klientů, řízení portfolia či investic do rozvoje až po analýzu finančních výkazů a regulatorních ukazatelů.“

— Jakub Güttner, ineo (zdroj: ineo)

Má role

UX a UI designer — rozložení a rozdělení pracovní plochy aplikace, návrh vizuálního stylu, komponent a interakce prvků.

Testování funkčnosti designu při prvotních implementacích simulace na dotykové televizi.


Problém

Simulace banky se vším, co vedení banky, poboček, úvěrů,… obnáší. Vše rozděleno na jediné obrazovce tak, aby obsluha byla intuitivní, ukazetele přehledně rozmístěny a zabaleno do přívětivého a funkčního designu.

Nejdříve jsme museli vstřebat požadavky klienta. Které oblasti modelu banky budeme simulovat. Kdo budou přesně účastníci školení a jak dlouho bude školení probíhat.


Ideace

Nejdříve jsme hodili vše na stůl. Doslova. Začali jsme zvolením pracovní plochy. Tedy rozměry reálné dotykové televize jako velkého papíru. Dále jsme určili všechny komponenty simulace (části procesů) modelu banky. Zkoušeli jsme si říct, kde budou spíše textová data a kde data grafická (grafy, ikony,…). Tohle jsme opakovali, dokud nebyly všechny komponenty umístěny. Nutno říct, že zadavatel perfektně věděl, co všechno v simulaci musí být, jak spolu komponenty souvisí a zhruba styl jejich znázornění.

Pak jsem přešel k vytváření digitálních podkladů. V dané době jsem zvolil kombinaci Illustrator/InDesign a to pro jejich perfektní práci s vektory a styly.

Od počátku bylo jisté, že:

  • bude použit minimalistický styl designu, protože množství zobrazených informací bude značné;
  • aplikace bude typograficky jednoduchá, protože minimální použitelná velikost zvoleného písma (dle identity ineo) bude i tak velká a nebyl tak prostor pro velikostní škálování. Využity byly hlavně priority barev a síly písma;
  • barvy by mohly vycházet z identity ineo (fialová a zelená), což sice nebyl požadavek, ale v řešení to funguje;
  • grafy mohou být komplexní;
  • doplňující grafika musí být konzistentní, na míru a nepůjde použít zdrojů ikonobank

image


zdroj: ineo

Řešení & výsledek / design

Text…



Jakým problémům jsme čelili

Již při prvních testech na reálném zařízení jsem objevil několik věcí, které by bez opravy zhatily celý projekt. A to:

  • styl musel být nutně “dark mode”. Protože LCD doslova topí, pokud jsou bílé/světlé plochy ve větší míře než několik cm2. Obrazovka se používá hodně z blízka a několik hodin denně. Po pár sekundách bylo jisté, že cesta se světlým designem je nepoužitelná. Navíc tmavá/černá tolik nenamáhá oči;
  • písmo fungovalo jen v některých velikostech. Např. 13px bylo mázlé, ale 12,5px již OK. Opět byla na vině technologie obrazovky;
  • vykreslení grafů pomocí Unity nebylo “pixel-perfect”. Nástroj zejm. osy mírně zkosil, což jsme dlouze ladili.

Přínos pro uživatele & business

Hodnocení k hotovému produktu se školením a zázemím:

“Zvolená forma – interaktivní školení, kdy dopady jednotlivých kroků a rozhodnutí účastníci přímo vidí – je přesně forma, která se musí líbit. Zároveň nutí účastníky opravdu probírané sledovat a rozmýšlet do hloubky. Velmi důležitou roli hrály velké znalosti organizátorů či spíše průvodců oběma dny. Bonusem je filozofie celého semináře, interaktivita, která vede účastníky k intenzívní spolupráci. Drobně bych upravil Komenského slogan na „Díky Ineo, banka hrou“ :).”

— Vladimír Bareš, Business Development and Support Director, ČSOB (zdroj: ineo)

Dále recenze na HR inews.


Co mi projekt přinesl

Reálný výsledek byl vidět po mnoha měsících vývoje a testování. Bylo perfektní, že ode dne, kdy proběhlo zadání a nalepení prvních post-itů, bylo možné testovat reálný design na fyzickém zařízení do týdne. Že se tak mohly odladit chyby, které by se jinak táhly a později těžko opravovaly.