Vždy jsem přemýšlel nad tím, jak udělat uživatelské rozhraní skutečně jednoduché, snadno naučitelné a příjemné na používání. O to by nám designérům mělo jít především (včetně pár dalších věcí). Snažím se tedy do svých návrhů základní principy jako jsou gestalt psychologie, srozumitelný jazyk, konzistenci a tak dále.
Už nějakou dobou přemýšlím právě nad zmíněnou konzistencí. Hlavně nad tím, do jaké míry musí být vše naprosto stejné (konzistentní). Na základě mnoha testování použitelnosti a sledování dat musím říct, že na ní neměli tolik lpět a spíš se – v případě UI prvků – zaměřit na kontextovou konzistenci.
Aby lidé nemuseli přemýšlet…
Dřív jsem nad rozhraním uvažoval tak, že všechno by mělo být stejné. Bez výjimky. Měl jsem načtené různé poučky, heuristiky, principy, atd. Třeba ty od Jakoba Nielsena, který o konzistenci a standardech říká:
“Users should not have to wonder whether different words, situations, or actions mean the same thing.”
Je asi jasné, že pokud pro stejnou věc použiji různé prvky, může to být matoucí. A to hůř, pokud použiji různé názvy pro stejnou věc. (Třeba s tím se v Cimpress potýkáme, proto tvořím jednotný slovník výrazů, který bychom měli používat.)
Díky konzistenci se mohou lidé snáz a rychleji naučit produkt používat. Což je zásadní, hlavně pokud jej potřebují ke své práci. Například manželka v práci využívá v práci pro zadávání dat určitý software. Jenže věci jsou tam různě, takže pro ní bylo složitější se jej naučit ovládat a být v práci efektivní. I tak jí věci trvají dost dlouho (nebo alespoň kolik by chtěla).
Osobně si myslím, že není potřeba brát konzistenci až do absurdna a řešit tím naprosto všechno. Můžeme si to totiž pak trochu zkomplikovat.
Trváme na tom, aby vše bylo 100% stejně
Když se řekne konzistence, dost lidí si pod tím představí, že vše musí být v UI naprosto stejné, tedy nejen názvy, ale i pozice/poloha. Kolikrát už jsem řešil například polohu tlačítek v různých situacích, například:
- Inline editaci,
- V modálním dialogu,
- U průvodce.
Když tedy mají ve svém produktu nějakého průvodce, ve kterém jsou typicky tlačítka na obou stranách a primární je na pravé straně, všechna primární tlačítka by tedy měla být na stejném místě – tedy vpravo.
Dává to smysl a takto to poté v rozhraní vypadá.
Když se to poté vezme do extrému, může to skončit špatně. Jak jsem například jednou viděl u vyhledávání:
- Políčko pro zadávání hledaného výrazu bylo vlevo.
- Tlačítko pro potvrzení hledaného výrazu bylo vpravo.
Tyto dva prvky pak spolu vlastně vizuálně nesouvisí. A lze tedy tlačítko trochu přehlédnout, případně se pídit, k čemu vlastně patří (pokud jsou zde další informace).
Neberme to ale pouze o tlačítkách. Dalším případem může být například i tzv. drawer. Ten dnes najdete ve spoustě produktů a v podstatě je to vlastně jen jiný forma modálního dialogu. Typicky funguje tak, že na něco kliknete a tento dialog vyjede ze strany – typicky zprava.
Co když ale klikneme na tlačítko umístěné na levé straně obrazovky? Není pak kvůli konzistenci zbytečné, že lidé musí přejet na druhou stranu? Mně osobně to nepřipadá jako komfortní řešení nejen pro myš, natož pak pro touchpad.
Zmíněné věci jdou podle mě řešit poměrně efektivně. Když si vezmeme, jak vlastně funguje konzistence, můžeme si pravidla trochu rozdrobit a vlastně je nastavit stejně pro různý kontext – tedy to, v jakém případě je bude potřeba řešit.
Konzistence podle kontextu
Musím říct, že s výše zmíněným jsem (až tedy na ten extrém s vyhledáváním) nezažil nějaké vážnější problémy. Vyjme toho, že lidem prostě někdy trvá, než přejedou přes obrazovku na druhou stranu (a musí si u toho kolikrát posunout myš).
Právě kvůli těm drobným věcem si ale dokáži představit, že se můžeme na řešení podívat trochu jinak. Například tak, že nebudou muset, v případě tlačítek nebo draweru, tolik jezdit po obrazovce, pokud:
- U formuláře budou tlačítka vždy nalevo.
- Průvodce je vlastně tam i zpět, takže tlačítka budou na obou stranách.
- Modální dialog na jedné straně, podle toho, o jaký dialog půjde?
Různé umístění prvků má prostě vliv na to, jak jej budeme vnímat – nejen na to, jak dlouho nám bude trvat, než je zaregistrujeme či použijeme. Podívejme se na příklad in-line editace a toho, jak na nás působí různě umístěna tlačítka.
Jak můžete vidět na obrázku, tak pokud budou tlačítka na:
- Pravé straně, budou vytvářet dojem dvou oddělených skupin (i kdybychom je posunuli blíž k sobě).
- Nalevo budou vytvářet určitou související skupinu.
Když se pak také podíváme na teoretický průchod dialogem, také tam je rozdíl v tom, jak se budou lidé pohybovat.
Přeci jen průchod dialogem bude u tlačítka s prvky nalevo více přímočarý. Samozřejmě ale záleží na jeho obsahu. (O pozicování tlačítek u formulářů píše Luke Wroblewski v knížce Web Form Design.)
Samozřejmě je potřeba zachovat stejný princip i v tomto případě. Pokud tedy mám formulář, u kterého umístím tlačítka vlevo, nemělo by se stát, že budou někde vpravo. (Bude to přinejmenším působit tak, že pravá ruka neví, co dělá levá.)
Podívejme se i na zmíněný drawer. Co kdybychom jej místo pevném usazení na pravé straně otvírali tak, aby to dávalo smysl?
Z mého pohledu je to mnohem příjemnější na používání. Upřímně, lidé si stejně nepamatují, kde se co otevírá. Vlastně nad tím ani tak nepřemýšlí a ani nebudou muset – vše budou to mít hned „pod“ rukou.
Přemýšlím nad tím tak, že aby se lidé skutečně naučili polohu tlačítek, museli by produkty používat poměrně často každý den. Jinak drobné nuance v UI nejsou zase takový problém – tedy alespoň co jsem zatím viděl v rámci testování nebo díky nahraným sezením ve Fullstory.
Věřme svému citu, ale nápady prověřujme
Výše zmíněnými příklady jsem chtěl ukázat, že i takový přístup může pomoct zajistit určitou konzistenci. Ta je důležitá, stejně jako to, aby věci dávaly smysl a lidem se s produkty dobře (a příjemně) pracovalo.
Může to vypadat jako prkotina, ale už jsem podobné případy řešil. Vzpomínám si například na diskuze, které jsme ohledně tohoto vedli v GoodData, nebo které aktuálně vedeme s ostatními designéry v Cimpress. Konzistence je rozhodně potřeba. V některých případech je dokonce nevyhnutelná (například u pojmenování věcí, terminologii). Neměli bychom to s ní přehánět.
Své návrhy vždy testuji, sledují a vyhodnocuji – tedy jak se s nimi lidem pracuje. Až na pár vyjímek jsem se zatím nesetkal s tím, že by měli lidé problém s něčím, co se lišilo podle případu využití – třeba tlačítka na odlišné straně podle typu modálního dialogu.
A tím se řídím. Tedy mít podobná pravidla, aby byla konzistence zajištěna, ale stejně (pokud si nejsem jist) návrhy ověřit a sledovat skutečné používání, abych měl určitou jistotu.