Figma
API
Web to code extension
Adobe XD
Discord
Twitter
GitHub
Figma Make: що це таке, як це працює, кредити та ліміти (2026)12 min read
Reading Time: 7 minutesFigma Make — це інструмент штучного інтелекту від Figma для підказок до програми. Ви описуєте те, що хочете, або починаєте з дизайну Figma, і він створює робочий прототип або веб-програму, яку ви можете попередньо переглядати, уточнювати в чаті, редагувати в коді та публікувати. Він знаходиться всередині Figma як спеціальний файл Make, тому може використовувати ваші проекти та бібліотеки як контекст. Він призначений для дизайнерів, менеджерів із продуктів і всіх, кому потрібно перетворити ідею на те, на що люди можуть натиснути.
Факти перевірено на сторінці Figma Make і в довідковому центрі Figma 1 листопада 2026 р. Плани, кредити та функції часто змінюються, тому перед покупкою перевіряйте поточні відомості в Figma.
У цьому посібнику пояснюється, що таке Figma Make, як він працює крок за кроком, які функції важливі, хто може його використовувати, як працюють кредити AI, як публікувати та експортувати та де його обмеження. Якщо ви обираєте між інструментами, наш Порівняння Figma Make проти Anima Playground охоплює альтернативи.
Що таке Figma Make?
Figma описує Figma Make як керований штучним інтелектом інструмент із підказкою до програми, який дозволяє втілювати ідеї та існуючі дизайни Figma у вигляді функціональних прототипів, веб-додатків та інтерактивного інтерфейсу користувача. Ви працюєте в чаті поруч із попереднім переглядом у реальному часі, і все, що ви створюєте, підтримується кодом, тож ви можете перемикатися між попереднім переглядом, редагуванням за допомогою наведення й натискання та самим кодом.
Figma представив Make на Config 2025, і він перетворився з однокомпонентної ідеї на повноцінний продукт із плановим режимом, редактором коду, серверними програмами, публікацією та інтеграцією. Він відокремлений від Figma Design: ви створюєте файл Make так само, як і інші файли Figma, використовуючи кнопку Make у своїх чернетках.
Що ви можете створити з Figma Make?
- Інтерактивний прототип потоку або функції для тестування з користувачами.
- Інтерактивна версія існуючого дизайну Figma із переходами та логікою.
- Невелика веб-програма або внутрішній інструмент із системою обробки даних і входу.
- Цільова сторінка або мікросайт, який можна опублікувати за загальнодоступною URL-адресою.
Як працює Figma Make, крок за кроком
- Створіть файл Make. У браузері файлів Figma відкрийте чернетки та натисніть Make у верхньому правому куті. Ви також можете почати з шаблону або клонувати репозиторій GitHub.
- Напишіть підказку. Опишіть, що ви хочете створити в чаті. Ви можете друкувати або диктувати. Конкретизуйте користувача, основне завдання та екрани.
- Додайте контекст. Додайте дизайни Figma або вставте фрейми в чат, перенесіть контекст стилю з бібліотеки Figma (платні плани), додайте серверну частину, підключіть інструменти через конектори MCP або дозвольте Make шукати в Інтернеті чи отримувати URL-адресу.
- Спершу сплануйте, якщо хочете контролювати. У платних планах режим планування генерує структурований план, який можна редагувати перед написанням коду.
- Перегляньте попередній перегляд. Make створює додаток і показує його в реальному часі. Клацайте по ньому так, як це зробив би користувач.
- Уточніть. Продовжуйте спілкуватися в чаті, використовуйте пункт і редагуйте, щоб змінити окремі елементи, додайте анотації та надішліть їх разом або відкрийте редактор коду та змініть код безпосередньо.
- Поділіться або опублікуйте. Поділіться файлом для відгуків із коментарями, скопіюйте попередній перегляд назад у Figma Design як шари, опублікуйте його за загальнодоступною URL-адресою або завантажте код.
Практична порада з документів Figma: прикріпіть фрейм або компонент, а не вставляйте посилання на свій файл Figma. Make не читає дизайн з URL-адреси, і вставлене посилання може призвести до несподіваного результату.
Основні характеристики Figma Make
| Особливість | Що він робить |
|---|---|
| Плановий режим | Створює редагований план перед початком генерації, тож ви можете спочатку уточнити наміри. |
| Додатки | Дозволяє прикріплювати проекти, зображення, відео, аудіо, текстові файли та PDF-файли, щоб керувати моделлю. |
| Наведіть та відредагуйте | Клацніть елемент у попередньому перегляді, щоб змінити його стиль, поміняти місцями або запропонувати змінити. |
| Анотації | Виберіть кілька елементів, опишіть зміни та відразу надішліть їх у модель. |
| Редактор коду | Перегляньте та відредагуйте згенерований код, додайте власні файли та додайте вказівки Make. |
| Комплекти Make | Синхронізуйте пакети npm, бібліотечні стилі та вказівки для створення прототипів вищої точності. |
| роз’єми MCP | Отримайте контекст із зовнішніх інструментів, таких як документи та завдання. |
| Історія версій | Попередньо переглядайте, вибирайте або відновлюйте будь-яку попередню версію, AI або посібник. |
| Коментарі та мобільний | Зберіть відгук про прототип і перегляньте його на телефоні. |
| Шаблони та власні навички | Повторно використовуйте перевірений робочий процес або створюйте власні інструкції для Make. |
Figma Make проти Figma Рівні коду проти Figma Sites
Ці троє плутаються. Figma Make працює у спеціальному файлі, де ви створюєте та публікуєте додаток. Шари коду дозволяють досліджувати інтерактивні ідеї поруч із вашими дизайнами на полотні Figma Design; перегляньте наш посібник Рівні коду Figma і специфікації. Figma Sites призначений для публікації веб-сайтів, розроблених у Figma. Виберіть Make, коли результат має працювати як додаток, і шари коду, якщо вам потрібен інтерактивний елемент поряд зі статичним дизайном.
Хто може використовувати Figma Make і скільки коштують кредити AI?
Figma Make доступний у планах Starter (з обмеженнями), Professional, Organization, Enterprise, Education (користувачі закладів вищої освіти та початкових курсів) і державних планів. Ваше місце визначає, що ви можете робити:
| Сидіння | Що ви можете зробити в Figma Make |
|---|---|
| Повний | Усе: створюйте файли Make у папках і групах, діліться, публікуйте, використовуйте редактор коду та експортуйте код. |
| Dev | Спробуйте Make у чернетках і експортуйте код. |
| Співпраця та перегляд | Спробуйте Make у чернетках. |
Make працює за допомогою кредитів AI. Кожне місце включає кредити, вони скидаються щомісяця, ними не можна ділитися чи переносити. Станом на документацію Figma у жовтні 2026 року:
| План (Повне місце) | Кредити AI на місяць |
|---|---|
| Starter | 500 (плюс щоденний ліміт 150) |
| Professional | 3,000 |
| Organization | 3,500 |
| Enterprise | 4,250 |
Скільки кредитів використовує підказка, залежить від обраної моделі та завдання. Власні приклади Figma, засновані на його моделі за замовчуванням у лютому 2026 року, внесли невеликі зміни, такі як оновлення шрифтів приблизно за 30 або більше кредитів і створення інтерактивного прикріпленого дизайну приблизно за 75 або більше. Вибір легшої моделі для невеликих змін і використання режиму планування для великих збірок допоможе зберегти ваші кредити.
Публікація, серверні програми та ефективна робота
Опублікувати
Натисніть «Опублікувати», встановіть назву, і Make надасть вам публічну URL-адресу, яка виглядає так three-random-words.figma.site. Ви можете підключити власний домен у підтримуваних планах. Опубліковані програми розміщено на Amazon Web Services із маршрутизацією через Cloudflare, вони не індексуються пошуковими системами за замовчуванням, а Make не має вбудованої панелі аналітики, хоча ви можете додати ідентифікатор Google Analytics у налаштуваннях.
Бекенд
Щоб зберігати дані та підтримувати вхід, ви можете попросити Make створити серверну програму на основі Payload із базою даних, сховищем файлів, автентифікацією та панеллю адміністратора або підключити власний проект Supabase із налаштувань Make.
Код експорту
Користувачі з повним статусом або місцем розробника можуть завантажувати всі файли у файлі Make як ZIP із дій із файлами на вкладці «Файли». Розглядайте завантажений файл як прототип кодової бази: запустіть його локально, перегляньте та відредагуйте, перш ніж створювати на ньому.
Перемістіть дизайн назад до Figma
У платних планах ви можете скопіювати поточний попередній перегляд як шари дизайну та вставити їх у Figma Design. Шари можна редагувати, але вони є знімком. Вони не є інтерактивними, не пов’язані з файлом Make і не прив’язані автоматично до вашої системи проектування.
Figma Make Обмеження, які слід знати перед початком
- Для більшості функцій потрібне повне місце в платному плані, а кредити можуть швидко закінчитися на великі збірки.
- Він створений для прототипів і простих програм. Виробниче програмне забезпечення все ще потребує технічної перевірки, тестування, безпеки та обслуговування.
- Зміни, які ви вносите до скопійованих шарів у Figma Design, не повертаються до файлу Make.
- Якщо ви попросите модель використовувати Supabase, а інтеграція не підключена, вона може створити макетний код замість робочого з’єднання.
- Для опублікованих сайтів елементи керування та аналітики SEO мінімальні.
- Ви не можете передати йому посилання Figma і очікувати, що він прочитає файл. Прикріпіть або наклейте рамку.
Якщо вам потрібен справжній інтерфейсний код, клон веб-сайту або додаток, який живе за межами Figma, подивіться на альтернативу, наприклад Anima Playground. Ми порівнюємо їх чесно в Figma Make проти Anima Playground.
Підкажіть ідеї для Figma Make
Спеціальні підказки, які називають користувача, завдання та стани, дають кращі перші результати. Спробуйте ці:
- «Створіть триетапний процес адаптації для програми бюджетування. Показуйте індикатор прогресу, перевіряйте кожне поле та закінчуйте на екрані успіху».
- «Перетворіть вкладену рамку цін на інтерактивну сторінку. Додайте щомісячний і річний перемикач і стан наведення курсора на кожну картку плану».
- «Створіть інформаційну панель підтримки для агента, який сортує квитки. Додайте фільтри, порожній стан і стан завантаження».
- «Створіть прототип мобільної каси з гостьовою касою, перевіркою адреси та підтвердженням замовлення».
Створіть робочу програму з Anima Playground
Віддаєте перевагу справжньому веб-сайту чи додатку, який можна експортувати та надсилати? Опишіть його, і Anima створить його.
Figma Make FAQ
Що таке Figma Make?
Figma Make — це інструмент Figma, що керує штучним інтелектом і підказує до програми. Він перетворює підказку або існуючий дизайн Figma на функціональний прототип, веб-додаток або інтерактивний інтерфейс користувача, який можна попередньо переглядати, редагувати в чаті чи коді та публікувати.
Figma Make безкоштовний?
Плани Starter можуть безкоштовно досліджувати Figma Make з обмеженнями, включаючи 500 кредитів ШІ на місяць і щоденний ліміт. Повні місця в платних планах отримують більше кредитів і таких функцій, як контекст командної бібліотеки, режим плану, обмін і публікація. Плани змінюються, тому перевірте ціни Figma.
Як використовувати Figma Make?
У своїх чернетках Figma клацніть Make, напишіть підказку в чаті, додайте дизайни чи контекст стилю, якщо вони у вас є, надішліть і уточніть результат за допомогою чату, вказівки та редагування або редактора коду. Потім поділіться, опублікуйте або експортуйте його.
Чи може Figma Make експортувати код?
так Користувачі з статусом Full або Dev можуть завантажити код файлу Make у форматі ZIP із вкладки «Файли». Його краще розглядати як прототип кодової бази, який ви переглядаєте перед використанням у виробництві.
Чи можу я опублікувати програму Figma Make?
так Повні особи можуть публікувати за загальнодоступною URL-адресою figma.site, а користувачі-початківці можуть публікувати публічно, лише якщо вони також публікують на Figma Community. Ви можете додати спеціальний домен у підтримуваних планах, а опубліковані програми не індексуються пошуковими системами за умовчанням.
Яка різниця між Figma Make і Anima Playground?
Figma Make створює прототипи та програми в екосистемі Figma. Anima Playground — це окремий робочий простір, який починається з підказок, дизайну Figma, URL-адрес або зображень і створює редаговані HTML або React, які можна експортувати, передавати та публікувати. Подробиці дивіться в нашому порівнянні.
