- 01design / typography
Подбор пары шрифтов
Headline + body шрифт которые работают вместе. Принципы, примеры, проверка.
- 02design / typography
Вертикальный ритм типографики
Line-height, spacing, baseline grid — текст который дышит и читается.
- 03design / design-system
Дизайн-токены из референса
Извлечь систему цветов, типографики, теней, радиусов и spacing из примера и оформить как токены.
- 04design / design-system
Иконочная система
Набор, вес, размеры, правила использования, accessibility — иконки как система, не разнобой.
- 05design / design-system
План внедрения тёмной темы
Не «инвертируй цвета», а отдельная палитра: токены, контраст, тени, иллюстрации.
- 06design / design-system
Документация компонента
Документация по компоненту: API, варианты, состояния, доступность, использование.
- 07design / motion
Микроанимации интерфейса
Hover, focus, активные состояния, toast'ы, переходы — мелкая моторика интерфейса.
- 08design / motion
Easing и тайминг анимаций
Кривые easing для разных случаев, длительности, ритм — почему «всё ease-in-out 300ms» это плохо.