Ég hef eytt yfir tvo áratugi í skotgröfum hönnunar notendaupplifunar. Ég man eftir breytingunni frá töflubundnu skipulagi yfir í CSS, snúninginn yfir í móttækilega hönnun þegar iPhone kom á markað og hækkun „athyglishagkerfisins“. En þegar við förum yfir árið 2026 stendur iðnaðurinn frammi fyrir mikilvægustu breytingunni hingað til. Við erum að færast framhjá tímum „hönnunar hvað sem það kostar“ yfir í tímum sjálfbærrar notendanotkunar. Það er ekki eitthvað sem flestir hönnuðir hugsa um, þar á meðal ég sjálfur, fyrr en ég var beðinn um að heyra um þetta sem hugtak. Í mörg ár höfum við litið á internetið sem náttúrulegt, þyngdarlaust ský. Við höfum gert ráð fyrir að stafrænar vörur hafi verið „grænar“ einfaldlega vegna þess að þær voru ekki prentaðar á pappír. Ég hélt það líka og áður en hugmyndin um loftslagsbreytingar kom fram snerist þetta meira um að bjarga trjám. Við höfðum rangt fyrir okkur. Skýið er líkamlegur innviði, víðfeðmt net gagnavera, neðansjávarkapla og kælikerfi sem raula allan sólarhringinn. Þó að gagnaver sem miða að gervigreindum passa við orkunotkun gríðarlegra álvera, skapar mikill landfræðilegur þéttleiki þeirra enn ákafara og staðbundnara umhverfisálag. Sem UX hönnuðir erum við arkitektar þessarar orkunotkunar. Sérhver hetjumynd í hárri upplausn, hvert sjálfvirkt spilandi bakgrunnsmyndband og hvert flókið JavaScript hreyfimynd sem við samþykkjum eru bein fyrirmæli til örgjörva um að eyða orku. Ef við viljum byggja framtíð sem endist verðum við að hætta að hanna fyrir „vá“ og byrja að hanna til hagkvæmni. Dark Mode Snemma á 20. áratugnum var hvítur bakgrunnur venjulegur vegna þess að hann líkti eftir kunnugleika pappírs. Hins vegar hefur vélbúnaðurinn þróast og hönnunarheimspeki okkar verður að fylgja. Breytingin frá LCD yfir í OLED (Organic Light Emitting Diode) tækni hefur í grundvallaratriðum breytt því hvernig litur hefur áhrif á orku.
Rökfræðin Ólíkt hefðbundnum LCD skjáum, sem krefjast baklýsingu sem er alltaf kveikt (jafnvel þegar þeir sýna svarta), lýsa OLED skjáir upp hvern pixla fyrir sig. Þegar pixla er stilltur á satt svartan (#000000) er alveg slökkt á þeirri díóðu. Það dregur núll afl. Með því að hanna viðmót sem styðja dekkri litatöflur, erum við ekki bara að fylgja þróun; við erum líkamlega að draga úr orkuþörf tækis notandans. Gögnin Orkusparnaðurinn er langt frá því að vera lítill. Tímamótarannsókn Purdue háskólans árið 2021, sem hefur orðið gulls ígildi fyrir þessa umræðu, leiddi í ljós að við 100% birtustig getur skipt úr ljósstillingu yfir í dökka stillingu sparað að meðaltali 39% til 47% af rafhlöðunni. Á heimsvísu, ef hvert stórt forrit væri sjálfgefið í myrkri stillingu, væri minnkun á eftirspurn eftir neti stjarnfræðileg. Hönnunarmarkmiðið Árið 2026 ætti Dark Mode ekki lengur að vera auka „þema“ sem er falið í stillingavalmynd. Við ættum að vera að hanna með „Dark-First“ hugarfari. Þetta þýðir ekki að sérhver síða verði að líta út eins og The Matrix, en það þýðir að forgangsraða dökkum þemum með mikilli birtuskilum sem sjálfgefið kerfisvalið ástand. Þetta lengir endingartíma vélbúnaðar tækisins og lækkar kolefnisfótspor hvers kyns samskipta. Ég persónulega kýs Light-Mode fyrir lestur, svo það er skynsamlegt að hafa bæði ljósa og dökka stillingu tiltæka. Það eru líka aðgengissjónarmið við að bjóða upp á báða valkostina. Mynd- og myndbandsfínstilling Við erum orðnir latir hönnuðir. Með háhraða 5G og ljósleiðara erum við hætt að hafa áhyggjur af skráarstærðum. Meðalþyngd farsímasíðunnar hefur aukist um meira en 500% á síðasta áratug, aðallega vegna óhagkvæmra sjónrænna eigna. Rökfræðin „Stafræn fita“ vefsíðunnar (þessar 4MB Unsplash myndir og 15MB bakgrunnsmyndbönd) er stærsti einstaki þátturinn í síðuhleðsluorku. Hvert megabæt sem flutt er frá netþjóni til viðskiptavinar þarf rafmagn fyrir flutninginn, vinnslu miðlarans og flutningsvél notandans. Þegar við notum gríðarlegar skrár erum við í rauninni að „brenna“ orku til að sýna mynd sem hefði getað verið jafn áhrifarík við brot af stærðinni. Svo ekki sé minnst á, þú ert líka að veita betri notendaupplifun með síðu sem hleðst mun hraðar.
Gögnin Samkvæmt HTTP skjalasafninu eru myndir og myndbönd stöðugt fyrir ljónshlutinn af heildarþyngd síðunnar. Hins vegar getur breytingin yfir í nútíma snið eins og AVIF og WebP dregið úr myndþyngd um allt að 50% miðað við JPEG, án þess að sjáanlegt tap sé á gæðum. Þó þessi snið séu mér ekki eins kunnugleg og JPG og PNG, þá hlakka ég örugglega til að nota þau til að minnka síðustærð. TheHönnunarmarkmið Ég leiddi nýlega endurhönnun fyrir netöryggisvettvang. Með því að innleiða „Fyrir og eftir“ úttekt komumst við að því að heimasíðan þeirra var að hlaða 5,5MB af gögnum. Með því að skipta út háupplausnarljósmyndun fyrir SVG (Scalable Vector Graphics) myndlist og nota snjalla CSS halla í stað myndeigna, lækkuðum við álagið niður í 1,2MB. Það er 78% minnkun á orkuálagi! Sem hönnuður ætti fyrsta spurningin þín alltaf að vera: "Þarf ég mynd fyrir þetta, eða get ég náð sama tilfinningalega ómun með kóða?"
Viljandi hreyfing: Skera „hávær“ hreyfimyndir Við lifum á tímum „scroll-jacking“ og flókinna 3D Parallax áhrifa. Þó að þetta gæti unnið til verðlauna á Awwwards.com, þá eru þetta oft vistfræðilegar hamfarir. Rökfræðin Hreyfimyndir eru ekki ókeypis. Til að gera flókna hreyfimynd verður GPU (Graphics Processing Unit) tækisins að vinna með mikilli afkastagetu. Þetta eykur hitastig CPU, kveikir á kæliviftum (í fartölvum) og tæmir rafhlöðuna hratt. „Hávær“ hreyfimyndir sem keyra stöðugt í bakgrunni eða kalla fram stórfellda endurmálningu á vafranum jafngilda orkunni við að skilja bílinn eftir í lausagangi í innkeyrslunni.
Gögnin Í efnishönnunarleiðbeiningum Google er lögð áhersla á „Meaningful Motion“. Þeir halda því fram að aðeins ætti að nota hreyfimyndir til að leiðbeina notandanum eða veita endurgjöf. Og að nota WebP í stað JPEG getur sparað 25-50% af gögnum á síðu. Hönnunarmarkmiðið Við verðum að samþykkja þýðingarmikla hreyfingu. Ef hreyfimynd hjálpar ekki notanda að klára verkefni eða skilja stigveldi er það sóun. Við ættum að styðja CSS umskipti fram yfir þung JavaScript bókasöfn eins og GSAP eða Lottie þar sem það er hægt, þar sem CSS er vélbúnaðarhraðað og mun skilvirkara fyrir vafrann að reikna út. Sem UX hönnuður get ég ekki mótmælt þessari nálgun. Þetta hjálpar ekki aðeins til við að draga úr gagnasóun heldur bætir það einnig notendur okkar. Að setja „gagnafjárhagsáætlun“ fyrir hvert verkefni Á 20+ árum mínum af UX hafa farsælustu verkefnin yfirleitt verið þau sem eru með ströngustu skorðurnar. Rétt eins og verkefni hefur fjárhagsáætlun, ætti það einnig að hafa kolefnis- og gagnaáætlun. Rökfræðin Gagnafjárhagsáætlun er harðmörk fyrir heildarstærð síðu (t.d. „Þessi áfangasíða má ekki fara yfir 1MB“). Þetta neyðir hönnunarteymið til að taka erfiðar, viljandi ákvarðanir. Ef þú vilt bæta við nýju rakningarforriti eða flottri leturþyngd þarftu að „borga“ fyrir það með því að fínstilla eða fjarlægja eitthvað annað. Þetta kemur í veg fyrir að „eiginleikaskrið“ breytist í „kolefnisskrið“. Gögnin Sjálfbær vefhönnunarlíkan, þróað af frumkvöðlum eins og Wholegrain Digital, býður upp á formúlu til að reikna út CO2 á hverja síðuskoðun. Meðal vefsíða framleiðir um 0,5 grömm af CO2 á hverja skoðun. Fyrir síðu með 1 milljón mánaðarlega áhorf eru það 6 tonn af CO2 á ári, sem jafngildir því að keyra bíl 15.000 mílur. Hönnunarmarkmiðið Sjálfbær UX gátlisti
Dragðu úr myndum Spurðu nauðsyn hvers myndefnis og notaðu minnstu upplausnina og skilvirkustu skráarsniðin (eins og AVIF) til að lágmarka gagnaflutning. Fínstilltu myndband Eyddu sjálfvirka spilun miðla og settu mjög þjappaðar, stuttar lykkjur í forgang til að tryggja að orka sé aðeins eytt í efni sem notandinn ætlar að skoða. Takmarkaðu leturgerðir Notaðu að hámarki tvær leturþyngdir á vefnum eða haltu þig við klassískt kerfisleturgerð til að fjarlægja óþarfa netþjónsbeiðnir og útblástur. Endurnýttu eignir Endurnýttu eina mynd eða myndband margfalt með því að nota CSS síur og yfirlög til að skapa sjónræna fjölbreytni án þess að auka heildarþyngd síðunnar. Veldu Green HostingHýstu stafrænu vörurnar þínar á netþjónum sem eru staðfestir af The Green Web Foundation til að tryggja að þær séu knúnar af endurnýjanlegum orkugjöfum. Lágmarkaðu gagnafjarlægð Veldu staðsetningar netþjóna sem eru landfræðilega nálægt aðaláhorfendum þínum til að draga úr orkunni sem þarf til að gögn fari í gegnum líkamlega innviði.
Viðskiptamálið fyrir vistvæna hönnun Sumir gætu haldið því fram að „Green UX“ hljómi eins og málamiðlun um gæði. Þvert á móti er það samkeppnisforskot. Sjálfbær hönnun er frammistöðuhönnun. Þegar þú minnkar síðuþyngd hleðst síðan þín hraðar. Þegar vefsíðan þín hleðst hraðar batnar Core Web Vitals þín. Þegar Core Web Vitals þín batna, hækkar SEO röðun þín. Ennfremur geta notendur á eldri tækjum eða hægari gagnaáætlunum (sérstaklega á nýmörkuðum) í raun fengið aðgang að vörunni þinni. Þetta er skilgreiningin á „hönnun án aðgreiningar“. Með því að skera niður „stafrænu fituna“ búum við til grannari, hraðari og aðgengilegri vef. Við erum að hverfa frá „einnota hönnun“ 2010 í átt að avaranlegri, virðulegri stafrænni arkitektúr. Ályktun: Framtíð „hreinnar“ hönnunar Á tveimur áratugum mínum í hönnun hef ég séð marga strauma koma og fara. Skeuomorphism, Flat Design, Neumorphism - þetta voru allt fagurfræðilegt val. En sjálfbær UX er ekki stefna; það er nú nauðsyn. Við erum fyrsta kynslóð hönnuða sem þarf að reikna með líkamlegum afleiðingum stafrænnar vinnu okkar. Sjálfbær UX er „vinna-vinna-vinna. Það er betra fyrir plánetuna vegna þess að það dregur úr orkunotkun. Það er betra fyrir notandann vegna þess að það skilar sér í hraðari og móttækilegri viðmóti. Og það er betra fyrir fyrirtækið vegna þess að það lækkar hýsingarkostnað OG bætir viðskiptahlutfall. Tímabili „ótakmarkaðra pixla“ er lokið. Árið 2026 er fágaðasta hönnunin sú sem skilur eftir sig minnstu sporin. Við erum ekki lengur bara hönnuðir; við erum verndarar rafhlöðu notandans, gagnaáætlun hans og að lokum umhverfisins. Ákall til aðgerða Ég skora á þig að endurskoða aðeins eina síðu af núverandi verkefni þínu í dag. Notaðu tól eins og vefsíðu kolefnisreiknivélina til að sjá áhrif þess. Leitaðu síðan að „ósýnilega úrganginum“. Getur þessi mynd verið SVG? Getur það myndband verið kyrrstæð hetja? Er hægt að þagga niður í þessari „háværu“ hreyfimynd? Byrjaðu smátt. Glæsilegasta lausnin er oft sú sem hefur fæst bæti.
