Daugiau nei du dešimtmečius praleidau naudotojų patirties dizaino grioviuose. Prisimenu perėjimą nuo lentelėmis pagrįstų maketų prie CSS, posūkį į jautrų dizainą, kai buvo paleistas „iPhone“, ir „dėmesio ekonomikos“ augimą. Tačiau einant 2026 m., pramonė susiduria su didžiausiu kol kas pasikeitimu. Peržengiame „dizaino bet kokia kaina“ erą į tvaraus UX erą. Daugelis dizainerių, įskaitant mane patį, apie tai negalvoja, kol nepajutau, kai išgirdau apie tai kaip koncepciją. Daugelį metų internetą traktavome kaip eterinį, nesvarų debesį. Darėme prielaidą, kad skaitmeniniai produktai buvo „žali“ vien todėl, kad nebuvo atspausdinti ant popieriaus. Anksčiau taip maniau ir aš, o prieš atsirandant klimato kaitos sampratai, tai buvo daugiau apie medžių išsaugojimą. Mes klydome. Debesis yra fizinė infrastruktūra, besiplečiantis duomenų centrų tinklas, povandeniniai kabeliai ir aušinimo sistemos, kurios dūzgia visą parą. Nors į dirbtinį intelektą orientuoti duomenų centrai atitinka masyvių aliuminio lydyklų energijos suvartojimą, didelis jų geografinis tankis sukuria dar intensyvesnę ir vietinę aplinkos įtampą. Kaip UX dizaineriai, mes esame šio energijos vartojimo architektai. Kiekvienas didelės raiškos herojaus vaizdas, kiekvienas automatiškai paleidžiamas foninis vaizdo įrašas ir kiekviena sudėtinga JavaScript animacija, kurią mes patvirtiname, yra tiesioginis nurodymas procesoriui vartoti energiją. Jei norime sukurti ilgalaikę ateitį, turime nustoti kurti „wow“ ir pradėti kurti efektyviai. Tamsusis režimas 2000-ųjų pradžioje baltas fonas buvo standartas, nes jie imitavo popieriaus įspūdį. Tačiau techninė įranga pasikeitė, todėl mūsų dizaino filosofija turi sekti. Perėjimas nuo LCD prie OLED (organinio šviesos diodo) technologijos iš esmės pakeitė spalvų poveikį energijai.
Logika Skirtingai nuo tradicinių LCD ekranų, kuriems reikalingas visada įjungtas foninis apšvietimas (net kai rodomas juodas), OLED ekranai apšviečia kiekvieną pikselį atskirai. Kai pikselis nustatytas kaip tikras juodas (#000000), tas konkretus diodas visiškai išjungiamas. Jis naudoja nulinę galią. Kurdami sąsajas, kurios teikia pirmenybę tamsesnėms paletėms, mes ne tik sekame tendencijas; fiziškai mažiname vartotojo įrenginio energijos poreikį. Duomenys Energijos taupymas toli gražu nėra nereikšmingas. 2021 m. Purdue universiteto atliktas reikšmingas tyrimas, tapęs auksiniu šios diskusijos standartu, atskleidė, kad esant 100 % šviesumui, perjungus iš šviesaus režimo į tamsųjį režimą galima sutaupyti vidutiniškai nuo 39 % iki 47 % akumuliatoriaus energijos. Pasauliniu mastu, jei kiekviena pagrindinė programa pagal nutylėjimą įjungtų tamsųjį režimą, tinklo paklausa sumažėtų astronomiškai. Dizaino tikslas 2026 m. tamsusis režimas nebeturėtų būti antrinė „tema“, paslėpta nustatymų meniu. Turėtume kurti vadovaudamiesi „Dark-First“ mentalitetu. Tai nereiškia, kad kiekviena svetainė turi atrodyti kaip Matrica, tačiau tai reiškia, kad didelio kontrasto tamsioms temoms teikiama pirmenybė kaip numatytajai sistemos pageidaujamai būsenai. Tai prailgina įrenginio techninės įrangos eksploatavimo laiką ir sumažina kiekvienos sąveikos anglies pėdsaką. Aš asmeniškai mėgstu skaityti šviesų režimą, todėl prasminga turėti tiek šviesaus, tiek tamsaus režimo parinktis. Teikiant abi parinktis taip pat reikia atsižvelgti į prieinamumą. Vaizdo ir vaizdo optimizavimas Tapome tinginiais dizaineriais. Turėdami didelės spartos 5G ryšį ir šviesolaidį, nustojome nerimauti dėl failų dydžio. Vidutinis puslapio mobiliesiems svoris per pastarąjį dešimtmetį išaugo daugiau nei 500 %, daugiausia dėl neoptimizuotų vaizdinių išteklių. Logika Svetainės „skaitmeniniai riebalai“ (tos 4 MB „Unsplash“ nuotraukos ir 15 MB fono vaizdo įrašai) yra didžiausias puslapių įkėlimo energijos šaltinis. Kiekvienam megabaitui, perkeltam iš serverio į klientą, reikia elektros energijos perdavimui, serverio apdorojimui ir vartotojo atvaizdavimo varikliui. Kai naudojame didžiulius failus, mes iš esmės „degame“ energiją, kad parodytume vaizdą, kuris galėjo būti toks pat veiksmingas, kai yra maža dalis dydžio. Maža to, jūs taip pat suteikiate geresnę vartotojo patirtį, kai puslapis įkeliamas daug greičiau.
Duomenys Remiantis HTTP archyvu, vaizdai ir vaizdo įrašai nuolat sudaro liūto dalį viso puslapio svorio. Tačiau perėjimas prie šiuolaikinių formatų, pvz., AVIF ir WebP, gali sumažinti vaizdo svorį iki 50%, palyginti su JPEG, be jokio pastebimo kokybės praradimo. Nors šie formatai man nėra tokie pažįstami kaip JPG ir PNG, tikrai nekantrauju juos panaudoti puslapio dydžiui sumažinti. TheDizaino tikslas Neseniai vadovavau kibernetinio saugumo platformos pertvarkymui. Įdiegę auditą „Prieš ir po“ nustatėme, kad į pagrindinį puslapį įkeliama 5,5 MB duomenų. Pakeitę didelės raiškos fotografiją SVG (Scalable Vector Graphics) menu ir naudodami protingus CSS gradientus vietoj vaizdo išteklių, sumažinome apkrovą iki 1,2 MB. Tai 78% sumažina energijos apkrovą! Jūsų, kaip dizainerio, pirmasis klausimas visada turėtų būti: „Ar man reikia nuotraukos, ar galiu pasiekti tą patį emocinį rezonansą su kodu?
Tyčinis judesys: „garsių“ animacijų kirpimas Mes gyvename „slinkties pakėlimo“ ir sudėtingų 3D paralakso efektų eroje. Nors jie gali laimėti apdovanojimus svetainėje Awwwards.com, tai dažnai yra ekologinės nelaimės. Logika Animacija nėra nemokama. Norint pateikti sudėtingą animaciją, įrenginio GPU (grafikos apdorojimo blokas) turi veikti dideliu pajėgumu. Tai padidina procesoriaus temperatūrą, įjungia aušinimo ventiliatorius (nešiojamuosiuose kompiuteriuose) ir greitai išsikrauna akumuliatorių. „Garsi“ animacija, kuri nuolat veikia fone arba sukelia didžiulius naršyklės keitimus, yra energijos ekvivalentas, kai automobilis paliekamas tuščiąja eiga važiuojamojoje dalyje.
Duomenys „Google“ medžiagų dizaino gairėse pabrėžiamas „prasmingas judėjimas“. Jie teigia, kad animacija turėtų būti naudojama tik siekiant orientuoti vartotoją arba pateikti grįžtamąjį ryšį. O naudojant WebP vietoj JPEG galima sutaupyti 25–50% duomenų puslapyje. Dizaino tikslas Turime priimti prasmingą judesį. Jei animacija nepadeda vartotojui atlikti užduoties ar suprasti hierarchijos, tai yra švaistymas. Jei įmanoma, turėtume teikti pirmenybę CSS perėjimui, o ne sunkioms JavaScript bibliotekoms, tokioms kaip GSAP ar Lottie, nes CSS yra aparatinės įrangos pagreitintas ir daug efektyvesnis naršyklei skaičiuoti. Kaip UX dizaineris, negaliu ginčytis dėl šio požiūrio. Tai ne tik padeda sumažinti duomenų švaistymą, bet ir pagerina naudotojų UX. „Duomenų biudžeto“ nustatymas kiekvienam projektui Per daugiau nei 20 mano UX metų sėkmingiausi projektai paprastai buvo tie, kuriems taikomi griežčiausi suvaržymai. Kaip projektas turi finansinį biudžetą, jis taip pat turėtų turėti anglies ir duomenų biudžetą. Logika Duomenų biudžetas – tai griežta viso puslapio dydžio riba (pvz., „Šis nukreipimo puslapis negali viršyti 1 MB“). Tai verčia projektavimo komandą priimti sudėtingus, apgalvotus sprendimus. Jei norite pridėti naują stebėjimo scenarijų arba įmantrią šrifto svorį, turite už tai „mokėti“ optimizuodami arba pašalindami ką nors kita. Tai neleidžia „funkcijų šliaužimui“ pavirsti „anglies šliaužimu“. Duomenys Tvaraus interneto dizaino modelis, sukurtas tokių pionierių kaip „Wholegrain Digital“, pateikia formulę, pagal kurią galima apskaičiuoti CO2 vienam puslapio peržiūrai. Vidutinė svetainė per vieną peržiūrą išskiria apie 0,5 gramo CO2. Svetainėje su 1 milijonu peržiūrų per mėnesį tai yra 6 metrinės tonos CO2 per metus, o tai prilygsta automobilio nuvažiavimui 15 000 mylių. Dizaino tikslas Tvaraus UX kontrolinis sąrašas
Sumažinkite ImagesQuestion kiekvieno vaizdo būtinybę ir naudokite mažiausią skiriamąją gebą bei efektyviausius failų formatus (pvz., AVIF), kad sumažintumėte duomenų perdavimą. Optimizuokite vaizdo įrašą Pašalinkite automatiškai atkuriamą mediją ir pirmenybę teikite labai suspaustoms, trumpoms kilpoms, kad energija būtų išleista tik turiniui, kurį vartotojas ketina peržiūrėti. Apriboti šriftusNaudokite ne daugiau kaip du žiniatinklio šriftų svorį arba laikykitės klasikinių sistemos šriftų, kad pašalintumėte nereikalingas serverio užklausas ir atvaizdavimo išsipūtimą. Recycle Assets Pakartotinai pritaikykite vieną vaizdą arba vaizdo įrašą kelis kartus naudodami CSS filtrus ir perdangas, kad sukurtumėte vaizdinę įvairovę nedidinant bendro puslapio svorio. Pasirinkite Green Hosting Priglobkite savo skaitmeninius produktus serveriuose, kuriuos patvirtino „The Green Web Foundation“, kad įsitikintumėte, jog jie maitinami iš atsinaujinančių energijos šaltinių. Sumažinkite duomenų atstumą Pasirinkite serverio vietas geografiškai arti pagrindinės auditorijos, kad sumažintumėte energijos, reikalingos duomenims keliauti per fizinę infrastruktūrą, vietas.
Ekologiško dizaino verslo pavyzdys Kai kurie gali ginčytis, kad „žaliasis UX“ skamba kaip kompromisas dėl kokybės. Priešingai, tai yra konkurencinis pranašumas. Tvarus dizainas yra našumo dizainas. Kai sumažinate puslapio svorį, jūsų svetainė įkeliama greičiau. Kai jūsų svetainė įkeliama greičiau, jūsų pagrindiniai interneto gyvybiniai rodikliai pagerėja. Kai pagerėja pagrindiniai interneto gyvybiniai rodikliai, jūsų SEO reitingas pakyla. Be to, senesnių įrenginių arba lėtesnių duomenų planų naudotojai (ypač besivystančiose rinkose) iš tikrųjų gali pasiekti jūsų produktą. Tai yra „įtraukiančio dizaino“ apibrėžimas. Mažindami „skaitmeninius riebalus“ sukuriame plonesnį, greitesnį ir lengviau pasiekiamą žiniatinklį. Mes tolstame nuo 2010-ųjų „vienkartinio dizaino“ link apastovesnė, pagarbesnė skaitmeninė architektūra. Išvada: „Švaraus“ dizaino ateitis Per du dizaino dešimtmečius mačiau daugybę tendencijų, ateinančių ir išeinančių. Skeuomorfizmas, plokščias dizainas, neumorfizmas – visa tai buvo estetinis pasirinkimas. Tačiau tvarus UX nėra tendencija; dabar tai būtina. Esame pirmoji dizainerių karta, kuri turi atsižvelgti į fizines mūsų skaitmeninio darbo pasekmes. Tvarus UX yra „win-win-win“. Tai geriau planetai, nes sumažina energijos sąnaudas. Tai geriau vartotojui, nes sukuria greitesnes ir labiau reaguojančias sąsajas. Ir tai geriau verslui, nes sumažina prieglobos išlaidas IR pagerina konversijų rodiklius. „Neribotų pikselių“ era baigėsi. 2026 m. įmantriausias dizainas yra tas, kuris palieka mažiausią pėdsaką. Mes nebėra tik dizaineriai; esame vartotojo akumuliatoriaus, duomenų plano ir galiausiai aplinkos sergėtojai. Raginimas veikti Kviečiu jus šiandien patikrinti tik vieną dabartinio projekto puslapį. Norėdami pamatyti jo poveikį, naudokite tokį įrankį kaip svetainės anglies skaičiuoklė. Tada ieškokite „nematomų atliekų“. Ar tas vaizdas gali būti SVG? Ar tas vaizdo įrašas gali būti statiškas herojus? Ar tą „garsią“ animaciją galima nutildyti? Pradėkite nuo mažo. Elegantiškiausias sprendimas dažnai yra tas, kuriame yra mažiausiai baitų.
