Автор: Богдана Данилейко
Секрети чорних тем в дизайні інтерфейсів та сайтів
Історія виникнення чорних тем
У 2017 році чорний колір став найпопулярнішим в жіночій моді, займаючи приблизно 36% ринку (за даними компанії Edited). І в наступному році ця тенденція захопила дизайн UI/UX. Хоча той же сервіс Spotify чи Adobe Creative Suite використовують принцип “світле на темному” вже давним-давно.
Чорна тема у дизайні сайтів та додатків почала набувати масової популярності уже з 2019 року.
Програмісти використовують чорне тло при розробці коду уже досить давно, так як він краще підходить для рефакторингу та вичитки, особливо при тривалій роботі.
Вперше темна (або чорна) тема була анонсована в системі Android 9, в операційній системі IOS – з 13 версії та в оновленнях October 2018 Update в Windows10 для ОС Windows.
За останнє десятиліття компаніями з усього світу було проведено достатньо досліджень з приводу темного/світлого інтерфейсу. Не будемо наводити в статті конкретні дослідження, просто наголосимо, що середнє арифметичне всіх висновків – це відсутність єдиної думки чи прямої кореляції від застосування того чи іншого оформлення чи правила. Є лише рекомендації, тренди та емпатія до користувача.
Опитування: habr.com
Чому ми ж всі так любимо чорні теми в інтерфейсі
Чорна тема швидко почала набирати популярність відразу по кількох вагомих причинах. По-перше, на мобільних пристроях її використання зберігає до 20% заряду батареї, оскільки дисплеї з Amoled-та OLED-екранами потребують менше “увімкнених” пікселей. По-друге, темна тема зменшує навантаження на очі в умовах недостатнього освітлення.
Зображення: habr.com
Дизайн сайту в темних тонах
Наразі все частіше створюють сайти у темних тонах, важко не погодитися, що у більшості випадків вони виглядаються елегантно і креативно.
Недавнє опитування ProBlogger показало, що 47% користувачів подобаються сайти зі світлим фоном, 10% відповіли, що завжди віддавали перевагу темному оформленню і 36% вважають, що успішність використання темної теми залежить від правильно оформленого контенту. Тож вибір суб’єктивний.
problogger.com
Розробка сайтів з темним оформленням
Поширена думка про те, що чорна тема може приховати недоліки сайту та збільшити лояльність користувачів. Але на практиці ця теорія не діє. Адже потрібно бачити всі фактори, які будуть вливати на сприйняття інформації.
Отже, розглянемо нюанси, які необхідно враховувати при оформленні сайту з чорною темою.
- Чорний колір підкреслює акценти на сайті
Якщо ваш сайт містить багато графіки, візуального контенту, то темне оформлення буде акцентувати погляд і зміщувати фокус уваги на потрібних місцях завдяки елементам іншого кольору.
- Темний – символ статусу
Темний інтерфейс у збалансованому поєднанні з мінімалізмом додає відчуття статусу, створює емоційний зв’язок з розкішстю та достатком.
- Темний не означає чорний
Якщо ви знайомі принципами малювання картин, то пам’ятаєте, що художники ніколи не використовують 100% чорний колір та 100% насичений колір будь-якого віддтінку. Людське око розрізняє сотні відтінків кольрорів навіть, коли картина насичена та малоконтрасна. Тому ніколи не використовуйте 100% чорний та 100% білий. Варто витримувати баланс та використовувати поєднання різних відтінків кольорів: обирайте золоту “середину”.
Зображення: habr.com
- Перевіряйте контраст
За даними ВООЗ, близько 285 мільйонів людей по всьому світі страждають від порушень зору, з них 39 мільйонів вражені сліпотою. Серед цих людей велика частка тих, хто страждає на дальтонізм, катаракту, макулодистрофію та інші вади зору.
Тому якщо людина не розрізняє основні кольори, попіклуйтеся, щоб вона змогла прочитати ваш інтерфейс, користуючись контрасністю темного фону і елементів графіки або тексту на ньому.
Зображення: cdnews.ru
- Проявляйте емпатію до свого користувача
Під конкрентий випадок обов’язково враховуйте: хто ваш клієнт, його вік, в який час доби буде більше відвідуваність сайту, скільки часу він буде проводити на сайті, спокійні емоції чи напругу хочете викликати контентом і т.д.
- Тестуйте сайт
Перегляньте свій сайт або додаток рано вранці, коли прокинулися, на вулиці, коли світить яскраве сонце чи в нічному транспорті.
Зображення: cdnews.ru
- Дайте вибір користувачу
Відвідувачі сайту будуть більш лояльними до вас, якщо ви дасте їм право вибору. Особливо наразі, коли більшість тестує темні теми і проявляє респект до додатків, що включаються в тренд і дають можливість змінити схему самостійно.
Висновок
Темне оформлення найчастіше придає елегантність, дуже гарно виглядає в портфоліо, але насправді має використовуватися тільки коли це доцільно та аргументовано.