Trendy v UX a UI designu pro rok 2021 (+ BONUS: rozšířená realita)

UX/CX Wunderman Thompson Prague
6 min readJun 3, 2021

Některé trendy s námi vydrží roky, jiné zmizí, než si je stačíme vůbec všimnout. Kam se posunul design v posledních letech a kam bude směřovat? To se dnes pokusíme odhadnout v článku.

Jak COVID-19 ovlivnil současný design

Bohužel ani zde se nevyhneme zmínce o koronaviru, který kromě běžného života nás všech, ovlivnil i UX design.

Mimo práce samotných UX designerů (rychlejší vývoj a častější používání kolaborativních nástrojů, testování na dálku), i v designu jako takovém vidíme vliv současných nálad a změny životního stylu. A můžeme jen hádat, o kolik pomalejší nástup by měly bez současné situace.

Spatial: online nástroj pro kolaboraci designerů v prostředí virtuální reality

UI design: devadesátky, barvy a neuspořádané tvary

Trendy v UI a grafickém designu se dají obecně považovat za krátkodobější a víc cool záležitosti.

  1. Neomorfismus, glassmorfismus, gradienty

Populární hlavně v mobilních aplikacích — jednotlivé komponenty se odlišují pouze jemnou hrou stínů a 3D efektu. Vizuálně zajímavé, horší už je to s použitelností pro uživatele s horším zrakem.

Neomorfismus: vystouplé 3D vrstvy
Glassmorfismus — efekt mléčného skla v kombinaci s gradienty

2. 90´ + retro

Devadesátky se vrací v módě i kultuře. A UI design nezůstává pozadu — jak jinak zahnat chmury karantény, než nostalgickým návratem do minulosti?

Je libo velké fonty, barvy i retro tvary?

3. Makro A 3D animace

Mikroanimacím, standardu posledních let, začínají dýchat na záda složitější, vizuálně zajímavější 3D animace.

3D menu
3D prezentace ingrediencí

4. Neuspořádanost, obrovské fonty, neobvyklé navigace

Použitelné zejména pro galerie a umělečtěji zaměřený business.

WAKA WAKA: navigace, obsah i prezentace produktů je neuspořádaná
Neobvyklá navigace na webu galerie

5. Nostalgie a escapismus

Přírodní scenérie, naivní kresby, nostalgické výjevy… touha po návratu do běžného života (spojená s nostalgickými vzpomínkami na dobu „před“) rezonuje i v grafickém designu.

Airbnb: naivní kresby, návrat k přírodě…
Pohlcující vizuály přírody

Chcete vidět web, kde se grafik se současnými trendy opravdu utrhl z řetězu? Podívejte se na https://takearecess.com/ .

UX design: méně doteků, více rovnosti

Pokud si UI design držel od koronaviru pořád poměrně odstup, UX design už do toho šlápl naplno. Kam se posunul uživatelský zážitek?

1. Bezdotykové ovládání (hlasem, gesty)

27 % světové populace využívá hlasové vyhledávání, až 55 % teenagerů využívá hlasové vyhledávání dokonce na denní bázi. Bezdotykové ovládání je trendy už delší dobu, nicméně poptávka se po něm neustále zvyšuje, a to i teď v době pandemie — dalším pádným argumentem je totiž hygiena, např. při placení či ovládání mobilu bez nutnosti na telefon sahat.

Ovládání hlasem jen čím dál populárnější.

2. Biometrické ověření

Ověření otiskem prstu, rohovkou, sítnicí, hlasem či pomocí rysů v obličeji. Trh s nástroji na biometrické ověření roste každým rokem.

Ověření pomocí obličeje.

3. Inkluzivní design

UX designéři začínají stále více ve svých návrzích zohledňovat rozmanitost ve vnímaní pohlaví, ženských a mužských rolí nebo lidského těla.

Google assistant: Rozlišení hlasů podle barev, nikoli pohlaví
Lemonade: Bez specifikace pohlaví partnera
Airbnb: Muži a domácí práce
Lindex: plus-size modelky součástí normálních kolekcí

4. Ještě pokročilejší personalizace

Na nabídky obsahu podle historie sledování už jsme si zvykli jak na Youtube, tak třeba Netflixu. Ten se však rozhodl jít ještě dál a rozhodl se filmům personalizovat i náhledy podle zařazení diváka do konkrétních cílových skupin. Pokud sledujete hlavně romantiku, Netflix vašim preferencím přizpůsobí i vizuály filmů.

Vytvoření cílovek na základě historie sledování
Jiný náhled pro jinou cílovku.

5. Rozvoj zdravotnických a fitness aplikací

Koronavirus přinesl i další zrychlení vývoje, tentokrát lékařských a fitness aplikací. Uživatel si tak může „užít“ stejnou službu, ale s potřebným sociálním distancem.

Silver Chain: návrh VR pro virtuální návštěvu lékaře
Mirror: zábavnější fitness aplikace pro cvičení doma.

BONUS: ponořte se do rozšířené reality

Pojem rozšířená realita chápeme jako zasazení digitálního obsahu z aplikace do reálného světa. Typickým příkladem jsou simulace pro bytový design nebo výběr kosmetiky. Pro co dalšího můžeme tento trend použít?

1. Podpora představivosti

Jednou vidět je lepší než si stokrát představit. Ať už se jedná o výběr kuchyňské linky nebo tetování.

Jak se bude křeslo hodit do vašeho obyváku?
Dub nebo buk?
Rychlá cesta, jak si vybrat obraz pro svůj domov.
Ink hunter: zkouška tetování přímo na kůži

2. Alternativa k mapě

Stačí vytáhnout aplikaci a všechny informace o místech v okolí máte jako na dlani.

Rychlý výběr nejlepšího hotelu v okolí
Zobrazení hodnocení restaurace bez zdlouhavého hledání.

3. Navigace

Nechte se odnavigovat k nejbližšímu nouzovému východu či křupkám ve slevě.

Jak se nejrychleji dostat k svému letadlu?
Navigace po obchodě na základě nákupního seznamu.

4. Skryté vrstvy

Profesní aplikace pro dělníky i neurochirurgy.

Aplikace pro plynaře a stavební firmy.
Díky předchozím screeningům a vytvoření 3D modelu může jít doktor na jistotu.

5. Návody, onboarding

Průmysl teď tvoří největší část zadavatelů pro tzv. „enterprise“ aplikace s rozšířenou realitou.

Aplikace pro zaučení nových techniků.
Pomoc pro automechaniky.

6. Kampaně

Zábavný, interaktivní prvek pro obohacení klasických reklamních kampaní.

Ozvláštnění kampaně na Jacka Danielse.

7. … a mnoho dalších

Jak najít kamarády v davu lidí?
Použití přímo v obchodě.
Jak být za machra, který zná všechny hráče…

Jaká je budoucnost RR?

Zdá se, že růžová. Nejen, že ji čím dál častěji můžeme vidět v reálných aplikacích (úspěšně používá např. Ikea), obecně se dá říct, že zájem o tyto technologie každým rokem stoupá.

Hlavním oblastí, kde se aplikace používají je možná překvapivě průmysl (jak jsme viděli např. u aplikací pro zaučení nových zaměstnanců), jejich podíl však stoupá i u koncových zákazníků. Takže se máme v této oblasti jako UX designeři na co těšit 😊

Chcete si vyzkoušet návrh rozšířené reality? Jde to v Adobe Aero, případně ve Figmě s doplňkem Vectary.

Zdroje:

https://spatial.io/

https://dribbble.com/shots/9158186-Bank-App-Neomorphism-New-Skeuomorphism?utm_source=pinterest&utm_campaign=pinterest_shot&utm_content=Bank+App+-+Neomorphism+New+Skeuomorphism&utm_medium=Social_Share

https://uxdesign.cc/glassmorphism-in-user-interfaces-1f39bb1308c9

https://boards.boldare.com/

https://dribbble.com/shots/4773637-3D-flip-menu

https://www.awwwards.com/sites/the-weed-center

https://wakawaka.world/

https://qodeinteractive.com/catalog/

https://99designs.com/blog/trends/ux-design-trends/

https://99designs.com/profiles/99fella/designs/1717585

https://dribbble.com/shots/14217009-Schedule-a-meeting-VOICE

https://beebom.com/google-assistant-voice-colors/

https://www.lemonade.com/onboarding/

https://airbnb.design/your-face-here/

http://lindex.com/

https://netflixtechblog.com/artwork-personalization-c589f074ad76

https://mspoweruser.com/silver-chain-group-unveils-hololens-powered-holographic-doctor-remote-specialist-consultations/

https://www.mirror.co/

https://gfycat.com/familiarflimsyheifer

--

--