Smashing Magazine: Как подготовить дизайн-систему к работе с AI

Статья Виталия Фридмана для Smashing Magazine решает проблему, которая проявляется сразу, как только команда начинает использовать AI для генерации прототипов: AI создаёт внешне правдоподобный результат, но нарушает правила отступов, игнорирует рекомендации по компонентам и изобретает паттерны, которых нет в дизайн-системе. Фридман доказывает, что это не проблема модели — это проблема документации. AI не может принимать корректные дизайн-решения на основе одних только макетов. Ему нужны структурированные инструкции, а большинство дизайн-систем их не предоставляет.

Статья предлагает трёхслойный подход. Первый слой — specification file: структурированный Markdown-документ с принципами дизайна, правилами отступов, выбором цветов, рекомендациями по использованию компонентов и приоритетами. Это даёт AI инструментам что-то читаемое и пригодное для работы, а не что-то, что нужно угадывать. Второй слой — слой токенов: определённые переменные в Figma, напрямую соответствующие синтаксису кода. Чем теснее выравнивание между переменными Figma и их кодовыми эквивалентами, тем надёжнее AI переходит между дизайном и реализацией без внесения ошибок. Третий слой — автоматизированный скрипт аудита, обычно использующий FigmaLint или аналогичный плагин, который выявляет жёстко заданные значения, открепившиеся компоненты и отсутствующие интерактивные состояния до того, как начнётся AI-генерация.

Главный тезис Фридмана: «AI не может магически устранить технический долг или дизайн-долг без надлежащих инструкций». Команды в Atlassian, IBM Carbon и Nordhealth, которые Фридман приводит как примеры, обнаружили, что подготовительная работа — определение и документирование этих ограничений — приносит пользу и вне AI. Она вынуждает дизайн и разработку договориться о решениях, которые слишком долго оставались подразумеваемыми.

Статья практична на протяжении всего текста. В ней рекомендуется конкретная структура файлов для spec-файлов, объясняется, что FigmaLint находит, а что упускает, и описывается, как версионировать спецификацию вместе с дизайн-системой, а не держать её отдельным документом.

Кому это полезно. Руководителям дизайн-систем и продуктовым дизайнерам в компаниях, где AI-генерация прототипов уже используется или вводится. Также полезно для тех, кто готовится интегрировать Figma Make или аналогичные инструменты в production-workflow, и для инженеров, которым нужно понять, почему ограничения дизайна должны быть записаны, а не подразумеваться.