29.12.2020

Veebidisaini trendid 2021. aastal: kõik püüavad sõbralikud välja näha

Lisaks loomulikele arengutele trendides pani dramaatiline aasta 2020 mõtlema asjadele, mis muidu on kapitalistlikus edurallis tahaplaanile jäänud. Tuleva aasta veebitrendide prognoosi koostas Redwall Digitali disainer Silver Sikk.

Neomorfism
Neomorfism – näeb välja nagu 3D või plastik või kumm

Digivaldkonna ökoloogiline mõju

Kliimameeleavaldused ja ökoteemad on jõudnud ka veebidisaini. On tõsiasi, et digitaalne infrastruktuur on tohutu energiatarbija ja selle isu aina kasvab. Info hoidmine ja edastamine nõuab energiat. Globaalsed miljardite kasutajatega süsteemid emiteerivad minutis tonnide kaupa CO2 ja kui internet oleks riik, oleks see maailma suuruselt seitsmes reostaja.

Kui suur on ühe veebilehe mõju? Üksik külastus on täiesti tühine. Aga kui külastusi koguneb palju, on mingi mõju juba olemas. Testi oma veebi süsinikuemissioone – tuleb päris suur number, kas pole? Mida siis teha, kuidas oma veebi keskkonnamõju vähenda?

Peamine, kasuta vähe pilte ja eriti videot, sest nende hoidmine ja kasutaja seadmesse tirimine võtab energiat. Veeb olgu võimalikult lihtne ja tekstipõhine. Või kustuta veeb üldse ära, kui seda kellelegi vaja pole. Ka koodi optimeerimisega annab kokku hoida. Igasugu bännerid ja kasutajate jälitajad on juba vaikimisi kurjast. Siin veel nõuandeid.

Üks roheäärmusliku veebi näide on Organic Basics veebipood. Tootepildid näiteks laetakse, kui kasutaja seda nupule klikates eraldi küsib. Muidugi tekib alati küsimus, et kas antud juhul on piltideta roheveebi ja tavaveebi paralleelne pidamine tõesti keskkonnasäästlik ja ega see pole lihtsalt kaval brändingutrikk? Aga no kuidagi tuleb alustada.

veebidisain. öko

Õppetund kogu sest ökoteemast võiks olla, et kiire ja lihtne veeb meeldib tegelikult ka kasutajatele, seega on keskkonnasäästlik veeb hea kõigile. Ihnsat veebi me ilmselt keegi väga ei ihalda, aga on hea, kui teadlikkus probleemist on olemas ja keegi jätab mõnes kohas kahjuliku liialduse tegemata.

Kaasamine

Eriti seoses USA rassimeeleavaldustega said eetika ja kaasamise teemad veebidisaini valdkonnas hoogu juurde. Tehnoloogia on võimas ja ideaalis hea, aga see võib kaasa tuua ka kiusamise, diskrimineerimise ja on hea abiline ka diktaatoritele jm kurjamitele.

Oleme aru saanud, et õelate postituste levitamise eest vastutab ka Facebook, mitte ainult õel digitigedik. Aga ega sinu veebileht või bränding kedagi ei solva, diskrimineeri või privaatsust riku? Kui kaugele poliitkorrektsusega minna, on omaette teema, aga probleem on olemas. Selle teadvustamisest on sündinud näiteks abiline digitoote omanikule, mis näitab võimalikke ohte ja kuidas asja parandada:

kaasamine, veebitrendid

Ligipääsetavus

Ligipääsetavus on üha olulisem teema ja oleme sellest ka oma blogis kirjutanud. Kõik väärivad digiteenustele ja sisule liigipääsu. Nii pimedad, kellele ei piisa ekraanist; vanurid, kel probleeme hiirega pihtasaamise ja nägemisega; lapsed, kelle tähelepanu on piiratum. Aga ka keskealine musterkodanik, kel võibolla käsi kipsis või toatäis lapsi keskendumist segamas või netiühendus katkendlik:

inclusive design persona spectrum

Jällegi, ka ligipääsetav veeb on kõigile osapooltele ainult kasulik.

Disainerite ja arendajate maailmas on asjast aru saadud ja teema on oluline. Euroopa Liidus on ligipääsetavus juba ka seadusesse kirjutatud. Aga nagu statistikast selgub, siis maailma mastaabis veel arengut näha pole. Näiteks üks peamisi ja lihtsamaid kriteeriume, piisav teksti kontrastsus, on tagatud vaid 21% maailma veebidel ja trend on langev.

Kuidas alustada? Tekstide värv peaks olema tausta suhtes piisavalt kontrastne. Lisa ekraanilugeriga vaegnägijate jaoks piltidele alt-kirjeldused. Veebi tekstid peaks olema võimalikult selged ja lühikesed – vt juhised meie blogis. Paar tööriista kiireks alustamiseks, paranda kasvõi üks viga ja juba on mõne kasutaja elu lihtsam:

Visuaalsed veebidisaini trendid

Kasutajaid huvitav sisu, hea kasutatavus ja eesmärgipärasus teevad ühest veebist asjaliku ja hea. Aga mis teeb selle ägedaks? Siin mõned märksõnad.

Realistlikkus

Kasutajaliidesed muutuvad taaskord ruumilisemaks ja realistlikumaks. Kasutatakse kihte, segatakse fotot, teksti, illustratsiooni, graafilisi elemente. Objektid heidavad realistlikke varje ja värvipinnad on sageli loomulikud, kerge ülemineku või tekstuuriga. Tihti on elemendid rangest layoudist välja murdnud, et kompositsiooni elavamaks või loomulikumaks muuta.

Realistlikkus ei tähenda siiski täielikku realismi – lihtsalt erinevad elemendid, mis ise ei pruugi üldse realistlikud olla, on justkui füüsilisse maailma toodud. Siin näiteks on 3D-d ja nö tavaillustratsiooni miksitud, asjadel on varjud ja sisuplokk asuks justkui illustratsiooniga samas ruumis:

veebidisain

3D

Realismiga seostub 3D, mis on juba viimase paari-kolme aasta trend. Kuna seda on suhteliselt keeruline toota, siis see kõike veel vallutanud pole ja mõjub suhteliselt värske ja originaalsena. Populaarsust võib mõjutada see, et uusi lihtsaid UI-disainiks mõeldud 3D-programme tuleb juurde, vt nt Spline.

Neomorfism ja külmunud klaas

Disainerite ringkonnas mängiti isekeskis juba 2019. aastal neomorfismi mõttega. Näeb välja nagu 3D või plastik või kumm ja on ligipääsetavuse mõttes tegelikult halb ja segane.

neumorphism 1

Selle reaalselt kasutatav alatrend on udutatud ja poolläbipaistva, justkui külmunud klaasi efekt, iPhone’i kasutajatele ilmselt juba tuttav:

glassmorphism

Illustratsioonid

Jätkuvalt populaarne, pilt on mitmekesistunud. Võrreldes fotoga lisavad illustratsioonid rohkem omapära. Retromaigulise graafilise illustratsiooni kõrval näeb ka palju 3D-põhist.

Ümarad nurgad

On pea kõikjal, nüüd siis juba ka Facebookis, kes muutis oma välimust põhjalikult. Kõik püüavad sõbralikud välja näha.

Retro

Retro mõjub alati, sest inimesed on nostalgilised. Tänasesse kohati üheülbalisse veebi toovad funkid 60-70ndate retrofondid ja mahedad värvid sõbralikkust ja pehmust.

90ndate animeeritud gif

90ndad on viimaste aastate hype. Ühelt poolt nohikuhuumor (Win95,  gif-animatsioonid, Comic Sans font jms), teiselt poolt reivilik näkkuhüppav energia oma suurte kirjade, toorete värvide jms-ga.

retro, veebidisaini trendid

Värvid

Pantone aasta värve on seekord kaks: särtsakas sidrunikollane ja taustale hoiduv tsementhallPõhjalikumates hooajatrendides pakub Pantone värskeid värve, kõrvale murtud ja pastelseid toone.

pantone 1

Reaalselt näeb põhimõtteliselt paari-kolme suunda:

  • Kirkad värviüleminekud, enamasti sinised-punased valgel taustal – tehnoloogia teemad, vt pilti külmunud klaasi efekti kohta ülevalpool.
  • Retrotrendil purjetavad murtud toonides või pastelsed veebid – pehmemad teemad kommertsveebides, kultuur, sotsiaalia, õigus.
  • Toored primaarvärvid, veidrad murtud toonid ja värvipaletid, monokroom ja must-valge – kunst ja disain.

Dark mode

Võimalus valida rakendustes ja op-süsteemis tume kasutajaliides on juba uus normaalsus, mitte trend. Pimedas ruumis kasutades mõnus ja säästab OLED-ekraaniga seadmel ka akut. MacOS Big Sur’iga tulnud lahendus toimib hästi, Windows on endiselt üsna õudne. Üsna sageli on nimelt tumedaks keeramisega toode kohati raskesti kasutatavaks muudetud.

Tüpograafia

Valdkond on elav ja rikkalik, tegijaid on palju ja eriilmelisi.

Koos geomeetrilise plokk-kirjaga eksisteerivad kõrvuti mahe 70ndate retro, uhked seriifkirjad, liialdustesse kalduvad display-kirjad eksprimentaalsemaks kasutamiseks.

voyage font

Veebidisaini tehnilist poolt mõjutab variable-fontide lai levik – eri paksused on nüüd ühes väikses failis koos, st leht laadib oluliselt kiiremini. Ökoloogiline jalajälg ka väiksem, eksole.

Loojutustamine

Interaktiivne infograafika ja loojutustamine on kaasahaarav. Saab kasutada mängulisi elemente, liitreaalsust jms, et anda mingist teemast või kohast ülevaade. Liigagi tihti paraku ka tõmbab arvuti kooma, kui on kasutatud tehniliselt liiga nõudlikku lahendust – seega ettevaatust, et üle ei pinguta efektidega.

veebidisaini trendid

Brutalism

Julgemad, enamasti kultuurivaldkonnaga seotud veebid kasutavad sileda ja nunnu kommertsliku stiili asemel eksperimentaalsemat stiili, kus peavoolust tuttav silmailu pole esmane. Siin näeb ootamatuid, veidraid ja mängulisi värvikombinatsioone, efekte, fonte, layouti ja navigatsiooni. Kui otsid eksperimentaalsemaid veebidisaini näiteid, kiika www.hoverstat.es.

Liikumine, efektid, üleminekud

Brauserid on üha võimekamad, kood üha kompaktsem ja sujuvam. See julgustab kasutama huvitavaid ja kaasahaaravaid animatsioone ja efekte. Liikumine on reaalse maailma oluline omadus ja seda näeb ka veebis üha rohkem.

Sisu

Põhimõtteliselt ja lõpetuseks peab ära mainima, et visuaalsed trendid on küll lahedad, aga kõige olulisem on ikkagi veebilehe või rakenduse sisu ja eesmärk. Kui on trendikas, aga kasutu asi, siis võtab see lihtsalt serveriruumi ja energiat ja ongi kõik. Et nii ei juhtuks, siis esmalt mõtleme ja siis teeme!


Autor: Silver Sikk, Redwall Digital

Allikas: Veebitrendid 2021. aastal

Kõik uudised

TULIs on üle saja liikme. Liitu sinagi Eesti suurima turunduskogukonnaga!

Loe siit, mis hüvesid TULI liikmed naudivad.

TULIst lähemalt