Создание прототипов с помощью ИИ — демонстрация Figma Make Live

Надоело таскать с собой прототипы в Figma? Эта практическая демонстрация покажет вам, как создавать интерактивные, кликабельные прототипы с помощью ИИ — с анимацией, наведением курсора и реальной функциональностью — и всё это в кратчайшие сроки. В этой презентации на Startup Wisconsin Week Брианна Шаппи (руководитель отдела дизайна в Headway) подробно рассказывает о своём полном процессе создания прототипов с использованием ИИ в Figma Make. Вы увидите живую сборку поисковой системы Instacart, включая точные подсказки, обнаруженные ошибки и способы интеграции вашей дизайн-системы для достижения лучших результатов. Никакой теории — только реальные примеры того, что работает, а что нет. Основные темы → Основные термины в области ИИ, которые должен знать каждый дизайнер (LLM, агенты ИИ, MCP) → Сравнение инструментов: Figma Make, Cursor и Claude Code → Демонстрация: создание интерактивного прототипа поиска Instacart → Как подготовить файлы Figma и интегрировать дизайн-системы → Создание эффективных подсказок для инструментов прототипирования ИИ → Обработка ошибок, несоответствий и ограничений ИИ → Когда использовать прототипы ИИ с клиентами и заинтересованными сторонами → Вопросы качества кода при передаче разработчикам → Реальные примеры использования: клиентские демонстрации, исследования пользователей, совместная работа в команде → Ограничения современных инструментов ИИ для настольных и мобильных устройств → Вопросы и ответы: командные рабочие процессы, интеграция в производство, устранение неполадок ✦ О Брианне Шаппи ✦ Брианна Шаппи — ведущий дизайнер в Headway с 15-летним опытом работы со стартапами и корпоративными организациями. Она руководила глобальными командами дизайнеров и специализируется на разработке B2B SaaS-приложений и мобильных решений. Дизайн-система Headway (Shipwright Pro) доступна в сообществе Figma. Сегменты: 00:00 — Введение: Рабочие процессы ИИ для дизайнеров 02:02 — О Брианне и Headway 03:10 — Ключевые термины ИИ: LLM, AI Agents, MCP 05:58 — Обзор инструментов: Figma Make 06:44 — Сравнение инструментов: Преимущества Figma Make 08:36 — Обзор инструментов: Cursor 10:33 — Обзор инструментов: Claude Code 12:24 — Настройка демо: Пример Instacart 14:32 — Подготовка файлов и компонентов Figma 17:01 — Подключение дизайн-систем к Figma Make 18:52 — Рекомендации по именованию слоёв 21:13 — Начало сборки прототипа 23:57 — Создание эффективных подсказок 26:32 — Итерация: Исправление проблем и корректировка 31:10 — Результаты демо и устранение неполадок 37:28 — Ограничения Прототипирование ИИ 40:04 — Примеры использования: клиентские демонстрации и исследования пользователей 43:20 — Обзор и основные выводы 44:11 — Вопросы и ответы: Качество кода и передача проекта разработчикам 49:01 — Вопросы и ответы: Интеграция систем дизайна и рабочих процессов Свяжитесь с Headway: Сайт: https://headway.io #aidesign #figma #aifordesigners