🧩 Какой способ управления размерами иконок в дизайн-системе реально работает
Если в дизайн-системе у иконок ограниченный набор размеров, это почти всегда превращается в отдельную архитектурную проблему. Снаружи всё выглядит просто: ну есть 12, 16, 20 и 24 пикселя, что тут обсуждать. А потом выясняется, что один подход удобен библиотекарю, но раздражает потребителя, второй красиво выглядит в теории, но ломается на вложенных компонентах, а третий требует больше ручной поддержки, зато лучше всего ведет себя в реальной работе.
Алиса Пакард очень внятно разбирает эти варианты и приходит к практичному выводу: лучший компромисс сейчас это size-свойство на каждом icon-компоненте, а не отдельные компоненты на каждый размер и не обертка для иконок. Потому что этот способ дает больше контроля там, где он нужен, не ломает опыт потребителя и лучше сочетается с preferred swaps и другими паттернами внутри библиотеки.
Внутри:
– Почему отдельные компоненты под каждый размер иконки быстро захламляют библиотеку;
– Зачем подход с variable modes выглядит заманчиво, но плохо масштабируется;
– Чем icon wrapper удобен для поддержки, но неудобен в реальном UI;
– Почему вложенные иконки внутри кнопок и других компонентов всё усложняют;
– Как size-свойство на каждом icon-компоненте решает проблему гибче;
– Почему этот подход лучше для preferred swaps и настройки конкретных компонентов;
– Какой компромисс приходится принять библиотекарю при таком решении;
– Почему в управлении размерами иконок сейчас важнее опыт потребителя, чем удобство внутренней поддержки.
➡️ Читать статью
———
💻 Курс по поиску работы 😍 Про дизайн
🔥 Вакансии дизайнерам
🎨 Референсы
