О дизайн-системе

Этот справочник описывает визуальный язык и даёт ссылки на единые компоненты и шаблоны для дизайнерских инструментов. Это не настоящий живой гайдлайн — скорее способ зафиксировать унифицированные решения визуального языка. Со временем эти страницы будут заменены настоящим живым гайдлайном.

Идеология

Зрелая дизайн-система состоит из трёх составляющих:

Визуальный язык

Определяет то, как мы создаём интерфейсы продуктов. Как и в обычном языке, у нас есть алфавит (переменные), слова (элементы интерфейса), предложения (компоненты) и цельные тексты (экраны и продукты). Алфавит неизменен, словарный запас постепенно меняется со временем, а вот предложения и тексты из них создаются всегда разные.

Единые компоненты на технологическом уровне

Являются единственным источником правды. Продукты под брендом Mail.Ru, которые используют их: медиапроекты, мобильный веб, часть productivity-сервисов.

Шаблоны для дизайнерских инструментов

Способ быстро показать идею, просто высокоуровневые скетчи. В идеальной ситуации макеты не верстают, а собирают из единых компонентов.