📱 Эффект пиксель арта в иллюстраторе
🔤 Типографика в дизайн системе ломается не на выборе шрифта, а на токенах
Пока у команды нет общей структуры, каждый экран собирается заново: где-то основной текст 14 px, где-то 16 px, где-то межстрочный интервал выставлен руками, где-то тот же жирный стиль выглядит иначе. В макетах это еще терпимо, а в разработке быстро превращается в хаос.
Олуватосин Обалана показывает практичный подход, как собрать типографику через примитивные и семантические токены и масштабировать ее на веб, планшет и мобильный в Фигме. Ценность статьи в том, что это не просто теория про читаемость, а пошаговая схема: как назвать токены, как разложить роли текста, как связать стили с переменными и переключать режимы без дублей.
Внутри:
– Какие принципы держат типографику в порядке: удобство, ясность, иерархия;
– Какие базовые требования по доступности стоит заложить сразу: размер текста, контраст, межстрочный интервал, масштабирование;
– Что такое примитивные токены и какие свойства туда выносить: семейство, вес, размер, межстрочный и межбуквенный интервалы;
– Зачем нужны семантические токены и почему они снимают ручные правки по всему продукту;
– Как назвать токены по иерархии, чтобы дизайнеры и разработчики говорили на одном языке;
– Как разложить роли текста: Display, Heading, Subheading, Body, Caption, Label;
– Как считать межстрочный интервал через коэффициенты для крупных и мелких размеров;
– Как настроить в Фигме режимы для разных экранов и не плодить отдельные стили под каждый размер.
➡️ Читать статью
———
💻 Курс по поиску работы 😍 Про дизайн
🔥 Вакансии дизайнерам
🎨 Референсы
Lineal - Notion style illustrations by Andreans D. Escobar
Небольшой набор из 54 иллюстраций в стиле Notion.
🔍Скачать иллюстрации🔍
#иллюстрации
Я очень люблю прием, когда похожие, но не одинаковые работы фланкируют дверной проем.
Завтра на Креативити — новый выпуск «Оверсайз мыслей»
Гостья — Джульетта Фрея: художница, мультидисциплинарная креаторка и человек, у которого идеи явно работают без выходных .
Поговорим про творчество, визуал, индустрию и мысли, которые обычно остаются «за кадром».
📎 Креативити
Сделай больше с Glass
→ Добавляй к любому объекту, форме или тексту
→ Скругляй отдельные углы
→ Управляй рассеиванием преломления света с помощью Splay
→ Применяй переменные из своей дизайн-системы
www.figma.com/community/file/1522715486231239473
