V rámci platformy, kterou v Cimpress vyvíjíme, mohou firmy řešit kompletně všechno pro svůj byznys – od objednávky až po dodávky dopravcem. Já aktuálně pracuji právě na aplikacích pro nastavte i a správu logistických procesů.
Když jsem do firmy nastoupil, dost aplikací pro logistiku již existovalo. Postupně je tedy rozvíjíme, zlepšujeme a vychytáváme různé mouchy.
Například jednou z věcí, které jsem se v poslední době věnoval (a nejen já) bylo sjednocení využívaných ikon. Za těch pár let se v tom udělal hrozný nepořádek – využívají se různé sady, různé ikony pro stejnou věc, atp. Chtěl jsem tomu dát trochu řád, zjednodušit logiku a všem nám usnadnit práci a lidem usnadnit učení.
Chybí nám jasná pravidla
S ostatními designéry jsme se o ikonách už několikrát bavili. Nejvíce asi v souvislosti toho, jak je používáme napříč celou platformou. Víme o tom, že pro ně nemáme žádná pravidla a situace není ideální.
Současný stav je dán především tím, že UI byla dlouho tvořena:
- Izolovaně bez ohledu na zbytek platformy.
- Bez „designérského“ dohledu.
Říkal jsem si, že s tím samozřejmě mohu pomoct a trochu nás zase posunout dopředu.
Ikonky jsem řešil už když jsme redesignovali jednu z aplikací. V té době jsme totiž zrovna probírali novou sadu ikon, kterou jsme zakoupili. Protože jsem doufal, že nové ikony budeme moct rovnou využít, tak jsem:
- Udělal kompletní revizi rozhraní, že bychom ty nové ikonky mohli rovnou vyzkoušet.
- Sepsal náhrady podle nové verze.
Tenkrát z toho ale nakonec sešlo. Když jsem se o tom s vývojáři bavil, řekli mi například, že by museli:
- Aktualizovat různé knihovny, čímž by rozbili celý front-end.
- Přemapovat všechny ikony, což by bylo dost časově náročné.
No prostě že by to mohly být klidně 3 týdny práce a že na to teď rozhodně není čas. Vše jsme si tedy uložil a s ikonami jsem se na čas přepnul do „vyčkávacího“ módu.
Před pár týdny jsem se s kolegy designéry o ikonách opět bavili. Kolegovi z Indie totiž chyběly nějaké ikony, tak si vytvořil vlastní. Jenže ty trochu kolidovaly s tím, co už využíváme a stylově nezapadaly do námi využívané sady. Řekli jsme si tedy, že už tomu musíme dát konečně nějaký řád.
Mapování a tvorba inventáře
Já už měl něco hotového. Řekl jsem si tedy, že na nic nebudu čekat a trochu s tím pohnu. A třeba kolegům ukážu můj přístup a trochu je zkusím inspirovat. Takže se třeba hneme z místa trochu rychleji.
Jedno odpoledne jsem si tedy sedl a začal jsem ručně procházet jednu aplikaci po druhé (jen v rámci logistiky). Do Confluence jsem poté sepsal:
- Jednotlivé ikony a jejich název v sadě ikon.
- Pro co se jednotlivé ikony používají.
- V jaké aplikaci se používají.
Prošel jsem všech 8 aplikací a objevil jsem:
- 82 různých ikon.
- 120 případů s využitou ikonou.
Díky tomu jsem vlastně zjistil například to, že:
- Máme 2 různé ikony symbolu plus, které zároveň využíváme pro 4 různé akce.
- Máme 3 různé ikony ozubeného kolečka pro nastavení.
- Máme 5 různých ikon pro naznačení možnosti úprav.
Vedle samotných ikon jsem také objevil, že se například:
- Ikony používají jako náhrada pro nějaké komponenty – například tlačítko s ikonou místo check boxu.
- Využívají 3 různé sady ikon – Streamline, FontAwesome a Glyphicons.
Vše jsem tedy prošel a zaznamenal, konkrétně tedy:
- Jednotlivé ikony a jejich název v sadě.
- K čemu se v dané aplikaci využívají.
- V jaké aplikaci se využívají.
- Případnou doplňující poznámku o dané ikoně (třeba jak to funguje).
Na základě ucelených poznámek jsem si poté udělal mapu jednotlivých:
- Akcí,
- Objektů.
Díky tomu jsem mohl mnohem snáz hledat alternativy z aktuální sady ikon. Ale také zároveň přemýšlet nad tím, zda všechny akce či objekty musí být o ikonu doplněny.
Stále na tom pracuji. Aktuálně jsem popsal:
- Základní akce.
- Nejdůležitější objekty.
- Výjimečné případy, kdy se hodí využít jinou ikonu a proč.
Abych lidem trochu usnadnil přemýšlení a zároveň dal využívání ikon určitý řád i dlouhodobě, sepsal jsem také několik základních doporučení, například:
- Využívat ikony pouze v případě, že potřebujeme podpořit význam nějaké věci, abychom lidem pomohli v hledání. Není potřeba využívat ikony pro všechno.
- Nevyužívat ikony pro jinou akci, než pro kterou jsou již využívané.
- Pokud využíváme pouze ikony bez doplňujícího popisku, ujistěte se, že lidé daný symbol znají.
Chci usnadnit lidem práci a zjednodušit rozhraní
Stále ještě není hotovo. Hodně práce mi ještě zbývá, stejně jako zbytek týmu. Rád bych ještě navrhované ikony prošel s ostatními designéry (kterým jsem vše již nasdílel). Pokud nenajdeme nějaký zásadní problém, v dalších krocích bych rád:
- Ikony pokud možno „otestoval“.
- Nechal chybějící ikony přidat do oficiální komponenty.
- Změny probral se všemi Product Ownery a domluvil se s nimi na implementaci.
Opravdu si od toho slibuji, že zjednodušíme způsob, jakým ikony využíváme, trochu odlehčíme rozhraní od přeplněnosti a zároveň usnadníme lidem učení a identifikaci jednotlivých akcí a objektů.
Přeci jen mi přijde zbytečné, abychom za sadu ikon platili, když ji stejně efektivně nevyužíváme. A hlavně chci pomoct ostatním tvořit přehledná a použitelná rozhraní.