Co je moderní design uživatelského rozhraní? 10 tipů a příkladů
Je pravděpodobné, že možná nebudete moci uvést estetiku moderního uživatelského rozhraní, ale určitě víte, když přistoupíte na web, který jej nepoužívá. Je to prostě cítí ze dne.
Moderní design uživatelského rozhraní pomáhá vytvořit důvěryhodnost pro váš web nebo značku, protože má styl, který vyhovuje tomu, co většina lidí považuje za současnou vizuální estetiku. To může zahrnovat vizuální trendy, přizpůsobení se standardům použitelnosti a vzorům a použití vývojových technik, které jsou vhodné pro dnešní uživatele.
Zde se podíváme na prvky, které najdete v moderních uživatelských rozhraních. Doufejme, že většina z těchto příkladů se jeví docela dobře známá, ale pokud ne, může být čas naplánovat malou aktualizaci webu.
1. Konzistence
Konzistentní uživatelské rozhraní je snadno použitelné a srozumitelné. Lidé nebudou muset tak intenzivně přemýšlet o tom, jak se zapojit do vašeho webu, takže je pravděpodobnější, že budou použity.
Chcete, aby prvky v návrhu byly ve vzájemném souladuBylo by nejlepší přemýšlet o konzistenci dvěma způsoby.
Nejprve chcete, aby rozhraní vypadalo a chovalo se konzistentně z jednoho zařízení na druhé. (Z tohoto důvodu je responzivní design tak důležitý.)
Za druhé, chcete, aby prvky v návrhu byly navzájem konzistentní - například tlačítka, která mají stejnou barvu, velikost a na společných místech - a dodržují obvyklé způsoby použití. Díky tomuto typu konzistence designu je vaše rozhraní moderní a použitelné.
Interaction Design Foundation říká, že konzistence uživatelského rozhraní je důležitá, protože:
- Může to zkrátit dobu učení: Konzistence omezuje počet způsobů, jak jsou akce a operace zastoupeny, a zajišťuje, aby se uživatelé nemuseli učit nové reprezentace pro každý úkol.
- Může to zmást zmatek: Uživatelé mají tendenci uplatňovat pravidla, která zažili mimo váš web nebo produkt, čímž přináší řadu svých vlastních očekávání. S vědomím toho bychom měli mít na paměti, zda způsobujeme zmatek a odcizení, když se odchylujeme od standardů a konvencí designu.
2. Přechody a hloubka
Moderní rozhraní používají barvu k vytvoření hloubky a pomáhají lidem pochopit, jak interagovat s designem.
Populární techniky jsou přechody a jemné stíny. Používání barevných přechodů je spíše módní a poskytuje zajímavý vizuální efekt, který upoutá pozornost. Vržené stíny nejsou pro obecné oko tak zřejmé, ale zdánlivě zvedají prvky z pozadí, aby podporovaly interakci.
3. Účelná animace
Animace je téměř všude, pokud jde o návrh webových stránek, takže je ještě důležitější, aby tato technika nebyla nadužívána.
Moderní rozhraní animuje prvky pouze v případě, že je k tomu důvod. Účelová animace může uživateli pomoci kliknout na tlačítko, poskytnout navigační pokyny, poskytnout pokyny nebo sloužit jako jednoduchá nádherná funkce.
Aby bylo zajištěno, že animace vašich webových stránek budou mít účel a nebudou čisté dekorace, přemýšlejte o cíli animovaného prvku a o tom, jak funguje jako součást celkového designu.
4. Snadno čitelné velikosti písma
Pravděpodobně jste si všimli, že výchozí velikosti textu těla se pomalu zvyšují. Oči všude vám děkují.
Drobné, téměř nečitelné velikosti písma jsou jednou z prvních věcí, které budou mít datum ve vašem uživatelském rozhraní. Lidé si zvykli na větší a čitelnější písma.
Může to být 14 až 16 bodový text na vašem webu. I když se to může zpočátku zdát velké, tato velikost je příjemnější, převádí se na mobilní obrazovku ve čitelné velikosti a stala se docela standardní. (Jen nezapomeňte upravit rozteč řádků na vhodné opatření.)
5. Hlasová rozhraní
Má váš web informace, které uživatelé snadno najdou, když komunikují hlasem? Interaktivní hlasová rozhraní mohou být jedním z nejrychleji rostoucích segmentů designu uživatelského rozhraní.
Svůj web můžete navrhnout tak, aby usnadňoval hlasovým rozhraním a lidem přístup k vašemu obsahu. Ptejte se a odpovídejte na běžné otázky, poskytujte cenné informace v malých kouscích, používejte příklady k vytvoření záměru a používejte vizuální zpětnou vazbu, když rozhraní poslouchá.
Zpráva od Interaction Design Foundation je:
Chcete-li navrhnout skvělá hlasová uživatelská rozhraní, musíte najít elegantní způsob, jak poskytnout uživatelům chybějící informace o tom, co mohou dělat a jak to mohou udělat, aniž by je museli ohromovat.
6. Bezproblémová interakce
Interakce webových stránek musí být plynulé na jednom zařízení i na jednom zařízení.
Uživatelé chtějí stejný zážitek, když přecházejí ze stránky na stránku. Chtějí také, aby web vypadal a jednal stejně na stolních počítačích a telefonech.
Všechna moderní uživatelská rozhraní dodržují tyto pokyny. Pokud váš web nepotřebuje, musíte okamžitě přehodnotit model svého webu a plánovat ihned.
7. Inteligentní formuláře / vstupy
Pryč jsou dny obrovských online formulářů, které vyžadují příliš mnoho informací. Moderní rozhraní používají krátké formuláře, které žádají pouze o to, co je třeba k respektování a respektování času každého uživatele (a krátkého rozpětí pozornosti).
Moderní rozhraní používají inteligentní formuláře a vstupy. To znamená, že jsou požadovány pouze informace, které potřebujete (použijte logiku if-then, pokud je to vhodné) a ověřte data. Posledně jmenované je tak důležité zejména na menších zařízeních, protože je snadné chybně psát a vytvářet chyby; ověření dat říká uživateli, že je něco v pořádku, a zabraňuje frustrace později v procesu.
8. Bezpečné a důvěryhodné
Tenhle je samozřejmé, ale váš web musí být bezpečný a důvěryhodný.
Uživatelé často hledají bezpečný zámek při nakupování a prohlížení, takže je nutné používat SSL a HTTPS. Všechno ostatní je tak 2010.
9. Přizpůsobitelné a přizpůsobené
Více rozhraní nabízí uživatelům více přizpůsobitelné a přizpůsobené služby.
Používání nástrojů, které určují polohu uživatele pro jazykovou a měnovou podporu, jsou soubory cookie, které drží nákupní vozíky několik dní, nebo přihlašovací údaje, které uživatelům umožňují vytvářet více osobních zážitků.
Přizpůsobení a přizpůsobení se stanou bodem rozlišování, které lidem umožní vybrat si váš web před ostatními, když mají na výběr. Tyto malé detaily mohou mít velký význam.
10. Vyvíjí se
Musíte mít design, který se může v průběhu času vyvíjet a měnit.
Říkali jsme, že potřebujete nový design webových stránek každé tři až pět let; Nyní možná budete potřebovat vyladit webové stránky každých 6 měsíců, aby zůstali svěží a relevantní. (Technologie se pohybuje tak rychle.)
Od malých konstrukčních změn až po aktualizace použitelnosti je důležité věnovat pozornost tomu, co vidíte na jiných webech, a přemýšlet o tom, jak by tyto změny a výhody mohly být pro vás přínosem.
Závěr
I když se to na první pohled může zdát, vytvoření moderního uživatelského rozhraní není raketovou vědou. Je to spíš studie chování uživatelů a vzorů a návrhových voleb, které je ovlivňují.
Mezi trendy a moderním designem rozhraní je úzká hranice. Ten má tendenci se držet déle a je trochu více zakořeněný ve funkci a použitelnosti, kde první je většinou estetický.
Začněte s myšlenkou, že webdesign se neustále mění. Pak přemýšlejte o pozitivních a nezapomenutelných webových zkušenostech a zvažte tyto techniky v budoucích revizích vašich rozhraní.
