Najpierw o psychologii koloru
„Czerwony sprzedaje, niebieski buduje zaufanie, zielony kojarzy się z ekologią.” Takie zdania powtarza wiele poradników, ale badania nad psychologią koloru dają niejednoznaczne wyniki. Znaczenie koloru zależy od kontekstu, kultury i kategorii: ten sam czerwony znaczy co innego na opakowaniu słodyczy, a co innego w aplikacji bankowej.
Dlatego przy wyborze koloru ważniejsze są dwa pytania. Czy odróżnia Cię od konkurencji, która w Twojej branży często używa tych samych dwóch odcieni? I czy da się go użyć technicznie wszędzie tam, gdzie marka się pokazuje? Na to drugie pytanie odpowiada reszta tego artykułu.
Paleta to więcej niż jeden kolor
Marka, która ma tylko „swój kolor”, szybko zaczyna nim malować wszystko, a wtedy nic się nie wyróżnia. Dobra paleta ma kilka warstw:
- Kolor główny, rozpoznawalny i używany oszczędnie: przyciski, akcenty, najważniejsze elementy.
- Kolory neutralne, czyli tła, tekst, linie i powierzchnie. To one wypełniają większość ekranu.
- Akcenty, jeden albo dwa kolory pomocnicze do wykresów, ilustracji i wyróżnień.
- Kolory funkcjonalne: sukces, ostrzeżenie, błąd. Jeśli kolorem marki jest czerwony, komunikat o błędzie potrzebuje innego odcienia, żeby nie mylił się z przyciskiem.
Popularna reguła 60–30–10 (60% neutralnych, 30% koloru uzupełniającego, 10% akcentu) nie jest prawem, ale dobrze przypomina, że kolor główny działa najlepiej wtedy, gdy nie ma go wszędzie.
Kontrast, czyli czy da się to przeczytać
Wytyczne WCAG wymagają kontrastu co najmniej 4,5:1 dla zwykłego tekstu i 3:1 dla dużego tekstu oraz elementów interfejsu, takich jak obramowania pól czy ikony. Wiele jasnych kolorów marki, zwłaszcza żółte, jasnopomarańczowe i jasnozielone, nie spełnia tego z białym tekstem.
Nie trzeba przez to zmieniać marki. Wystarczy wariant: jasny kolor na duże powierzchnie i ilustracje, ciemniejszy odcień tego samego koloru na przyciski i tekst. Warto też pamiętać, że kolor nie może być jedynym nośnikiem informacji. Pole z błędem powinno mieć też komunikat, a nie tylko czerwoną ramkę.
Ekran i druk to dwa różne światy
Ekran świeci, papier odbija światło. Dlatego kolor marki potrzebuje kilku zapisów:
- HEX i RGB do stron, aplikacji i prezentacji.
- CMYK do druku cyfrowego i offsetowego.
- Pantone do druku kolorem dodatkowym, gdy kolor musi wyglądać identycznie na każdej partii materiałów.
Bardzo nasycone kolory ekranowe, zwłaszcza intensywne pomarańcze, zielenie i błękity, często wychodzą poza to, co da się wydrukować w CMYK. Wartości do druku trzeba więc dobrać osobno i sprawdzić na próbnym wydruku, a nie przeliczyć automatycznie w programie.
Tryb ciemny
Coraz więcej osób korzysta z telefonu i komputera w trybie ciemnym. Paleta zaprojektowana na białe tło nie przenosi się tam sama:
- Kolor główny na ciemnym tle często trzeba rozjaśnić, żeby utrzymać kontrast.
- Czysta czerń pod czysto białym tekstem męczy oczy. Lepiej działają bardzo ciemne szarości i lekko przygaszona biel.
- Logo potrzebuje wersji w negatywie.
- Kontrast trzeba sprawdzić jeszcze raz, osobno dla każdej pary kolorów.
Jak zapisać paletę
Paleta w pliku PDF z ładnymi kółkami nie wystarczy. Zespół i zewnętrzni wykonawcy potrzebują tabeli:
| Co zapisać | Po co |
|---|---|
| Nazwa i rola koloru | Żeby wszyscy mówili o tym samym |
| HEX, RGB, CMYK, Pantone | Żeby kolor wyglądał tak samo w każdym medium |
| Dozwolone pary tekstu i tła | Żeby nikt nie musiał liczyć kontrastu od nowa |
| Wariant na tryb ciemny | Żeby aplikacja i strona nie wymyślały go same |
| Przykłady użycia | Żeby było widać proporcje, a nie tylko próbki |
Kolory projektujemy razem ze znakiem i typografią, bo dopiero w komplecie widać, czy system działa. Jeśli zaczynasz od logo, przeczytaj też, jakiego rodzaju znaku potrzebuje Twoja firma, a o całym procesie przeczytasz na stronie brandingu.
Porozmawiajmy o Twoim projekcie
Pierwsza rozmowa trwa 30 minut i jest bezpłatna. Po niej wiesz, czy możemy pomóc i ile to będzie kosztować.
Zarezerwuj rozmowę
