Тёмная тема Телеграма

Февраль 2017

В феврале 2017 года Телеграм сделал редактор стилей и запустил конкурс на создание тем. Участникам предстояло разработать новую палитру и фон для десктопного месенджера. Я принял участие и победил.

Тема выполнена в тёмных тонах — так она несёт практическую пользу. Фирменный голубой заменён бирюзовым — так тема отличается от других. В пару к акцентному цвету добавлен второстепенный сиреневый — с ним интерфейс не выглядит скучно.

Заглушки и имена выкрашены в разные цвета специально — это помогает находить чаты и людей быстрее. В тёмной теме цвета хорошо различимы и контрастны, причём и на тёмно-сером фоне, и при наведении, и в случае выделенного чата в списке.

Тема выглядит чисто из-за ряда хитростей. Во-первых, соседние элементы с разной плотностью оптически скомпенсированы. Например, пиктограммы возле названий чатов чуть темнее самих названий (иначе дисбаланс). Во-вторых, бело-серые оттенки подобраны не через прозрачность, а путём изменения яркости и насыщенности нижележащего цвета. Скажем, цвет времени отправки в исходящем сообщении — это не полупрозрачный белый, а более светлый и менее яркий бирюзовый (иначе тускло). В-третьих, тёмные оттенки холоднее. Допустим, основной тёмно-серый — это не потушенный бирюзовый, а чуть более синеватый оттенок (иначе желтит).

В результате получилось около 100 оттенков. Чтобы работалось удобнее, пришлось разобраться, за что отвечает каждый из 500 параметров, провести рефакторинг исходного файла и написать свою обёртку.

Для фона я нарисовал нейтральную иллюстрацию с пейзажем Лондона. В ней спрятаны две пасхалки: вместо часов Биг-Бена — логотип Телеграма, а справа от башни сидит собака — маскот Телеграма.

Спустя полгода в приложениях Телеграма на разных платформах появился ночной режим — такой же тёмный и такой же бирюзовый 🤔

В ролях

Колористика
  • Павел Ващенко
Иллюстрации
  • Павел Ващенко

За кадром