Кастомные навыки Figma Make: набор из 3 файлов для дизайн-системы

Сборка, которая ушла клиенту мимо дизайн-системы

Сборка для ревью была почти правильной — и именно такие опаснее всего. У кнопок оказался радиус 12px, хотя после ребрендинга в системе жестко закреплены 8px. Основной акцент отрисовался примерно как #18C5DA: визуально близко к клиентскому #06B6D4, но стоило вставить значение в палитру Figma, и расхождение сразу становилось очевидным. На третьем фрейме основной текст уже был набран кеглем 18px вместо заданных системой 16px.

С утренним промптом все было в порядке. Проблема скрывалась в промпте, который я написал шесть запросов назад. Figma Make сохраняет контекст в рамках сессии, но правила дизайн-системы постепенно размываются по мере удаления от сообщения, где они были заданы. К моменту доработки третьего варианта hero-блока модель уже импровизирует со значениями токенов, которые выглядят правдоподобно. В заметках к релизу за май 2026 года именно этот пробел назван причиной появления кастомных навыков: это упакованный набор инструкций, который можно вызвать в любом промпте, не вставляя правила заново. (Обзор заметок к релизу Figma, май 2026)

После создания набора навыков ниже я повторно запустил тот же бриф в Make. Радиус кнопок: 8px. Акцент: #06B6D4. Основной текст: 16px. Навык не сделал Make умнее — он сделал правила незабываемыми.

Что именно требует дизайн-система клиента

В статье используется реальная клиентская система. Ниже — обезличенные токены:

• Цвета: фон #0A0E14, основной цвет #E6EDF3, единственный акцент #06B6D4. Без второго акцента. Без градиентов.
• Отступы: база 8px. Разрешенная шкала: 8 / 16 / 24 / 40. Никаких промежуточных или выходящих за нее значений.
• Типографическая шкала: 14 / 16 / 20 / 32 / 48. Основной текст — 16. Не 18.
• Радиус: 8px у всех интерактивных поверхностей. 0 у карточек. Без исключений.
• Кнопка: один компонент, три состояния — default, hover, disabled. В состоянии default используется акцентная заливка; в disabled — основной цвет с непрозрачностью 30%.

Общий промпт «соблюдай наш фирменный стиль» проваливает каждый из этих пунктов, потому что прилагательные оставляют пространство для трактовки. «Холодный, минималистичный, с одним акцентом» подходит под тысячу систем. Модели нужен не мудборд, а таблица. Задача — добиться, чтобы каждая сборка Make для этого клиента сверялась с таблицей без повторного ввода правил в каждой сессии.

Кастомные навыки Figma Make: готовый набор из 3 .md-файлов

Кастомные навыки в Figma Make — это отдельные Markdown-файлы, оформленные по спецификации Agent Skills. Значение name во frontmatter становится слеш-командой. Навыки устанавливаются для аккаунта, доступны во всех принадлежащих вам файлах Make и — это важно — должны быть самодостаточными: никаких каталогов scripts/, references/ или assets/. Все, что потребуется модели, размещается прямо в инструкциях. (Кастомные навыки для Figma Make, справка Figma)

Эти три навыка закрывают 90% того, что раньше приходилось вставлять вручную.

/follow-ds-guidelines

Буквальная таблица токенов в виде инструкций. Никаких трактовок и прилагательных.

---
name: follow-ds-guidelines
description: Enforce the client design system on every generated frame.
---

You are building inside a locked design system. Use these exact values.
Do not improvise alternates, do not interpolate, do not soften.

## Color
- background: #0A0E14
- foreground: #E6EDF3
- accent: #06B6D4 (single accent, no secondary)

## Spacing (8px base)
- allowed: 8, 16, 24, 40
- forbidden: any value not in the allowed list

## Type ramp
- 14 / 16 / 20 / 32 / 48
- body is 16. never 18.

## Radius
- interactive surfaces: 8
- cards: 0

## Button (one component, three states)
- default: fill #06B6D4, foreground #0A0E14
- hover: fill #06B6D4 at 90% opacity
- disabled: foreground #E6EDF3 at 30% opacity

If a request would produce a value outside this table, return the closest
allowed value and flag the substitution in a comment.

/design-crit

Навык для ревью. Make проверяет текущий фрейм по таблице токенов и возвращает список пройденных и проваленных проверок, указывая проблемные значения в hex и пикселях.

---
name: design-crit
description: Audit the current frame against the client design system.
---

Walk the current frame top to bottom. For every visual element, check:
- color hex against the allowed palette
- spacing values against the 8 / 16 / 24 / 40 scale
- type size against the 14 / 16 / 20 / 32 / 48 ramp
- radius against 8 (interactive) or 0 (cards)

Return a table:
| Element | Property | Found | Expected | Pass/Fail |

End with a one-line verdict: PASS if all rows pass, FAIL otherwise.
Do not auto-fix. The human decides which deviations are intentional.

/insert-sample-data

Навык с тестовыми данными подставляет согласованные с клиентом тексты-заглушки, чтобы в сборки для ревью больше не попадали lorem ipsum и придуманные моделью названия компаний, к которым позднее возникают вопросы у юристов. (Обзор заметок к релизу за май 2026)

---
name: insert-sample-data
description: Replace placeholder text with approved sample data.
---

When asked for sample content, use only this set:

## Names
Sarah Chen, Marcus Okafor, Priya Raman, Diego Alvarez

## Company names (fictional, cleared)
Northwind Labs, Apex & Vine, Halcyon Group, Stratus Co

## Numbers
Use round numbers in product UI: 1,240 / 3,500 / 12,800.
Avoid revenue-shaped numbers unless asked.

Never use lorem ipsum. Never invent a real-sounding brand name not on this list.

Три файла. Каждый заменяет то, что раньше приходилось вставлять заново.

Как подключить Notion, чтобы навык читал актуальную дизайн-систему

Подход со статическими токенами в /follow-ds-guidelines подходит для зафиксированной системы. Но как только клиент обновит токен — а это обязательно случится, — встроенная таблица устареет. Решение — связать навык с коннектором, чтобы Make обращался к актуальному источнику. (Коннекторы в Figma Make, справка Figma)

В файле этого клиента схема устроена так: дизайн-система хранится на одной странице Notion с теми же разделами, что и в навыке (Color, Spacing, Type ramp, Radius, Button). В одном промпте я вызываю и навык, и коннектор.

Use the /follow-ds-guidelines skill, but pull the current token values
from @Notion "Halcyon – Design System v3" and override the inline table
where they differ. Then build the pricing section per the attached spec.

По той же схеме промпт может получить PRD из Drive — @Drive "Halcyon pricing PRD" — и Make за один проход объединит контекст дизайн-системы и спецификации. (Обзор заметок к релизу за май 2026)

Для каждого клиента я выбираю так: если система не менялась квартал, токены остаются внутри; если она еще развивается, данные приходят через коннектор. Сам файл навыка .md в обоих случаях одинаков — меняется только промпт. Это намеренное ограничение. Мне не нужен отдельный навык для каждого клиента; нужен один навык, который умеет принимать переопределения.

Отдельно стоит упомянуть /prototype-to-figma на MCP-сервере Figma: это другой механизм. Навык предустановлен для переноса из кода на холст и обратно, его не создают вручную. Кастомные навыки Make устроены наоборот: вы пишете их сами, они работают внутри Make и не затрагивают слой MCP.

Что не сработало: недетерминированность и цена командного доступа

В анонсе не прозвучали три важных момента.

Охват моделей уже, чем следует из документации. Сейчас кастомные навыки работают только с моделью Figma Make по умолчанию и Claude Opus 4.7. Если команда выбрала в Make другую модель, навык не применится, причем заметной ошибки не будет — правила просто останутся без контроля. (Кастомные навыки для Figma Make, справка Figma) Когда в командной сборке снова оказывается неверный радиус, сначала я проверяю именно это.

Результаты согласованы «очень часто», но не идентичны. Так формулирует сама Figma. Модель недетерминирована, поэтому на сложном фрейме /design-crit иногда пропускает отклонение или помечает как ошибку осознанное решение. (Кастомные навыки для Figma Make, справка Figma) Для меня этот навык — быстрый первый проход, а не финальное согласование.

Главная операционная проблема — цена распространения. Сегодня кастомные навыки привязаны к аккаунту. Чтобы передать набор коллеге, нужно экспортировать файлы .md, после чего коллега загрузит их в свой аккаунт. Публикации на уровне организации нет. (Кастомные навыки для Figma Make, справка Figma) Для студии с несколькими клиентскими системами это ощутимое трение: каждый новый сотрудник вручную устанавливает все активные навыки, а после каждого обновления навык приходится экспортировать заново. Решение скучное, но рабочее: хранить версии файлов .md в клиентском репозитории — у нас они лежат рядом с дизайн-токенами в том же монорепозитории — и ставить теги релизов. Тогда у загрузки появляется единый источник истины вместо сообщения в Slack.

Если смотреть на это как на операционные расходы студии при работе с платформами, где издержки начисляются на каждое рабочее место, я уже разбирал экономику премиального тарифа Webflow по той же причине: инструменты берут деньги за видимую поверхность, а вы платите еще и за скрытые издержки интеграции.

Вывод: что отдать навыку, а что оставить человеку

После нескольких недель работы с этим подходом в DVNC.studio я пришел к простому правилу: все, что пришлось вводить больше двух раз, отправляется в навык. Таблицы токенов, чек-листы ревью, правила для тестовых данных, шаблоны аннотаций доступности. Творчества здесь нет. Есть только рутина, которая раньше отнимала время.

За человеком остается решение. /design-crit отмечает значение вне системы, но не определяет, ошибка это или намеренное исключение для разовой маркетинговой страницы. Навык отлично справляется с формулировкой «здесь радиус 12, а должен быть 8». Но он не понимает контекст: «радиус 12 появился потому, что концепции кампании нужна была более мягкая карточка, и мы согласовали это во вторник». Вынести такое суждение — и есть работа.

Что сделать к следующему вторнику: выберите дизайн-систему клиента, которой пользуетесь чаще всего. Откройте файл .md. Вставьте таблицу токенов так же, как я вставил таблицу Halcyon выше. Сохраните файл как follow-ds-guidelines.md, загрузите его как кастомный навык, прогоните через него одну реальную сборку, затем запустите /design-crit для результата и вручную сравните отчет с таблицей токенов. Если навык заметил то же, что заметили бы вы, он сэкономит час повторных промптов на клиента каждую неделю. Если он пропустил очевидную ошибку, исправлять нужно файл .md, а не историю промптов.