Design, který zachraňuje životy: Nové UI pro Codaco

6/26

Komunikace v nemocnici musí být stoprocentně rychlá a jasná. Vteřiny rozhodují. Velkou zásluhu na tom má i český systém pacient–sestra od společnosti Codaco Electronic z Valašského Meziříčí. Pokud jste někdy leželi v nemocnici, s vysokou pravděpodobností jste si pomoc přivolali právě přes jejich zařízení.
Naším úkolem v Divan Design bylo vdechnout tomuto úspěšnému systému novou, moderní a maximálně přehlednou tvář. Navrhli jsme uživatelské rozhraní (UI) pro kompletní hardwarovou řadu – od sluchátek přes čidla a alarmy až po čipové prvky pro registraci personálu u lůžka.

Ergonomie a vizuální řád

Původní, technicky osvědčenou 3D konstrukci prvků jsme zachovali. Plně jsme se ale soustředili na ergonomii, perfektní čitelnost a vizuální jednotu ovládacích fólií. Klíčovou výzvou byl kompletně nový systém ikon, který usnadňuje intuici v krizových situacích. Grafiku fyzických produktů jsme navíc nově propojili s digitálním rozhraním na displejích.
Na obrázcích si můžete prohlédnout srovnání „před“ a „po“, zvažované varianty ikon pro přivolání lékaře a sestry i ukázky komplikovaných konkurenčních systémů.
Právě pohled na konkurenci ukazuje největší úskalí dnešních rozhraní. Problémem je divoká různorodost, nejasnost a nepřehlednost různých variant ikon, které na trhu existují. Když každý výrobce interpretuje stejnou funkci jinak, vzniká vizuální šum. Abychom do tohoto chaosu vnesli jasný řád, museli jsme se vrátit k čistým základům toho, jak vlastně ikony a symboly v lidské mysli fungují.

5 pravidel pro funkční rozhraní (nejen) ve zdravotnictví

Ikony a symboly jsou vizuální zkratky. Jejich účelem je bleskově vyjádřit význam bez nutnosti číst text. Aby fungovaly správně, držíme se těchto principů:

  1. Ikona jako vizuální metafora
    Ikona zobrazuje konkrétní, reálný objekt. Mozek si ji okamžitě spojí s funkcí – jako když vidíte nákupní košík na e-shopu nebo složku v počítači. Úspěšná ikona stojí na sdílené zkušenosti nás všech.
  2. Symbol jako kulturní dohoda
    Symbol je abstraktní. Nemá přímou vazbu na fyzickou věc – jeho význam jsme se jako lidstvo museli naučit. Příkladem jsou tři vodorovné čáry pro „menu“ (hamburger menu), vypínací tlačítko nebo dopravní značky. Fungují jen tehdy, když jsou všeobecně zažité.
  3. Sémantická konzistence
    Vizuální podoba musí stoprocentně odpovídat funkci a opakovat se napříč celým systémem stejně. Jakákoli nekonzistentnost v ikonografii vede u unaveného personálu k frustraci a chybám.
  4. Pozor na kulturní kontext
    Významy nejsou univerzální. Třeba poštovní schránka nebo obálka pro e-mail funguje v západním světě, jinde ale může narazit. U globálních produktů se vyhýbáme příliš specifickým nebo historickým metaforám.
  5. Text jako pomocná ruka
    Když se uživatel s novým systémem teprve seznamuje, pomáhá, když ikonu doprovází krátký popisek. Jakmile si význam zautomatizuje, text se stává nadbytečným a mozek reaguje čistě na tvar a barvu.

Víte, co je Colour-Coding a „hadí“ chyták?

Barvy jako hlavní řidič: Barevné kódování (dané normami i zvykem) je často silnější než samotný tvar. Správná barva navede lidské oko k cíli ještě dřív, než stihne rozpoznat piktogram.
Jeden had, nebo dva? V medicínském designu se neustále dokola objevuje obrovská chyba: zaměňování Aeskulapovy hole a Kaducea. Správný symbol pro medicínu je Aeskulapova hůl s jedním hadem. Kaduceus (se dvěma hady a křídly) je historicky symbolem obchodu a diplomatů. V nemocnici tak nemá co dělat.

Při návrhu pro Codaco Electronic jsme všechny tyto teoretické vrstvy přetavili do čistého, minimalistického designu. Protože vteřiny, které sestra ušetří díky intuitivnímu tlačítku, mohou v nemocničním prostředí znamenat opravdu mnoho.

R0z9uhwk
Ukázka před redesignem vs. po
POROVNÁNÍ
Strovnání
symboly používané konkurencí vs. náš vývoj ikon