Ես ավելի քան երկու տասնամյակ եմ անցկացրել օգտատերերի փորձի դիզայնի խրամատներում: Ես հիշում եմ սեղանի վրա հիմնված դասավորություններից CSS-ի անցումը, iPhone-ի գործարկման ժամանակ անցումը դեպի արձագանքող դիզայն և «ուշադրության տնտեսության» աճը: Բայց մինչ մենք կողմնորոշվում ենք 2026 թվականին, արդյունաբերությունը կանգնած է իր ամենակարևոր տեղաշարժի առջև: Մենք անցնում ենք «ցանկացած գնով դիզայնի» դարաշրջանից դեպի Կայուն UX-ի դարաշրջան: Դա այն չէ, ինչի մասին մտածում են դիզայներների մեծ մասը, այդ թվում՝ ես, մինչև որ ինձ հուշեց՝ լսելով այս մասին որպես հայեցակարգ: Տարիներ շարունակ մենք համացանցին վերաբերվել ենք որպես եթերային, անկշիռ ամպի։ Մենք ենթադրել ենք, որ թվային արտադրանքը «կանաչ» է պարզապես այն պատճառով, որ դրանք թղթի վրա չեն տպագրվել։ Ես էլ էի այդպես մտածում, և մինչ կլիմայի փոփոխության հայեցակարգը ի հայտ եկավ, այն ավելի շատ ծառերի փրկության մասին էր: Մենք սխալվեցինք։ Ամպը ֆիզիկական ենթակառուցվածք է, տվյալների կենտրոնների, ստորջրյա մալուխների և հովացման համակարգերի լայնածավալ ցանց, որը բզզում է 24/7: Մինչ AI-ի վրա կենտրոնացած տվյալների կենտրոնները համապատասխանում են զանգվածային ալյումինե ձուլարանների էներգիայի սպառմանը, դրանց բարձր աշխարհագրական խտությունը ստեղծում է ավելի ինտենսիվ և տեղայնացված բնապահպանական լարվածություն: Որպես UX դիզայներներ, մենք այս էներգիայի սպառման ճարտարապետներն ենք: Յուրաքանչյուր բարձր լուծաչափով հերոսի պատկեր, յուրաքանչյուր ավտոմատ նվագարկվող ֆոնային տեսանյութ և յուրաքանչյուր բարդ JavaScript անիմացիա, որը մենք հաստատում ենք, ուղղակի հրահանգ է պրոցեսորին՝ էներգիա սպառելու համար: Եթե մենք ցանկանում ենք կառուցել երկարատև ապագա, մենք պետք է դադարենք նախագծել «wow»-ի համար և սկսենք նախագծել արդյունավետության համար: Մութ ռեժիմ 2000-ականների սկզբին սպիտակ ֆոնը ստանդարտ էր, քանի որ դրանք նմանակում էին թղթի ծանոթությանը: Այնուամենայնիվ, սարքավորումները զարգացել են, և մեր դիզայնի փիլիսոփայությունը պետք է հետևի: LCD-ից OLED (օրգանական լույսի արտանետվող դիոդ) տեխնոլոգիայի անցումը հիմնովին փոխել է գույնի ազդեցությունը էներգիայի վրա:
Տրամաբանություն Ի տարբերություն ավանդական LCD էկրանների, որոնք պահանջում են հետին լույս, որը միշտ միացված է (նույնիսկ սևը ցուցադրելիս), OLED էկրանները լուսավորում են յուրաքանչյուր պիքսելն առանձին: Երբ պիքսելը սահմանվում է իսկական սևի (#000000), այդ հատուկ դիոդն ամբողջությամբ անջատված է: Այն վերցնում է զրոյական հզորություն: Նախագծելով ինտերֆեյսներ, որոնք նպաստում են ավելի մուգ գունապնակներին, մենք ոչ միայն հետևում ենք միտումին. մենք ֆիզիկապես նվազեցնում ենք օգտատիրոջ սարքի էներգիայի պահանջը: Տվյալները Էներգիայի խնայողությունները հեռու են աննշան լինելուց: 2021 թվականին Փրդյուի համալսարանի կողմից կատարված կարևոր ուսումնասիրությունը, որը դարձել է այս քննարկման ոսկե ստանդարտը, ցույց է տվել, որ 100% պայծառության դեպքում լուսային ռեժիմից մութ ռեժիմի անցնելը կարող է խնայել մարտկոցի էներգիայի միջինը 39%-47%-ը: Համաշխարհային մասշտաբով, եթե յուրաքանչյուր հիմնական հավելված լռելյայն անցնի մութ ռեժիմի, ցանցի պահանջարկի նվազումը աստղաբաշխական կլինի: Դիզայնի նպատակը 2026 թվականին Dark Mode-ն այլևս չպետք է լինի երկրորդական «թեմա», որը խցկված է կարգավորումների ցանկում: Մենք պետք է նախագծենք «մութ-առաջին» մտածելակերպով: Սա չի նշանակում, որ յուրաքանչյուր կայք պետք է նմանվի Matrix-ին, բայց դա նշանակում է, որ առաջնահերթություն է տրվում բարձր հակադրության մուգ թեմաներին որպես համակարգի կողմից նախընտրելի լռելյայն վիճակ: Սա երկարացնում է սարքի ապարատային ծառայության ժամկետը և նվազեցնում յուրաքանչյուր փոխազդեցության ածխածնի հետքը: Ես անձամբ նախընտրում եմ «Light-Mode»-ը կարդալու համար, ուստի իմաստ ունի ունենալ և՛ բաց, և՛ մուգ ռեժիմների տարբերակները: Կան նաև մատչելիության նկատառումներ՝ տրամադրելով երկու տարբերակները: Պատկերների և տեսանյութերի օպտիմիզացում Մենք դարձել ենք ծույլ դիզայներներ։ Բարձր արագությամբ 5G-ով և օպտիկամանրաթելային համակարգերով մենք դադարել ենք անհանգստանալ ֆայլերի չափերի մասին: Բջջային էջի միջին քաշը վերջին տասնամյակում ավելացել է ավելի քան 500%-ով, հիմնականում չօպտիմիզացված տեսողական ակտիվների շնորհիվ: Տրամաբանություն Կայքի «Թվային ճարպը» (այդ 4 ՄԲ Unsplash լուսանկարները և 15 ՄԲ ֆոնային տեսանյութերը) էջերի բեռնման էներգիայի ամենամեծ ներդրողն է: Յուրաքանչյուր մեգաբայթ, որը փոխանցվում է սերվերից հաճախորդ, պահանջում է էլեկտրաէներգիա փոխանցման, սերվերի մշակման և օգտագործողի մատուցման շարժիչի համար: Երբ մենք օգտագործում ենք զանգվածային ֆայլեր, մենք, ըստ էության, էներգիա ենք «այրում»՝ ցույց տալու մի նկար, որը կարող էր նույնքան արդյունավետ լինել փոքր չափի դեպքում: Էլ չենք խոսում, դուք նաև ավելի լավ օգտվողի փորձ եք ապահովում մի էջով, որը շատ ավելի արագ է բեռնվում:
Տվյալները Ըստ HTTP արխիվի՝ պատկերներն ու տեսանյութերը հետևողականորեն կազմում են էջի ընդհանուր քաշի առյուծի բաժինը: Այնուամենայնիվ, AVIF-ի և WebP-ի նման ժամանակակից ձևաչափերի անցումը կարող է նվազեցնել պատկերի քաշը մինչև 50%-ով՝ համեմատած JPEG-ի հետ՝ առանց որակի նկատելի կորստի: Թեև այս ձևաչափերն ինձ այնքան էլ ծանոթ չեն, որքան JPG-ն և PNG-ն, ես անհամբեր սպասում եմ դրանց օգտագործմանը՝ էջի չափը նվազեցնելու համար: ԱյնԴիզայնի նպատակը Վերջերս ես ղեկավարեցի կիբերանվտանգության հարթակի վերանախագծումը: Իրականացնելով «Առաջ և հետո» աուդիտ՝ մենք հայտնաբերեցինք, որ նրանց գլխավոր էջը բեռնում է 5,5 ՄԲ տվյալ: Փոխարինելով բարձրորակ լուսանկարչությունը SVG (Scalable Vector Graphics) արվեստով և օգտագործելով խելացի CSS գրադիենտներ՝ պատկերի ակտիվների փոխարեն՝ մենք իջեցրինք բեռը մինչև 1,2 ՄԲ: Դա էներգիայի բեռի 78%-ով կրճատում է: Որպես դիզայներ, ձեր առաջին հարցը միշտ պետք է լինի. «Արդյո՞ք ինձ լուսանկար է պետք դրա համար, թե՞ կարող եմ հասնել նույն զգացմունքային ռեզոնանսին կոդի միջոցով»:
Կանխամտածված շարժում. «բարձրաձայն» անիմացիաների կտրում Մենք ապրում ենք «scroll-jacking» և բարդ 3D Parallax էֆեկտների դարաշրջանում: Թեև դրանք կարող են մրցանակներ շահել Awwwards.com-ում, դրանք հաճախ էկոլոգիական աղետներ են: Տրամաբանություն Անիմացիան անվճար չէ: Բարդ անիմացիա ցուցադրելու համար սարքի GPU-ն (Գրաֆիկական մշակման միավորը) պետք է աշխատի բարձր հզորությամբ: Սա մեծացնում է պրոցեսորի ջերմաստիճանը, գործարկում է հովացման օդափոխիչները (նոութբուքերում) և արագորեն լիցքաթափում մարտկոցը: «Բարձրաձայն» անիմացիաները, որոնք անընդհատ աշխատում են հետին պլանում կամ առաջացնում են զննարկիչի զանգվածային վերաներկումներ, էներգիայի համարժեք են ձեր մեքենան պարապուրդի մեջ թողնելու համար:
Տվյալները Google-ի Նյութերի դիզայնի ուղեցույցները շեշտում են «իմաստալից շարժումը»: Նրանք պնդում են, որ անիմացիան պետք է օգտագործվի միայն օգտատիրոջը կողմնորոշելու կամ հետադարձ կապ տրամադրելու համար։ Իսկ WebP-ի օգտագործումը JPEG-ի փոխարեն կարող է պահպանել էջի տվյալների 25-50%-ը: Դիզայնի նպատակը Մենք պետք է ընդունենք Իմաստալից շարժումը: Եթե անիմացիան չի օգնում օգտվողին կատարել առաջադրանքը կամ հասկանալ հիերարխիան, դա վատնում է: Մենք պետք է նախընտրենք CSS-ի անցումները, քան ծանր JavaScript գրադարանները, ինչպիսիք են GSAP-ը կամ Lottie-ն, որտեղ դա հնարավոր է, քանի որ CSS-ը ապարատային արագացված է և բրաուզերի հաշվարկման համար շատ ավելի արդյունավետ: Որպես UX դիզայներ, ես չեմ կարող վիճարկել այս մոտեցումը: Սա ոչ միայն օգնում է նվազեցնել տվյալների վատնումը, այլ նաև բարելավում է UX-ը մեր օգտատերերի համար: Յուրաքանչյուր նախագծի համար «Տվյալների բյուջե» սահմանելը Իմ UX-ի 20+ տարիների ընթացքում ամենահաջող նախագծերը հիմնականում եղել են ամենախիստ սահմանափակումներով: Ինչպես նախագիծն ունի ֆինանսական բյուջե, այն պետք է ունենա նաև ածխածնի և տվյալների բյուջե: Տրամաբանություն Տվյալների բյուջեն սահմանափակ է էջի ընդհանուր չափի համար (օրինակ՝ «Այս վայրէջքի էջը չի կարող գերազանցել 1 ՄԲ»): Սա ստիպում է դիզայներական թիմին կատարել դժվար, միտումնավոր ընտրություններ: Եթե ցանկանում եք ավելացնել նոր հետևող սկրիպտ կամ շքեղ տառատեսակի կշիռ, դուք պետք է «վճարեք» դրա համար՝ օպտիմալացնելով կամ հեռացնելով մեկ այլ բան: Սա թույլ չի տալիս «առանձնահատկությունների սողանքը» վերածվել «ածխածնային սողանքի»։ Տվյալները Կայուն վեբ դիզայնի մոդելը, որը մշակվել է ռահվիրաների կողմից, ինչպիսին Wholegrain Digital-ն է, ապահովում է մեկ էջի դիտման համար CO2-ի հաշվարկման բանաձև: Միջին կայքէջը արտադրում է մոտ 0,5 գրամ CO2 մեկ դիտման համար: Ամսական 1 միլիոն դիտում ունեցող կայքի համար դա տարեկան 6 մետրային տոննա CO2 է, որը համարժեք է մեքենան 15000 մղոն վարելուն: Դիզայնի նպատակը Կայուն UX ստուգաթերթ
Կրճատել Պատկերները Հարցրեք յուրաքանչյուր վիզուալի անհրաժեշտության մասին և օգտագործեք ամենափոքր լուծաչափը և ֆայլի ամենաարդյունավետ ձևաչափերը (օրինակ՝ AVIF) տվյալների փոխանցումը նվազագույնի հասցնելու համար: Օպտիմալացրեք տեսանյութը Վերացրեք ավտոմատ նվագարկվող լրատվամիջոցները և առաջնահերթություն տվեք խիստ սեղմված, կարճ օղակներին՝ ապահովելու համար, որ էներգիան ծախսվի միայն այն բովանդակության վրա, որը օգտատերը մտադիր է դիտել: Սահմանափակեք տառատեսակները Օգտագործեք առավելագույնը երկու վեբ տառատեսակի կշիռ կամ հավատարիմ մնացեք համակարգի դասական տառատեսակներին՝ սերվերի անհարկի հարցումները հեռացնելու և փքվածություն հաղորդելու համար: Recycle AssetsRepurpose մեկ պատկեր կամ տեսանյութ մի քանի անգամ օգտագործելով CSS զտիչներ և ծածկույթներ՝ տեսողական բազմազանություն ստեղծելու համար՝ առանց էջի ընդհանուր քաշը մեծացնելու: Ընտրեք Green HostingHost ձեր թվային արտադրանքը The Green Web Foundation-ի կողմից հաստատված սերվերների վրա՝ համոզվելու համար, որ դրանք սնուցվում են վերականգնվող էներգիայի աղբյուրներից: Նվազագույնի հասցրեք տվյալների հեռավորությունը Ընտրեք սերվերի վայրերը աշխարհագրորեն մոտ ձեր հիմնական լսարանին՝ նվազեցնելու ֆիզիկական ենթակառուցվածքով տվյալների փոխանցման համար պահանջվող էներգիան:
Էկոլոգիապես մաքուր դիզայնի բիզնես գործ Ոմանք կարող են պնդել, որ «Green UX»-ը հնչում է որպես որակի փոխզիջում: Ընդհակառակը, դա մրցակցային առավելություն է։ Կայուն դիզայնը կատարողական դիզայնն է: Երբ նվազեցնում եք էջի քաշը, ձեր կայքը ավելի արագ է բեռնվում: Երբ ձեր կայքը ավելի արագ է բեռնվում, ձեր Core Web Vitals-ը բարելավվում է: Երբ ձեր Core Web Vitals-ը բարելավվում է, ձեր SEO-ի վարկանիշը բարձրանում է: Ավելին, հին սարքերի կամ ավելի դանդաղ տվյալների պլանների (հատկապես զարգացող շուկաներում) օգտվողները կարող են իրականում մուտք գործել ձեր արտադրանքը: Սա «Ներառական դիզայնի» սահմանումն է։ Կտրելով «թվային ճարպը»՝ մենք ստեղծում ենք ավելի նիհար, արագ և հասանելի ցանց: Մենք հեռանում ենք 2010-ականների «մեկանգամյա օգտագործման դիզայնից» դեպի աավելի մշտական, հարգալից թվային ճարտարապետություն: Եզրակացություն. «Մաքուր» դիզայնի ապագան Իմ դիզայնի երկու տասնամյակի ընթացքում ես տեսել եմ բազմաթիվ միտումներ, որոնք գալիս և գնում են: Skeuomorphism, Flat Design, Neumorphism. դրանք բոլորը գեղագիտական ընտրություն էին: Բայց կայուն UX-ը միտում չէ. դա այժմ անհրաժեշտություն է: Մենք դիզայներների առաջին սերունդն ենք, ովքեր պետք է հաշվի առնեն մեր թվային աշխատանքի ֆիզիկական հետևանքները: Կայուն UX-ը «հաղթանակ-հաղթանակ» է: Դա ավելի լավ է մոլորակի համար, քանի որ այն նվազեցնում է էներգիայի սպառումը: Դա ավելի լավ է օգտագործողի համար, քանի որ դա հանգեցնում է ավելի արագ, ավելի արձագանքող միջերեսների: Եվ դա ավելի լավ է բիզնեսի համար, քանի որ այն նվազեցնում է հոստինգի ծախսերը ԵՎ բարելավում է փոխակերպման տոկոսադրույքները. «Անսահմանափակ պիքսելների» դարաշրջանն ավարտվել է. 2026 թվականին ամենաբարդ դիզայնը այն դիզայնն է, որն ամենափոքր հետքն է թողնում։ Մենք այլևս պարզապես դիզայներներ չենք. մենք օգտատիրոջ մարտկոցի, նրանց տվյալների պլանի և, ի վերջո, շրջակա միջավայրի պահապաններն ենք: Գործողության կոչ Ես կոչ եմ անում ձեզ այսօր ստուգել ձեր ընթացիկ նախագծի ընդամենը մեկ էջը: Օգտագործեք այնպիսի գործիք, ինչպիսին է Website Carbon Calculator-ը՝ դրա ազդեցությունը տեսնելու համար: Այնուհետև փնտրեք «անտեսանելի թափոններ»։ Կարո՞ղ է այդ պատկերը լինել SVG: Կարո՞ղ է այդ տեսանյութը ստատիկ հերոս լինել: Կարո՞ղ է այդ «աղմկոտ» անիմացիան լռել։ Սկսեք փոքրից: Ամենաէլեգանտ լուծումը հաճախ ամենաքիչ բայթերով լուծումն է: