Актуальность компонента
Знакома ли вам ситуация, когда вы заходите в чужой макет, берете оттуда компоненты, верстаете экран и вот-вот собираетесь передавать его в разработку, как вдруг выясняется, что компоненты не из дизайн-системы (ДС) или давно удалены? Теперь всё приходится пересобирать. Знакомо?
Как это решить?
По этой причине и была придумана система статусов компонентов. Они помогают обозначить актуальность компонентов как для дизайнеров, так и для разработчиков. Статусы помогают определить, актуален ли компонент, удален ли он или это часть компонента из ДС, которым не следует пользоваться.
Давайте по порядку. Ниже приведен пример макета, в котором есть как актуальные, так и неактуальные компоненты.
Актуальный компонент
Если компонент актуален, например, он числится в ДС или это крупный продуктовый компонент, мы помечаем его синим ромбиком и указываем наименование компонента.
Пример: 🔷 buttonPrimary
Синий ромбик означает, что этот компонент актуален и его можно безопасно использовать.
Вложенный компонент
Бывают случаи, когда компонент состоит из нескольких дочерних компонентов, которые тоже могут числиться в ДС. Когда дизайнер отделяет компонент (detaching), он может забыть, что внутри остались вложенные элементы, которые могут быть изменены в любой момент. Разработчики затем находят такие компоненты и обращаются к ДС, хотя она их не предоставляет для открытого использования. Если вложенный компонент не был переименован и "отделен", может прийти обновление, которое нарушит работу сборки.
Такие компоненты мы помечаем желтым ромбиком с точкой, что означает, что компонент не должен публиковаться в открытый доступ.
Пример: .🔶 Title
Удаленный компонент
Если компонент нужно заменить или вовсе удалить, мы помечаем его красным кружком с точкой, чтобы указать, что компонент не должен быть использован.
Пример 1: .🔴 Устарел, требуется замена Пример 2: .🔴 Удален в связи с неактуальностью
Итог
Используя простые индикаторы (цветовые смайлы), можно легко подсветить разработчику или дизайнеру статус компонента и его тип. Это позволяет избежать использования неактуальных компонентов, а разработчики благодаря своей внимательности могут помочь исключить такие компоненты из макетов.
🚀 Подписывайтесь, чтобы узнать то, чего не знают другие! Уникальные инсайты и редкие темы для вашего роста и вдохновения! 💡