Tryb ciemny

Czym jest tryb ciemny?

Bierzesz telefon do łóżka przed snem, światło w pokoju jest zgaszone, a biały ekran świeci ci w twarz jak lampa. Właśnie z powodu takich chwil powstał tryb ciemny.

Tryb ciemny (Dark Mode) to sposób wyświetlania ekranów strony lub aplikacji z ciemnym tłem oraz jasnym tekstem i ikonami, zamiast zwykłego czarnego tekstu na białym tle. Treść zostaje taka sama: te same przyciski, te same menu, te same słowa. Zmieniają się tylko kolory, żeby ekran był łagodny dla oczu, gdy wokół jest mało światła.

Mówi się na niego też tryb nocny albo ciemny motyw. Dziś jest wbudowany w systemy telefonów i komputerów oraz w większość aplikacji, których używamy na co dzień, więc ludzie oczekują go od każdej nowej strony i aplikacji.

Jak działa tryb ciemny?

Telefon i komputer mają ogólne ustawienie, w którym użytkownik wybiera jasny lub ciemny wygląd, a niektóre urządzenia przełączają się same o zachodzie słońca. Dobrze zrobiona strona lub aplikacja odczytuje to ustawienie i od pierwszej sekundy otwiera się w odpowiednich kolorach.

Jest też drugi sposób. Mały przycisk na stronie lub w aplikacji, często w kształcie słońca i księżyca, pozwala użytkownikowi samemu przełączać tryby. Potem system zapamiętuje ten wybór i nie wraca do trybu jasnego przy każdej wizycie.

Od środka wygląda to tak, że projektant przygotowuje dwa zestawy kolorów dla wszystkiego na ekranie: tła, tekstu, przycisków, ramek i tabel. System wybiera potem zestaw pasujący do trybu. To trochę jak pokój z dwoma rodzajami oświetlenia, jednym na dzień i drugim na wieczór, w którym meble stoją na swoich miejscach.

Dlaczego tryb ciemny jest dla ciebie ważny?

Jeśli masz stronę albo aplikację, odwiedzający otwierają ją o różnych porach dnia. Wielu z nich przegląda internet wieczorem. Tryb ciemny wyraźnie zmienia ich wrażenia w tych godzinach:

• Wygoda dla oczu przy słabym świetle: ciemny ekran nie razi w ciemnym pokoju, więc czytelnik może dokończyć artykuł albo dłużej przeglądać produkty bez dyskomfortu.
• Oszczędność baterii: w telefonach z ekranem OLED każdy czarny punkt jest prawie wyłączony i nie zużywa energii. Dlatego na takich ekranach tryb ciemny zużywa mniej baterii.
• Mniej zmęczenia przy długiej pracy: pracownik, który cały dzień siedzi przed panelem albo systemem do zarządzania, czuje różnicę pod koniec dnia, szczególnie na nocnej zmianie.
• Szacunek dla wyboru użytkownika: ktoś, kto ustawił w telefonie ciemny wygląd, a potem otwiera twoją jaskrawo białą stronę, poczuje, że strona nie zwraca na niego uwagi.

Czy to znaczy, że tryb ciemny jest zawsze lepszy? Nie. W słońcu albo w dobrze oświetlonym biurze wiele osób łatwiej czyta czarny tekst na białym tle. Chodzi o to, żeby wybór należał do użytkownika.

Tryb jasny i tryb ciemny: porównanie

Jak zaprojektować tryb ciemny przyjazny dla oczu

Samo odwrócenie kolorów zwykle daje słaby efekt. Tryb ciemny, przy którym ludzie czują się dobrze, wymaga wielu drobnych decyzji:

1. Ciemnoszary zamiast czystej czerni: czysta czerń obok jaskrawej bieli tworzy ostry kontrast, który męczy oczy. Ciemnoszare lub granatowe tło jest spokojniejsze.
2. Jasny tekst, ale nie jaskrawy: biel z lekką szarością czyta się wygodniej niż czystą biel.
3. Wystarczający kontrast: kontrast to różnica między kolorem tekstu a kolorem tła. Gdy jest za mała, czytanie staje się trudne, szczególnie dla osób starszych i słabowidzących. Standard dostępności WCAG określa minimum tej różnicy.
4. Łagodniejsze kolory marki: mocny niebieski albo czerwony wygląda na ciemnym tle krzykliwie i potrzebuje nieco spokojniejszego odcienia.
5. Logo i obrazy pasujące do obu teł: czarne logo znika na ciemnym tle, więc potrzebuje jasnej wersji. Bardzo jasne zdjęcia czasem trzeba lekko przyciemnić.
6. Tabele i wykresy: w panelach trzeba sprawdzić kolory słupków i linii, żeby były czytelne w obu trybach.

Częste błędy przy dodawaniu trybu ciemnego

• Włączenie trybu ciemnego na stronie głównej i zapomnienie o innych stronach, takich jak strona płatności czy okno logowania, które nagle świecą bielą.
• Blady szary tekst na ciemnym tle, którego prawie nikt nie umie przeczytać.
• Brak zapisu wyboru użytkownika, przez co strona za każdym razem wraca do trybu jasnego.
• Pomijanie ustawienia urządzenia i narzucanie wszystkim jednego trybu.
• Brak testów trybu ciemnego na prawdziwych telefonach przed startem, choć kolory wyglądają inaczej na każdym ekranie.
• Dodanie go na końcu projektu, gdy projekt graficzny jest już gotowy, przez co staje się łatką, a nie częścią interfejsu.

Tryb ciemny w stronach i aplikacjach, które tworzymy

W Linkysoft planujemy tryb ciemny od pierwszego dnia projektowania, a nie po jego zakończeniu. Każda strona, którą budujemy w ramach usługi projektowanie i tworzenie stron internetowych, ma wbudowany tryb ciemny, obsługę języka arabskiego i pisma od prawej do lewej (RTL) oraz standard dostępności WCAG 2.2. Przed startem testujemy ją na prawdziwych telefonach.

W tworzeniu aplikacji mobilnych projektujemy każdą aplikację od zera, z trybem jasnym, trybem ciemnym i dostępnymi ekranami, na iPhone'a i Androida. Potem publikujemy ją w App Store i Google Play i dbamy o jej aktualizacje.

Twój projekt to system do zarządzania, z którego zespół korzysta cały dzień, na przykład do sprzedaży, magazynu albo kadr? Wtedy budujemy go w ramach usługi aplikacje webowe i systemy do zarządzania, wokół sposobu pracy twojej firmy, i działa on na każdym urządzeniu. Tu wygoda oczu zasługuje na miejsce w planie, bo ten sam ekran jest otwarty przed pracownikiem osiem godzin lub dłużej.

Myślisz o nowej stronie albo aplikacji? Zacznij od bezpłatnej konsultacji z nami, a razem ustalimy, czego twoi użytkownicy potrzebują w dzień i w nocy.