UX ja UI disaini trendid, mida iga disainer peaks teadma – Osa 2

Jätkame väga populaarse artiklisarjaga, mis tutvustab UX ja UI trende (eelmist postitust saab lugeda siit.

 

Siinkohal tahaks ka ära märkida, et tõeliselt hea disaineri tunnus on, et ta loob ise trende, mitte ainult ei kopeeri neid. See tähendab, et tal on loodud oma süsteem ja põhimõtted, mida ta disainides järgib.  

 

Ei mõju ju professionaalselt nt torumees, kes tuleb kraani remontima ja kellel ei ole kaasas mitte ühtegi tööriista ning soovib neid aina tellijalt laenata. Heal disaineril on olemas piisav hulk teadmisi, tööriistu ja oskusi enda „tööriistakohvris“. Lisaks vajalikele programmidele ka enda loodud värvipaletid, üldised põhimõtted, ikooni komplektid, kasutajaliidese mustrid jms. 

 

1. Hulktahulised vormid 

See trend on ilmselt pärit mängude ja animatsioonide maailmast, kus kolmnurki kasutatakse objektide loomiseks ja liitmiseks. Hulktahukad on objektid, kus tasapinnalised kujutised on ühendatud sirgete suletud joontega. Objektidel võib olla lõputu hulk külgi niikaua, kui kujund on sirgete joontega suletav. Disainitrendi raames kasutatakse neid fotodel, videotel, kujundites, ikoonidel, logodel ja üldiselt kasutajaliideses, et tõmmata kasutaja tähelepanu.  

 

Kuvatõmmis 1: lahendus, kus laadimiskujund on täidetud hulktahukatega – nii on tulemus põnevam ja ka ruumilisem. (allikas: https://designbypelling.co.uk)

 

 

 

Kuvatõmmis 2: kolmnurgad, mida on kasutatud maitsekalt terve avalehe ulatuses, muudavad lehekülje huvitavamaks ja töötavad suurepäraselt kujunduselementidena. (allikas: http://www.twigglegraphics.com)

 

 

Kuvatõmmis 3: kasutatud on erinevaid hulktahukaid eri elementides, tulemus on värske ja põnev! (allikas: http://www.akaru.fr)

 

2. Taktiilne disain 

Taktiilse disaini trendi juures asetsevad Google Material Design’i juhistes, kus nad enda kasutajaliidese põhimõtteid kirjeldavad. Idee on selles, kuidas kujutada suhteliselt „flat-disainis“ elemente nii, et nad ei mõju tasapinnaliselt, kitsendatult ja igavalt.  

 

Tihti kasutatakse selleks objektile lisatud varju, mis loob 3D illusiooni digitaalses ruumis – disainer rakendab kujutletavaid valgusallikaid ja määrab nende objektidele langemise suuna. Lisaks iseloomustab seda trendi teatav „ruumitus“, kus objektid ei ole kasti kinni disainitud, vaid asetsevad osaliselt ka kujutletavas ruumis kasutajaliidese ümber ning ei oma tegelikke kabariite. Tulemuseks on teatud „kombitav“ reaalsus, mis jätab kasutajale ruumi ka kujutlusvõimeks.  

 

Kuvatõmmis 4: hea näide, kus mitte-elusuuruses objektid asetsevad nii digitaalses, kui ka kujutletavas ruumis kasutajaliidese ümber. (allikas: https://www.beoplay.com)

 

Kuvatõmmis 5: kujundus ise on tasapinnaline, aga objektide välja toomiseks on kasutatud varje. (allikas: www.android.com)

 

3. Hääljuhtmisega kasutajaliidesed

"Parim kasutajaliides on puuduv kasutajaliides“ – Google'i disainer, Golden Krishna. Kui tavapäraselt kasutab kasutaja erinevate liideste juhtimiseks klaviatuuri, hiirt või oma näppe, siis lähiaastatel ennustatakse plahvatuslikku kasvu liidestele, millel puudub kasutajaliides või/ja mis on täielikult juhitavad häälkäskluste abil (nn „VUI“ – voice user interface). „OK Google“ otsingukäivitus on ilmselt tuttav paljudele aga näiteks nn „Zero UI“ seadmed nagu Amazon Echo ja Google Home on juba kiiret võidukäiku teinud üle Atlandi.  

 

Arvatakse, et 75% protsendil USA kodupidamistel on aastaks 2020 üks nendest seadmetest kodus olemas. Lisaks ennustatakse, et samaks aastaks tehakse 30% veebitoimingutest ilma graafilise kasutajaliideseta.  

 

Hea uudis on hääljuhtimistega seadmete võidukäik kindlasti ka erinevatele puuetega inimestele, kellele tavapärane kasutajaliidese kasutamine on keeruline või suisa võimatu. Tõenäoliselt ei ole kaugel ka aeg, kus näiteks Haigekassa lehel saab kõik toimingud teha mugavalt häälkäskluste abil. 

Kuvatõmmis 6: Google Home - täielikult hääljuhtimisega seade, mis oskab lugeda ette audioraamatuid, liiklusinfot, kalendrimärkmeid, näidata televiisorist Netflixi seriaale, mängida muusikat, avada reisigalerii jne. 

 

Kuvatõmmis 7: Amazon Echo, mis reageerib nimele „Alexa“ ja teeb põhimõtteliselt samu asju, mis Google Home.

 

4.Biomeetriline autentimine – igal pool! 

Tegemist ei ole küll väga uue tehnoloogiaga aga see levib järjest rohkem. Tuntumad autentimisviisid on häältuvastus, silmaiirise skaneerimine, näo ID ja sõrmejälje tuvastamine. Kuna kõigil arvutitel ja nutitelefonidel on olemas integreeritud kaamerad siis silmaiirise skaneerimisega sisselogimised ID-kaardi asemel võib olla vägagi tõenäoline.  

 

Lisaks mugavusele tõstab biomeetriline autentimine ka turvalisust, kuigi juba on ka kurikaelad välja mõelnud, kuidas nn universaalsete sõrmejälgede abil seadmeid avada või kuidas väljaprinditud silmaiirisega kaameraid petta. Lisaks eelnimetatud autentimisviisidele on olemas veel näo, käe- ja veenide geomeetria tuvastusviisid. 

 

Kuvatõmmis 8: Ennustatakse, et varsti tuvastatakse (nt lennujaamades) kõik isikud sarnase aparaadi abil, mis skaneerib silmaiirist. (allikas: http://www.aoptix.com)

 

5. Täisekraani lahendused mobiilis 

Nutitelefonide ekraanid muutuvad järjest suuremaks ning viimasel ajal on lisandunud mudelid, millel ei ole enam külgedel raami ehk kujutis on kuvatud äärest ääreni nn infinity display (Samsung Galaxy S8/S9 ja iPhone X). Ka kasutajaliidesed peavad kohanduma ja pakkuma täisekraanile sobivat disaini ning sellest tulenevat kasutajakogemust.

Kuvatõmmis 9: ilmaennustuse äpp, kus on juba arvestatud iPhone X ekraani spetsifikatsioonidega.

 

6. Liiteraalsus 

Nimetatud trend sai eelkõige tuntuks Pokeman Go mängu kaudu ja kujutab endast tehnoloogiat, kus interaktiivsed pildid/kujundid on kuvatud ja „töötavad“ reaalse maailma piltidega koos – nt mobiilikaamera vaateväljas asuvad objektid.  Nn liiteraalsete („augmented reality“) projektidega on kuuldu pärast Apple’s hõivatud juba suur hulk meeskondi ja vastavaid äppe tuleb nagu UX-ettevõtteid pärast Trinidad Wisemani😊.

 

Kuvatõmmis 10: äpp, mis lubab märkida parkimisel auto täpse asukoha ja hiljem juhatab reaalajas selle juurde. (allikas: https://itunes.apple.com/us/app/find-your-car-with-ar/id370836023?mt=8) 

 

Kuvatõmmis 11: Amikasa äpi abil saab enda toad virtuaalselt ära sisustada, et tekiks parem ettekujutus, kuidas miski oma vahel paigutub ja kokku sobib. (allikas: https://itunes.apple.com/nz/app/amikasa-3d-floor-planner-with-augmented-reality/id918067772?mt=8)

 

7. Pilkupüüdev tüpograafia 

Hiigelsuured ja julged tekstid asendavad järjest rohkem pilte ning tänu värvikirevale iseloomule ja originaalsele fondivalikule tekitavad nad lisaks sõnumi edastamisele ka kasutajates (positiivseid) emotsioone. Trendi levik on seotud arusaamaga, et pilkupüüdvalt esitatud sõnumid julgustavad kasutajaid neid rohkem lugema. 

 

Graafiline pilt 1: näide e-poes domineerivast tüpograafiast. (https://seasoncreates.com)

 

8. Negatiivne ruum 

 

Negatiivne ruum on ala, mis ei ole täidetud mitte ühegi kujunduselemendiga (tihti tuntud kui „whitespace“, kuigi negatiivne ruum ei pea olema ilmtingimata valge). Kuigi teadmine selle olulisusest on nn disainerite baasteadmiste hulgas, siis 2018 trend muudab selle proportsioone veelgi suuremaks.  

 

Tulemuseks on kasutajasõbralikum kasutajaliides, mis sobib hästi nii mobiili -kui veebidisaini. Õigesti kasutatuna (st tegemist ei ole „lihtsalt valge alaga kuskil“) juhib see kasutaja tähelepanu vajalikule sisule nagu tekstid ja nupud ning muudab sisu paremini tarbitavaks.

 

Kuvatõmmis 12: negatiivse ruumi kasutamise näide. (allikas: https://dribbble.com/shots/2320348-Reuters-TV-Ads)

 

 

Kuvatõmmis 13: erinevaid hästi tasakaalus olevaid näiteid negatiivse ruumi kasutamisest veebidisainis. (allikas: https://dribbble.com/shots/2314336-Learn-my-process)