2023-07-04 10:00:09
#token
Дизайн-токены — строительные блоки дизайн-систем. Их внедрение помогает сделать дизайн-системы унифицированными, гибкими и готовыми к масштабированию.
Общая информация
Дизайн-токены хранят повторяющиеся дизайн-решения в независимом от платформы виде. Они выступают единым источником достоверных данных для дизайн-системы.
Понятие «Единый источник достоверных данных» (Single source of truth — SSOT) означает централизованное хранилище, которое действует как единая точка отсчёта для различных артефактов.
Дизайн-решение — выбор, который дизайнер делает из имеющихся вариантов. Например, он выбирает фирменный цвет, шрифт или определяет интервал между заголовком и абзацем.
Дизайн-токены не зависят от конкретной платформы или технических возможностей, что делает их независимыми от платформы. Это упрощает внедрение дизайн-токенов на разных платформах и для разных веб- технологий.
Дизайн-токены обычно реализуют в удобном для восприятия формате, например, YAML или JSON, или используют их прямо внутри инструментов проектирования.
Такие инструменты преобразования дизайн-токенов, как Style Dictionary, Theo и другие, переводят независимые от платформы дизайн-токены в формат, соответствующий определённой платформе.
Например, для обозначения цветов в дизайн-токенах дизайнер может использовать формат HEX, в то время как в iOS будет использоваться RGBA, а Android — 8-значный HEX-код.
Преимущественно дизайн-токены хранят в себе такие решения визуального дизайна, как цвет, типографика, тени, значения отступов и другие. Но с их помощью можно также реализовать решения, которые не относятся к визуальному дизайну, например, анимации и ассеты.
Использование дизайн-токенов вместо жёстко закодированных значений помогает сделать дизайн-систему гибкой, что упрощает её создание, поддержку и масштабирование.
2.8K views07:00
В
