
Figma
Популярный облачный редактор для дизайна интерфейсов, сайтов и мобильных приложений и сборки интерактивных прототипов.
Канвас, где вы описываете, что нужно, а ИИ-агент вроде Claude Code рисует интерфейс и одновременно пишет его код.

Pencil — дизайн на канвасе, результат в коде
Pencil (pencil.dev) — холст, на котором дизайн делает ИИ-агент: вы пишете, что нужно («форма входа с полем для почты и кнопкой»), нажимаете Enter — и агент, например Claude Code, рисует это прямо на холсте и одновременно пишет код. Pencil при этом подсказывает агенту, где что лежит на экране, поэтому результат получается точным, а не «примерно похожим».
В комплекте четыре готовые дизайн-системы — Shadian, Halo, Lunarus и Nitro — с настроенными цветами, отступами, типографикой и правилами адаптивности. Слои и стили из Figma переносятся обычным копированием. Свой MCP-сервер передаёт агентам точное описание дизайна, а связь холста и кода двусторонняя: код можно экспортировать, готовые компоненты — импортировать обратно на холст, а токены — синхронизировать с проектом.
Сильные стороны: настоящая двусторонняя связь холста и кода; готовые дизайн-системы; бесплатен на этапе раннего доступа; перенос из Figma без потерь.
Слабые стороны: нужен отдельный платный ИИ-агент вроде Claude Code — без него Pencil ничего не нарисует; ранний доступ — логика работы может поменяться.
Вывод: перспективный выбор для тех, кто уже работает с ИИ-агентами и хочет визуальный слой поверх них; без своего агента инструмент не заработает.

Популярный облачный редактор для дизайна интерфейсов, сайтов и мобильных приложений и сборки интерактивных прототипов.

Программа для Mac, в которой рисуют интерфейсы сайтов и приложений: экраны, иконки, макеты. Работает быстро и без браузера, файлы лежат на вашем компьютере.

Онлайн-редактор, где статичную SVG-иконку или иллюстрацию можно оживить: задать анимацию по слоям и скачать один файл, который движется на любом сайте.