Tumedad ajad on tulekul

Või mida tuleks silmas pidada rakenduse või veebisaidi tumeda teema arendamisel

2018. aasta näitas: tumedad režiimid on tulekul. Nüüd, kui oleme 2019. aastasse poolest teel, saame kindlalt öelda: need on siin ja need on igal pool.

Näide vanast monitorist «rohelisest mustale»

Alustame sellest, et tumeda režiimi kontseptsioon ei ole uus. Seda on juba pikka aega kasutatud. Tegelikult kasutati kaua aega ainult seda: monitorid olid «roheline mustale», kuid ainult seetõttu, et luminofoorlamp, mis oli sees, kiirgab rohekas valgust, kui sellele kiirgusele mõjuda.

Aga isegi pärast värviliste monitoride kasutuselevõttu jätkas tumeda režiimi olemasolu. Miks see nii on?

On kaks peamist põhjust, miks tänapäeval kiirustatakse tumeda teema lisamisega oma rakendustesse. Esiteks: arvutid on igal pool. Kuidas iganes me ei vaataks, on igal pool mingi ekraan. Kasutame oma mobiilseadmeid hommikul ja hilisõhtuni. Tumeda režiimi olemasolu vähendab silmade koormust, kui te voodis enne magamaminekut „viimast korda” sirvite sotsiaalmeedia söötu. (Kui olete nagu mina, siis „viimane kord” võib tähendada 3-tunnist kerimist. R/EngineeringPorn. Tumeda režiimiga? Jah, palun!

Veel üks põhjus on uued ekraanide tootmistehnoloogiad. Suurte ettevõtete lipulaevade mudelid — Apple, Google, Samsung, Huawei — on kõik varustatud OLED-ekraanidega, mis erinevalt LCD-eksraanidest ei vajada tagasivalgustust. See on tõeliselt hea uudis teie akule. Kujutage ette, et vaatate musta ruudu pilti oma telefonis; LCD-ekraaniga valgustab tagasalve kogu ekraani, kuigi enamik sellest on must. Kuid kui vaatate sama pilti OLED-ekraanil, lülituvad need pikslid, millest must ruut koosneb, lihtsalt välja. See tähendab, et nad ei tarbi üldse energiat.

Need ekraanitüübid muudavad tumedad režiimid palju huvitavamaks. Kasutades tumedat liidest, saate oluliselt pikendada oma seadme aku kasutusaega. Tutvuge faktide ja numbritega eelmise aasta novembris toimunud Android Dev tipptasemel üritusel, et veenduda selles ise.. Tumedad režiimid käivad kindlasti koos UI muutustega, seega värskendame oma teadmisi!

Tumedad režiimid 101

Esiteks: "tume" ei võrdu "mustaga". Ärge proovige asendada valget tausta mustaga, kuna see muudab varjude kasutamise võimatuks. Selline disain on super lame (halvas mõttes).

Oluline on meeles pidada varjutamise/valgustamise põhialuseid. Üksused, mis on kõrgemal, peaksid varjus olema heledamad, jäljendades tegelikku valgustust ja varjutamist. Nii on lihtsam eristada erinevaid komponente ja nende hierarhiat.

Kaks sama halli ruutu varjuga, üks 100% mustal taustal, teine #121212. Kui kaitse on kõrgem, omandab objekt heledama halli tooni.

Tumedal teemal saab siiski kasutada oma tavapärast põhivärvi, kui kontrast on korras. Selgitame näite abil.

Selles liideses on peamine tegevus suur sinine nupp allosas. Kontrasti osas pole probleemi, kui lülituda heledalt pimedaks režiimiks, nupp köidab jätkuvalt tähelepanu, ikoon on selge, üldiselt on kõik suurepärane.

Kui sama värvi kasutatakse erinevalt, näiteks tekstis — tekivad probleemid. Proovige kasutada (oluliselt) vähem küllastunud põhivärvi tooni või leidke teisi viise oma brändi värvide integreerimiseks liidesesse.

Vasakul: punane mustal näeb halb välja. Paremal: vähendame küllastust — ja kõik on hästi. — tõlke märkus.

Sama kehtib ka teiste küllastunud värvide kohta, mida võisite kasutada, nagu näiteks hoiatuse või vea värvid. Google kasutab oma defolti veavärvi peal 40% ulatuses valge kihi kattekihti Material Design'i juhistes tumeda režiimi lülitamisel. See on üsna hea alguspunkt, kuna see parandab kontrastsuse taset vastavusse viimiseks AA standarditega. Muidugi võite alati seadeid oma äranägemise järgi muuta, kuid ärge unustage kontrollida kontrastsuse taset. Muide, kasulik tööriist selleks on Sketch'i pistikprogramm — Stark , mis näitab täpselt, kui palju kontrasti on kahe kihi vahel.Kuidas tekstiga on?

Kuidas on teksti kohta?

Siin on see lihtne: miski ei tohi olla 100% must ja 100% valge ning vastupidi. Valge peegeldab kõikide pikkustega valguslainete energiat, must aga neelab. Kui asetada 100% valge tekst 100% mustale taustale, peegeldavad tähed valgust, lähevad uduseks ja muutuvad vähem loetavaks, mis halvendab lugemist.

Sama kehtib ka 100% valge tausta kohta, mis peegeldab liiga palju valgust, et sõnadele täielikult keskenduda. Proovige veidi valget värvi pehmendada, kasutage heledat halli mustadel taustadel. See vähendab silmade koormust, vältides nende ülepingutamist.

Tumedat režiimi ei ole siia tulemas.

Koguaeg, mille me veedame ekraanide ees, kasvab pidevalt, ja iga uus päev toob meie ellu uusi ekraane, alates ärkamisest kuni une tulekuni. See on üsna uus nähtus, meie silmad ei ole veel harjunud sellega, et oleme hilja õhtul ekraani ees nii kaua. Just siin tulebki mängu tume režiim. Pärast selle funktsiooni sissetoomist macOS-is ja Material Design'is (ja tõenäoliselt ka iOS-is) usume, et varem või hiljem muutub see kõikides rakendustes, nii mobiilsetes kui ka lauaarvutites, vaikeseadeks. Ja oleks parem olla sellele valmis!

Ainus põhjus, miks tume režiim ei ole kasutusele võetud, on see, kui olete täiesti 100% kindel, et teie rakendust kasutatakse ainult eredates päevavalgustes. Selliseid olukordi juhtub harva.

Mõned asjad väärivad mainimist, mis vajavad erilist tähelepanu, kui tume režiim rakendada, peale varem kokkuvõtlikult toodud põhiprintsiipide.

Ligipääsetavuse seisukohalt ei ole tume režiim kõige mugavam, kuna kontrast on üldiselt madalam, mis omakorda ei paranda loetavust.

Allikas

Aga proovige ette kujutada, et valmistute magama minema, olete väga väsinud, kuid just enne, kui magama jääte, meenutate, et peate kellelegi saatma superolulise sõnumi, mis ei saa isegi ühte ööd oodata. Võtate oma telefoni, lülitate selle sisse ja AAAAAAA... teie iMessage'i hele taust ei lase teil veel 3 tundi magama jääda. Kuigi hele tekst tumedal taustal ei ole kõige ligipääsetavam, suurendaks tume režiim sellel hetkel mugavust miljon korda. Kõik sõltub sellest, millises olukorras kasutaja just on.

Just seetõttu usume automaatne tumedat režiimi nii äge idee. See lülitub sisse õhtul ja välja hommikul. Kasutaja ei pea isegi selle üle mõtlema, mis on väga mugav. Twitter on teinud suurepärase töö tumeda režiimi seadistuste osas. Lisaks on neil olemas lihtne tume režiim ja veelgi tumedam režiim kõikide nende OLED-ekraanide jaoks, et säästa akut ja kõike sellega seonduvat. Siinkohal on oluline märkida: andke kasutajale võimalus käsitsi vahetada, kui ta seda soovib: ei ole midagi hullemat kui automaatne liidese muutmine ilma võimaluseta tagasi lülituda.

Twitteris on automaatne tume režiim, mis lülitub sisse õhtul ja välja hommikul.

Samuti tuleks teemade arendamisel meeles pidada, et teatud asju ei saavuta lihtsalt tumedaks.

Võtke näiteks tekstiredaktor, nagu Pages. Liidest saab teha tumedaks, kuid leht on alati valge, imiteerides tõelist paberilehte.

Pages tumeda režiimiga sisse lülitatud

Sama kehtib kõigi sisuloome redaktorite kohta, nagu Sketch või Illustrator. Kuigi liidese saab teha tumedaks, on töötab paneel, millega te töötate, alati vaikimisi valge.

Sketch tumedas režiimis ja endiselt ere valge tööpaneel.

Seetõttu arvame, et tume režiim saab natiivseks teie kasutatavale operatsioonisüsteemile, seega on parem valmistuda tulevikuks. see tuleb olema tume. 

Kui soovite rohkem teada tumedate liideste arendamisest, tutvuge kindlasti suunistega Material Design, see oli meie põhiteabeallikas selle artikli jaoks.

Allikas: habr.com