Секреты черных тем в дизайне интерфейсов и сайтов

История возникновения черных тем

В 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

Дайте выбор пользователю

Посетители сайта будут более лояльными к вам, если вы дадите им право выбора. Особенно сейчас, когда большинство тестирует темные темы и проявляет респект к приложениям, которые включаются в тренд и дают возможность изменить схему самостоятельно.

Выводы

Темное оформление зачастую придает элегантность, очень хорошо выглядит в портфолио, но на самом деле должно использоваться только когда это целесообразно и аргументировано.