Или шта треба имати на уму када развијате тамни режим за апликацију или веб локацију
2018. је показала да су тамни модови на путу. Сада када смо на половини 2019. године, можемо са сигурношћу рећи: они су овде и свуда су.
Почнимо са чињеницом да тамни режим уопште није нов концепт. Користи се доста дуго. А некада давно, заправо, дуго времена, једино су ово користили: монитори су били типа „зелено на црно“, али само зато што је луминисцентни премаз изнутра емитовао зеленкасти сјај када је био изложен зрачењу. .
Али чак и након увођења монитора у боји, тамни режим је наставио да постоји. Зашто је то тако?
Два су главна мотива који објашњавају зашто данас свака друга особа жури да својој апликацији дода мрачну тему. Пре свега: компјутери су свуда. Где год да погледамо постоји нека врста екрана. Користимо мобилне уређаје од јутра до касно у ноћ. Присуство тамног режима смањује напрезање очију када сте у кревету пре него што одете у кревет за „последњи пут“ скролујући кроз свој друштвени феед. мреже. (Ако сте попут мене, "прошли пут" може значити 3-часовно скроловање . Тамни режим? Да хвала! )
Други разлог су нове технологије производње екрана. Водећи модели великих компанија - Аппле, Гоогле, Самсунг, Хуавеи - сви су опремљени ОЛЕД екранима, који, за разлику од ЛЦД екрана, не захтевају позадинско осветљење. И то су заиста добре вести за вашу батерију. Замислите да гледате слику црног квадрата на свом телефону; са ЛЦД-ом, позадинско осветљење ће осветлити цео екран иако је већина црна. Али када гледате исту слику на ОЛЕД екрану, пиксели који чине црни квадрат се једноставно искључују. То значи да уопште не троше енергију.
Ове врсте екрана чине тамне режиме много интересантнијим. Коришћењем тамног интерфејса можете значајно продужити век трајања батерије вашег уређаја. . Тамни режими наравно иду руку под руку са променама корисничког интерфејса, па хајде да освежимо наше знање!
Тамни режими 101
Пре свега: „тамно“ није исто што и „црно“. Не покушавајте да замените белу позадину црном, јер ће то онемогућити коришћење сенки. Овакав дизајн ће бити супер раван (на лош начин).
Важно је имати на уму основне принципе сенчења/осветљења. Објекти који су више уздигнути требало би да буду светлији у сенци, симулирајући стварно осветљење и сенчење. Ово олакшава разликовање између различитих компоненти и њихове хијерархије.
Два идентична сива квадрата са сенком, један на 100% црној позадини, други на #121212. Како се објекат подиже, постаје светлија нијанса сиве.
У тамној теми и даље можете да радите са уобичајеном основном бојом све док је контраст у реду. Хајде да објаснимо на примеру.
У овом интерфејсу, главна радња је велико плаво дугме у доњој траци. Нема проблема у погледу контраста при пребацивању између светлих и тамних режима, дугме је и даље привлачно, икона је јасна, а генерално све је у реду.
Када се иста боја користи на различите начине, на пример у тексту, биће проблема. Покушајте да користите (много) мање засићену нијансу главне боје или потражите друге начине да уградите боје бренда у интерфејс.
Лево: Црвено на црном изгледа лоше. Тачно: смањите засићење и све изгледа добро. — прибл. превод
Исто важи и за све друге јаке боје које сте можда користили, као што су боје упозорења или грешке. Гоогле користи бели слој од 40% изнад подразумеване боје грешке при преласку на тамни режим. Ово је прилично добра полазна тачка јер ће побољшати нивое контраста како би одговарали АА стандардима. Наравно, увек можете да промените подешавања како вам одговара, али обавезно проверите нивое контраста. Иначе, користан алат за ову сврху је додатак Скетцх - , који тачно показује колики је контраст између 2 слоја.
Шта је са текстом?
Овде је све једноставно: ништа не би требало да буде 100% црно и 100% бело и обрнуто. Бела рефлектује светлосне таласе свих таласних дужина, црна апсорбује. Ако ставите 100% бели текст на 100% црну позадину, слова ће рефлектовати светлост, размазати се и постати мање читљива, што ће негативно утицати на читљивост.
Исто важи и за 100% белу позадину, која рефлектује превише светла да би се у потпуности фокусирала на речи. Покушајте да мало ублажите белу боју, користите светло сиву за позадину и текст на црној позадини. Ово ће смањити напрезање очију, спречити
Тамни режим је ту и неће нестати
Количина времена које проводимо пред екранима стално расте, а сваког новог дана у нашим животима се појављују нови екрани, од тренутка када се пробудимо па све док не заспимо. Ово је прилично нов феномен; наше очи се још нису навикле на ово повећање времена пред екраном касно увече. Овде долази у обзир тамни режим. Са увођењем ове функције у мацОС и Материал Десигн (и највероватније у иОС), верујемо да ће пре или касније постати подразумевана у свим апликацијама, како мобилним тако и десктоп рачунарима. И боље је бити спреман за ово!
Једини разлог да не примените тамни режим је када сте апсолутно 100% сигурни да се ваша апликација користи искључиво при јаком дневном светлу. То се, међутим, не дешава често.
Вреди поменути неколико ствари које ће захтевати посебну пажњу приликом имплементације мрачног режима, поред основних принципа који су раније сажети.
Што се тиче приступачности, тамни режим није најпогоднији, јер је контраст генерално мањи, што заузврат уопште не побољшава читљивост.
Али замислите да се спремате за спавање, заиста желите да спавате, али пре него што заспите, сетите се да некоме треба да пошаљете супер важну поруку која не може да чека ни једну ноћ. Зграбите телефон, укључите га и ААААААХ... светла позадина вашег иМессаге-а ће вас држати будним још 3 сата. Док се светли текст на тамној позадини не сматра најприступачнијим, ако имате тамни режим управо ове секунде повећати удобност за милион. Све зависи од ситуације у којој се корисник тренутно налази.
Зато мислимо аутоматски тамни режим тако кул идеја. Укључује се увече и гаси се ујутру. Корисник не треба ни да размишља о томе, што је веома згодно. Твиттер је урадио одличан посао са својим подешавањима тамног режима. Поред тога, имају и само тамни режим и још тамнији режим за све ове ОЛЕД екране, штедећи батерију и све што је повезано са тим. Овде је важно напоменути: дајте кориснику могућност да се пребаци ручно кад год жели: нема ништа горе од аутоматске промене интерфејса без могућности да се врати назад.
Твитер има аутоматски тамни режим који се укључује увече и гаси ујутру.
Такође, када развијате тему, вреди имати на уму да неке ствари једноставно не могу бити мрачне.
Узмите уређивач текста као што је Пагес. Можете учинити интерфејс тамним, али сам лист ће увек бити бео, симулирајући прави лист папира.
Странице са омогућеним тамним режимом
Исто важи и за све врсте уређивача садржаја, као што су Скетцх или Иллустратор. Иако се интерфејс може учинити тамним, табла са којом радите увек ће подразумевано бити бела.
Скицирајте у тамном режиму и још увек имате светло белу таблу.
Дакле, без обзира на апликацију, верујемо да ће тамни режими бити изворни за оперативни систем који користите, што значи да је најбоље да се припремите за будућност. биће мрачно.
Ако желите да сазнате више о развоју мрачних корисничких интерфејса, обавезно погледајте смернице , ово је био наш главни извор информација за овај чланак.
Извор: ввв.хабр.цом