Olen veetnud üle kahe aastakümne kasutajakogemuse kujundamise kaevikus. Mäletan üleminekut tabelipõhistelt paigutustelt CSS-ile, iPhone'i turuletulekul pööret tundlikule disainile ja "tähelepanumajanduse" tõusu. Kuid 2026. aastal liikudes seisab tööstus silmitsi oma seni kõige olulisema nihkega. Me liigume mööda „disaini iga hinna eest” ajastust säästva kasutuskogemuse ajastusse. Enamik disainereid, kaasa arvatud mina, ei mõtle sellele, kuni sellest kui kontseptsioonist kuuldes ajendas mind. Oleme aastaid käsitlenud Internetti kui eeterlikku kaalutut pilve. Oleme eeldanud, et digitaalsed tooted olid "rohelised" lihtsalt seetõttu, et neid ei trükitud paberile. Ka mina arvasin seda varem ja enne kliimamuutuse kontseptsiooni esilekerkimist oli see pigem puude säästmine. Me eksisime. Pilv on füüsiline infrastruktuur, laialivalguv andmekeskuste, veealuste kaablite ja jahutussüsteemide võrk, mis sumiseb ööpäevaringselt. Kuigi tehisintellektile keskendunud andmekeskused vastavad massiivsete alumiiniumsulatusseadmete energiatarbimisele, tekitab nende suur geograafiline tihedus veelgi intensiivsema ja lokaalsema keskkonnakoormuse. UX-i disaineritena oleme selle energiatarbimise kujundajad. Iga kõrge eraldusvõimega kangelasepilt, iga automaatselt esitatav taustavideo ja iga keeruline JavaScripti animatsioon, mille me heaks kiidame, on protsessorile otsene juhis energia tarbimiseks. Kui tahame ehitada kestvat tulevikku, peame lõpetama "vau" kujundamise ja hakkama kujundama tõhususe nimel. Tume režiim 2000. aastate alguses olid valged taustad standardsed, kuna need jäljendasid paberi tuttavlikkust. Riistvara on aga arenenud ja meie disainifilosoofia peab järgima. Üleminek LCD-lt OLED-tehnoloogiale (orgaaniline valgusdiood) on põhjalikult muutnud seda, kuidas värvid mõjutavad energiat.

Loogika Erinevalt traditsioonilistest LCD-ekraanidest, mis nõuavad alati sisse lülitatavat taustvalgustust (isegi musta värvi kuvamisel), valgustavad OLED-ekraanid iga pikslit eraldi. Kui piksel on seatud tõeliseks mustaks (#000000), lülitatakse see konkreetne diood täielikult välja. See võtab nullvõimsust. Tumedamaid palette eelistavaid liideseid kujundades ei järgi me mitte ainult trendi; vähendame füüsiliselt kasutaja seadme energiavajadust. Andmed Energiasääst pole kaugeltki tühine. Purdue ülikooli 2021. aastal läbi viidud uurimus, millest on saanud selle arutelu kuldstandard, näitas, et 100% heleduse korral võib heledalt režiimilt tumedale režiimile lülitumine säästa akut keskmiselt 39–47%. Globaalses mastaabis oleks võrgunõudluse vähenemine astronoomiline, kui kõik suuremad rakendused kasutaksid vaikimisi tumedat režiimi. Disaini eesmärk Aastal 2026 ei tohiks tume režiim enam olla seadete menüüsse peidetud teisene „teema”. Peaksime kujundama "Dark-First" mentaliteediga. See ei tähenda, et iga sait peab välja nägema nagu The Matrix, kuid see tähendab suure kontrastsusega tumedate teemade eelistamist süsteemi eelistatud vaikeolekuna. See pikendab seadme riistvara kasutusiga ja vähendab iga interaktsiooni süsiniku jalajälge. Mina isiklikult eelistan lugemiseks valgusrežiimi, seega on mõistlik kasutada nii heleda kui ka tumeda režiimi valikuid. Mõlema valiku pakkumisel tuleb arvesse võtta ka juurdepääsetavust. Piltide ja videote optimeerimine Meist on saanud laisad disainerid. Kiire 5G ja fiiberoptikaga oleme lõpetanud muretsemise failisuuruste pärast. Mobiililehe keskmine kaal on viimasel kümnendil kasvanud üle 500%, peamiselt optimeerimata visuaalsete varade tõttu. Loogika Veebisaidi „digitaalne rasv” (need 4 MB Unsplashi fotod ja 15 MB taustavideod) on suurim lehe laadimise energia panustaja. Iga serverist kliendile üle kantud megabait vajab edastamiseks, serveri töötlemiseks ja kasutaja renderdusmootoriks elektrit. Kui kasutame suuri faile, siis sisuliselt "põletame" energiat, et näidata pilti, mis oleks võinud olla sama tõhus ka murdosa suurusest. Rääkimata sellest, et pakute ka paremat kasutuskogemust lehel, mis laaditakse palju kiiremini.

Andmed HTTP-arhiivi andmetel moodustavad pildid ja video järjekindlalt lõviosa lehe kogukaalust. Kuid üleminek kaasaegsetele vormingutele, nagu AVIF ja WebP, võib vähendada pildi kaalu kuni 50% võrreldes JPEG-ga, ilma et kvaliteet väheneks märgatavalt. Kuigi need vormingud pole mulle nii tuttavad kui JPG ja PNG, ootan kindlasti nende kasutamist lehe suuruse vähendamiseks. TheDisaini eesmärk Juhtisin hiljuti küberturbeplatvormi ümberkujundamist. Auditi „Enne ja pärast” juurutamisel avastasime, et nende koduleht laadis 5,5 MB andmeid. Asendades suure eraldusvõimega fotograafia SVG (Scalable Vector Graphics) kunstiga ja kasutades pildivarade asemel nutikaid CSS-i gradiente, langetasime koormuse 1,2 MB-ni. See tähendab 78% energiakoormuse vähenemist! Disainerina peaks teie esimene küsimus alati olema: "Kas ma vajan selleks fotot või saan koodiga sama emotsionaalse resonantsi saavutada?"

Tahtlik liikumine: "Valjude" animatsioonide lõikamine Me elame kerimise ja keeruliste 3D-parallaksiefektide ajastul. Kuigi need võivad saidil Awwwards.com auhindu võita, on need sageli ökoloogilised katastroofid. Loogika Animatsioon pole tasuta. Keerulise animatsiooni renderdamiseks peab seadme GPU (Graphics Processing Unit) töötama suure võimsusega. See tõstab protsessori temperatuuri, käivitab jahutusventilaatorid (sülearvutites) ja tühjendab kiiresti akut. "Valju" animatsioonid, mis jooksevad pidevalt taustal või käivitavad brauseri massilise värvimise, on sama energiaga, kui jätate auto tühikäigule sõiduteele.

Andmed Google'i materjalidisaini juhised rõhutavad "tähenduslikku liikumist". Nad väidavad, et animatsiooni tuleks kasutada ainult kasutaja orienteerumiseks või tagasiside andmiseks. Ja WebP kasutamine JPEG-i asemel võib salvestada 25–50% lehe andmetest. Disaini eesmärk Peame vastu võtma tähendusliku liikumise. Kui animatsioon ei aita kasutajal ülesannet täita ega hierarhiat mõista, on see raiskamine. Võimaluse korral peaksime eelistama CSS-i üleminekuid raskete JavaScripti teekide (nt GSAP või Lottie) asemel, kuna CSS on riistvaraliselt kiirendatud ja brauseri jaoks palju tõhusam. UX-i disainerina ei saa ma sellele lähenemisele vastu vaielda. See mitte ainult ei aita vähendada andmeraiskamist, vaid parandab ka meie kasutajate kasutuskogemust. Andmeeelarve määramine iga projekti jaoks Minu 20+ UX-i aasta jooksul on kõige edukamad projektid olnud üldiselt kõige rangemate piirangutega projektid. Nii nagu projektil on rahaline eelarve, peaks sellel olema ka süsiniku- ja andmete eelarve. Loogika Andmeeelarve on lehe kogumahu piirang (nt „See sihtleht ei tohi ületada 1 MB”). See sunnib disainimeeskonda tegema raskeid, tahtlikke valikuid. Kui soovite lisada uut jälgimisskripti või väljamõeldud fondi kaalu, peate selle eest "tasuma", optimeerides või eemaldades midagi muud. See takistab funktsioonide hiilimise muutumist süsiniku roomemiseks. Andmed Säästva veebidisaini mudel, mille on välja töötanud sellised pioneerid nagu Wholegrain Digital, pakub valemit CO2 arvutamiseks lehevaatamise kohta. Keskmine veebisait toodab umbes 0,5 grammi CO2 ühe vaatamise kohta. Miljoni igakuise vaatamisega saidi puhul on see 6 tonni CO2 aastas, mis võrdub 15 000 miili autosõiduga. Disaini eesmärk Säästva kasutajakogemuse kontrollnimekiri

Vähendage ImagesQuestioni vajadust iga visuaali järele ning kasutage andmeedastuse minimeerimiseks väikseimat eraldusvõimet ja tõhusaimaid failivorminguid (nt AVIF). Video optimeerimine Kõrvaldage automaatselt esitatav meedia ja seadke prioriteediks tugevalt tihendatud lühikesed tsüklid, et tagada energia kulutamine ainult sisule, mida kasutaja kavatseb vaadata. Piirake fonteKasutage maksimaalselt kahte veebifondide kaalu või pidage kinni klassikalistest süsteemifondidest, et eemaldada mittevajalikud serveripäringud ja renderdamine. Recycle Assets (Recycle Assets) Kasutage ühte pilti või videot CSS-filtrite ja ülekatete abil mitu korda, et luua visuaalne mitmekesisus ilma lehe kogukaalu suurendamata. Valige Green Hosting Hoiustage oma digitaalseid tooteid serverites, mille on kontrollinud The Green Web Foundation, et tagada nende toide taastuvatest energiaallikatest. Andmete kauguse minimeerimine Valige serveri asukohad geograafiliselt oma peamise vaatajaskonna lähedal, et vähendada energiakulu, mis on vajalik andmete liikumiseks läbi füüsilise infrastruktuuri.

Keskkonnasõbraliku disaini ärijuht Mõned võivad väita, et "roheline UX" kõlab kvaliteedi osas kompromissina. Vastupidi, see on konkurentsieelis. Jätkusuutlik disain on jõudlusdisain. Kui vähendate lehe kaalu, laaditakse teie sait kiiremini. Kui teie sait laaditakse kiiremini, paranevad teie põhiveebi elutähtsad näitajad. Kui teie põhiveebi elutähtsad näitajad paranevad, tõuseb teie SEO asetus. Lisaks saavad teie tootele juurde pääseda vanemate seadmete või aeglasema andmesideplaaniga kasutajad (eriti arenevatel turgudel). See on "kaasava disaini" määratlus. Lõikades "digitaalse rasva", loome lahjema, kiirema ja juurdepääsetavama veebi. Me liigume eemale 2010. aastate „ühekordselt kasutatavast disainist” apüsivam, lugupidavam digitaalarhitektuur. Järeldus: "Puhta" disaini tulevik Oma kahe aastakümne disaini jooksul olen näinud palju suundumusi, mis tulevad ja lähevad. Skeuomorfism, lame disain, neumorfism – need kõik olid esteetilised valikud. Kuid jätkusuutlik kasutuskogemus ei ole trend; see on nüüd hädavajalik. Oleme esimene disainerite põlvkond, kes peab arvestama meie digitöö füüsiliste tagajärgedega. Jätkusuutlik kasutuskogemus on "win-win-win". See on planeedile parem, kuna vähendab energiatarbimist. See on kasutajale parem, kuna selle tulemuseks on kiiremad ja tundlikumad liidesed. Ja see on ettevõtte jaoks parem, kuna see vähendab hostimiskulusid JA parandab konversioonimäärasid. "Piiramatute pikslite" ajastu on möödas. 2026. aastal on kõige keerukam disain, mis jätab kõige väiksema jalajälje. Me ei ole enam ainult disainerid; oleme kasutaja aku, andmeplaani ja lõpuks ka keskkonna valvurid. Üleskutse tegevusele Kutsun teid täna auditeerima vaid ühte oma praeguse projekti lehekülge. Kasutage selle mõju nägemiseks sellist tööriista nagu veebisaidi süsinikukalkulaator. Seejärel otsige "nähtamatut jäätmed". Kas see pilt võib olla SVG? Kas see video võib olla staatiline kangelane? Kas seda "valjuhäälset" animatsiooni saab vaigistada? Alusta väikselt. Kõige elegantsem lahendus on sageli see, millel on kõige vähem baite.

You May Also Like

Enjoyed This Article?

Get weekly tips on growing your audience and monetizing your content — straight to your inbox.

No spam. Join 138,000+ creators. Unsubscribe anytime.

Create Your Free Bio Page

Join 138,000+ creators on Seemless.

Get Started Free