Переопределения экземпляров в Figma: что разрешено, что нельзя и как сбросить
Экземпляр компонента — это не копия, а ссылка. Поменяли главный компонент — обновились все экземпляры. Но часть свойств можно переопределить, и тогда конкретный экземпляр перестаёт следовать за мастером в этих деталях.
Граница между «можно» и «нельзя» описана в документации Figma, и она не всегда очевидна.
Что такое override
Документация: изменения, внесённые в экземпляр, Figma записывает и сохраняет — в том числе при замене экземпляра или выборе другого варианта.
Типичные переопределяемые свойства:
- текст;
- заливка;
- обводка;
- размер;
- эффекты (в пределах поддержки).
Ключевое: экземпляр остаётся связанным с компонентом. Это не detach — связь сохраняется, и обновления мастера продолжают применяться к непереопределённым свойствам.
Что переопределить нельзя
Документация перечисляет ограничения прямо:
- порядок слоёв (z-index) внутри экземпляра;
- позиция слоёв внутри компонента, включая элементы внутри auto layout;
- ограничения (constraints) слоёв;
- границы текстовых слоёв (bounds).
Если нужно поменять что-то из этого — придётся либо отсоединить экземпляр (detach), либо менять сам главный компонент.
Это важное архитектурное ограничение: если макет требует частой перестановки слоёв внутри компонента, значит структура компонента выбрана неудачно.
Сохранение правок при смене варианта
Отдельный механизм — change preservation. Документация объясняет два условия:
- Имена слоёв в текущем экземпляре и в выбираемом варианте должны совпадать.
- Figma проверяет, совпадали ли изменённые свойства между вариантами изначально; если да — правки сохраняются.
Практический вывод: одинаковые имена слоёв во всех вариантах — не косметика, а условие сохранения работы.
Если переименовать слой в одном варианте, при переключении текст сбросится к значению мастера.
Компонентные свойства
Современный способ управлять экземплярами — component properties:
- текстовые свойства;
- boolean-переключатели;
- instance swap;
- варианты.
Документация: переопределения по-прежнему доступны для свойств, не являющихся компонентными.
Практика: то, что должно меняться штатно (заголовок кнопки, иконка, состояние), лучше вынести в свойства компонента. Тогда дизайнеры не будут «ломать» экземпляры ручными правками.
Как сбросить изменения
Документация описывает точный путь:
- Выбрать экземпляр целиком или конкретный слой внутри него.
- Нажать More actions рядом с именем компонента в правой панели.
- Figma покажет список свойств, у которых есть изменения.
- Выбрать Reset → Reset [свойство] или Reset all changes.
Важно: Figma перечисляет только свойства с изменениями. Если списка нет — переопределений нет.
Почему обновления мастера «не доходят»
Частая жалоба: изменили цвет в главном компоненте, а в макете ничего не поменялось.
Причины:
- цвет был переопределён вручную в экземпляре;
- экземпляр отсоединён (detached);
- вложенный экземпляр был заменён на другой (instance swap) и считается переопределённым;
- изменение сделано в другом компоненте с похожим названием.
Диагностика: выделить экземпляр и посмотреть, какие изменения перечислены в More actions. Если в списке есть заливка — она переопределена.
Вложенные экземпляры
Отдельный источник путаницы. Вложенный экземпляр (например, иконка внутри кнопки) может быть переопределён независимо от родителя.
Если иконку заменили вручную, дальнейшие изменения главной иконки в этот экземпляр не придут. Это ожидаемое поведение: замена сделала вложенный экземпляр переопределённым.
Практика для дизайн-системы
Что помогает держать файлы управляемыми:
- Называйте слои одинаково во всех вариантах.
- Выносите изменяемое в свойства компонента.
- Не переопределяйте то, что должно управляться мастером.
- Периодически проходите по файлу и сбрасывайте лишние переопределения.
- Документируйте, какие свойства разрешено менять вручную.
Когда переопределение оправдано
- разный текст в кнопках одного типа;
- другая иконка в конкретном месте;
- экспериментальная правка перед изменением мастера;
- адаптация под редкий кейс, который не стоит заводить в компонент.
Если одно и то же переопределение повторяется в десяти местах — это сигнал, что нужен новый вариант или свойство.
Производительность
Переопределения не влияют на скорость заметно. Тяжелее становится файл с большим числом вложенных экземпляров и изображений.
На ноутбуке с 16 ГБ ОЗУ библиотека на несколько тысяч компонентов открывается дольше, но работать можно.
Как найти все переопределения
Figma не показывает глобальный список переопределений по файлу, поэтому искать приходится точечно.
Рабочий приём:
- Выделить экземпляр.
- Открыть More actions рядом с именем компонента.
- Посмотреть список изменённых свойств.
- Пройти так по ключевым экземплярам.
Если нужно проверить много объектов, помогает порядок «сверху вниз по макету»: сначала навигация, потом контент, потом футер. Так проще не потерять места.
Ещё один сигнал — расхождение между экземплярами одного компонента. Если два экземпляра выглядят по-разному, один из них точно переопределён.
Для библиотечных компонентов полезно договориться о правиле: переопределения допустимы только для контента (текст, иконка), но не для стилей. Тогда любые изменения цвета сразу видны как нарушение.
Когда detach оправдан
Отсоединение экземпляра (detach) разрывает связь с компонентом. Это не катастрофа, но и не норма.
Оправданные случаи:
- нужен уникальный объект, который больше никогда не повторится;
- требуется изменить структуру слоёв, что в экземпляре запрещено;
- компонент устарел и будет удалён;
- нужен одноразовый эксперимент, который не попадёт в макет.
Неоправданные:
- «так быстрее», потому что не хочется разбираться со свойствами;
- обход ограничения, которое на самом деле решается новым вариантом;
- правка одного элемента, который должен был стать свойством компонента.
Практика: перед detach спросите, появится ли такой объект ещё раз. Если да — нужен компонент, а не отсоединение.
Detach необратим: обратно в экземпляр объект не превратить, придётся заменять вручную.
Частые ошибки
Detach вместо переопределения. Теряется связь с мастером.
Разные имена слоёв в вариантах. Правки сбрасываются.
Попытка переставить слои внутри экземпляра. Невозможно по устройству.
Ожидание обновления после ручной правки цвета. Переопределение сильнее мастера.
Сброс «всего» вместо одного свойства. Теряется остальная работа.
FAQ
Что можно переопределить в экземпляре?
Текст, заливку, обводку, размер и часть эффектов.
Можно ли изменить порядок слоёв?
Нет, для этого нужен detach или правка компонента.
Почему текст сбросился при смене варианта?
Имена слоёв не совпали между вариантами.
Как сбросить одно свойство?
More actions → Reset → Reset [свойство].
Что такое component properties?
Штатные параметры компонента: текст, boolean, instance swap, вариант.