Доаѓаат темни времиња

Или што треба да имате на ум кога развивате темен режим за апликација или веб-локација

2018 година покажа дека темните режими се на пат. Сега, кога сме на половина пат од 2019 година, можеме со сигурност да кажеме: тие се тука и ги има насекаде.

Пример за стар монитор зелено на црно

Да почнеме со фактот дека темниот режим воопшто не е нов концепт. Се користи доста долго време. И некогаш, всушност, долго време, ова беше единственото нешто што го користеа: мониторите беа од сортата „зелено на црно“, но само затоа што луминисцентната обвивка внатре емитуваше зеленкаст сјај кога беше изложен на зрачење. .

Но, дури и по воведувањето на мониторите во боја, темниот режим продолжи да постои. Зошто е ова така?

Постојат две главни причини зошто денес секој втор човек брза да додаде темна тема во својата апликација. Прво: компјутерите се насекаде. Каде и да погледнеме има некаков екран. Ние ги користиме нашите мобилни уреди од утро до доцна навечер. Присуството на темниот режим го намалува напрегањето на очите кога сте во кревет пред да легнете за „последен пат“ скролувајќи низ вашиот социјален извор. мрежи. (Ако сте како мене, „последен пат“ може да значи свиток од 3 часа Р/Инженерско порно. Темниот режим? Да молам! )

Друга причина се новите технологии за производство на екрани. Водечките модели на големите компании - Apple, Google, Samsung, Huawei - се опремени со OLED екрани, кои, за разлика од LCD дисплеите, не бараат позадинско осветлување. И тоа е навистина добра вест за вашата батерија. Замислете дека гледате слика на црн квадрат на вашиот телефон; со LCD екран, позадинското осветлување ќе го осветли целиот екран иако поголемиот дел од него е црно. Но, кога ја гледате истата слика на OLED дисплеј, пикселите што го сочинуваат црниот квадрат едноставно се исклучуваат. Ова значи дека тие воопшто не трошат енергија.

Овие типови на дисплеи ги прават темните режими многу поинтересни. Со користење на темен интерфејс, можете значително да го продолжите траењето на батеријата на вашиот уред. Проверете ги фактите и бројките од самитот на Android Dev минатиот ноември за да се уверите. Темните режими секако одат рака под рака со промените на корисничкиот интерфејс, па ајде да го подобриме нашето знаење!

Темни режими 101

Прво: „темно“ не е исто што и „црно“. Не обидувајте се да ја замените белата позадина со црна, бидејќи тоа ќе го оневозможи користењето на сенки. Ваков дизајн ќе биде супер рамен (на лош начин).

Важно е да се имаат предвид основните принципи на засенчување/осветлување. Објектите кои се поиздигнати треба да бидат полесни во сенка, симулирајќи реални осветлување и засенчување. Ова го олеснува разликувањето помеѓу различните компоненти и нивната хиерархија.

Два идентични сиви квадрати со сенка, едниот на 100% црна позадина, другиот на #121212. Како што се крева предметот, тој станува посветла сива нијанса.

Во темна тема, сè уште можете да работите со вашата редовна основна боја се додека контрастот е во ред. Да објасниме со пример.

Во овој интерфејс, главната акција е големото сино копче во долната лента. Нема никаков проблем во однос на контрастот при префрлување помеѓу светло или темни режими, копчето сè уште привлекува внимание, иконата е јасна и во целина се е во ред.

Кога истата боја се користи на различни начини, на пример во текст, ќе има проблеми. Обидете се да користите (многу) помалку заситена нијанса на главната боја или побарајте други начини да ги вклучите боите на брендот во интерфејсот.

Лево: Црвеното на црно изгледа лошо. Десно: намалете ја заситеноста и сè изгледа добро. - прибл. превод

Истото важи и за сите други силни бои што сте ги користеле, како што се боите за предупредување или грешки. Google користи прекривка од 40% бел слој над стандардната боја за грешка во нивната Упатства за дизајн на материјали кога се префрлате во темниот режим. Ова е прилично добра почетна точка бидејќи ќе ги подобри нивоата на контраст за да одговараат на стандардите АА. Се разбира, секогаш можете да ги менувате поставките како што ви одговара, но не заборавајте да ги проверите нивоата на контраст. Патем, корисна алатка за оваа намена е приклучокот Sketch - Старк, што точно покажува колкав контраст има помеѓу 2 слоја.

Што е со текстот?

Сè е едноставно овде: ништо не треба да биде 100% црно и 100% бело и обратно. Белата рефлектира светлосни бранови од сите бранови должини, црната апсорбира. Ако поставите 100% бел текст на 100% црна позадина, буквите ќе рефлектираат светлина, ќе се размачкаат и ќе станат помалку читливи, што негативно ќе влијае на читливоста.

Истото важи и за 100% бела позадина, која рефлектира премногу светлина за целосно да се фокусира на зборовите. Обидете се малку да ја омекнете белата боја, користете светло сива за позадини и текст на црни позадини. Ова ќе го намали напрегањето на очите, спречувајќи нивниот пренапон

Темниот режим е тука и нема да исчезне

Времето кое го поминуваме пред екраните постојано расте, а секој нов ден се појавуваат нови екрани во нашите животи, од моментот кога ќе се разбудиме додека не заспиеме. Ова е прилично нов феномен; нашите очи сè уште не се навикнати на ова зголемување на времето на екранот доцна навечер. Тука влегува во игра темниот режим. Со воведувањето на оваа функција во macOS и Material Design (и најверојатно во iOS), веруваме дека порано или подоцна таа ќе стане стандардна во сите апликации, и мобилни и десктоп. И подобро е да бидете подготвени за ова!

Единствената причина да не се имплементира темниот режим е кога сте апсолутно 100% сигурни дека вашата апликација се користи исклучиво при силна дневна светлина. Ова, сепак, не се случува често.

Вреди да се споменат неколку работи кои ќе бараат посебно внимание при спроведувањето на темниот режим, надвор од основните принципи сумирани претходно.

Во однос на пристапноста, темниот режим не е најзгодно, бидејќи контрастот е генерално помал, што пак воопшто не ја подобрува читливоста.

Извор

Но, замислете дека се подготвувате за спиење, навистина сакате да спиете, но токму пред да заспиете, се сеќавате дека треба да испратите некому супер важна порака која не може да чека ниту една ноќ. Го земате телефонот, го вклучувате и AAAAAAH... светлата позадина на вашиот iMessage ќе ве држи будни уште 3 часа. Додека светлиот текст на темна позадина не се смета за најпристапен, ако имате темен режим токму оваа секунда би зголемете ја удобноста за милион. Се зависи од ситуацијата во која се наоѓа корисникот во моментот.

Затоа мислиме автоматски темен режим толку кул идеја. Се вклучува навечер и се исклучува наутро. Корисникот дури и не треба да размислува за тоа, што е многу погодно. Твитер направи одлична работа со поставките за темниот режим. Покрај тоа, тие имаат и само темен режим и уште потемен режим за сите овие OLED екрани, заштедувајќи ја батеријата и сè што е поврзано со него. Важно е да се забележи овде: дајте му можност на корисникот да се префрли рачно кога сака: нема ништо полошо од автоматско менување на интерфејсот без можност за враќање назад.

Твитер има автоматски темно режим кој се вклучува навечер и се исклучува наутро.

Исто така, при развивање на тема, вреди да се има на ум дека некои работи едноставно не можат да се направат темни.

Земете уредувач на текст како Страници. Можете да го направите интерфејсот темен, но самиот лист секогаш ќе биде бел, симулирајќи вистински лист хартија.

Страници со овозможен темни режим

Истото важи и за сите видови уредници за креирање содржини, како што се Sketch или Illustrator. Иако интерфејсот може да се направи темен, уметничката табла со која работите стандардно секогаш ќе биде бела.

Скицирајте во темен режим и сепак имате светла бела табла.

Значи, без оглед на апликацијата, веруваме дека темните режими ќе дојдат до оперативниот систем што го користите, што значи дека е најдобро да се подготвите за иднината. ќе биде темно. 

Ако сакате да дознаете повеќе за развивање темни интерфејси, не заборавајте да ги проверите упатствата материјал дизајн, ова беше нашиот главен извор на информации за оваа статија.

Извор: www.habr.com