Разработка интерфейсов по макетам Figma часто требует множества итераций и значительных временных затрат. Однако новый инструмент AutoCode от компании WaveMaker обещает упростить этот процесс, автоматически генерируя готовые компоненты для веб- и мобильных приложений.
AutoCode — это AI-инструмент, который преобразует дизайны Figma, созданные на основе Material 3, в готовый код для Angular (веб) и React Native (мобильные приложения). По словам Прашанта Редди, старшего директора по продуктам WaveMaker, AutoCode минимизирует количество итераций между дизайнерами и разработчиками, делая процесс передачи макетов максимально точным.
«Ручная передача дизайна от команды дизайнеров к фронтенд-разработчикам часто занимает много времени из-за необходимости многократных правок. AutoCode помогает сделать этот процесс идеальным, сокращая время на доработки и ускоряя delivery конечного продукта», — объяснил Редди.
WaveMaker позиционирует себя как low-code платформу, но её основная аудитория — профессиональные разработчики из финансовых институтов, крупных IT-компаний и независимых вендоров. Эти компании часто сталкиваются с необходимостью создания сотен экранов в рамках модернизации своих продуктов.
«Даже до появления больших языковых моделей (LLM) мы генерировали код для Angular и React Native, предоставляя его разработчикам для дальнейшей кастомизации. Это помогло нам завоевать доверие: разработчики видят реальный код, владеют им и могут адаптировать под свои нужды», — рассказал Дипак Анупалли, сооснователь и CTO WaveMaker.
AutoCode поддерживает дизайн-систему Material 3 от Google, которая включает готовые компоненты, стили и гайдлайны. Это позволяет дизайнерам создавать прототипы, соответствующие стандартам Material 3. Инструмент автоматически распознаёт элементы интерфейса, такие как формы, списки и карточки, и преобразует их в соответствующие виджеты в WaveMaker Studio.
Кроме того, AutoCode поддерживает Figma-переменные, режимы и дизайн-токены, что обеспечивает сохранение целостности дизайна на всех этапах разработки. Сгенерированный код можно кастомизировать, добавляя бизнес-логику прямо в среде WaveMaker Studio.
WaveMaker предлагает более 90 готовых компонентов, включая кнопки, текстовые поля, формы, таблицы, графики и мобильные элементы, такие как нижняя навигация. AutoCode не только распознаёт отдельные элементы, но и группирует их, создавая более сложные структуры, например, формы регистрации или списки карточек.
«Для программиста важно видеть не отдельные карточки, а список как массив данных. Наша AI-модель автоматически группирует элементы в логические абстракции, что упрощает работу с данными», — отметил Редди.
AutoCode использует машинное обучение (ML), но не является генеративным AI. Вместо обучения LLM инструмент опирается на метаданные из Figma, что делает его предсказуемым и исключает ошибки, связанные с «галлюцинациями» AI.
«Наше решение основано на ML-технологиях, что гарантирует стабильность и точность генерации кода. Мы создаём дизайн-токены, компоненты и страницы, обеспечивая контроль качества на каждом этапе», — пояснил Анупалли.
Дополнительно WaveMaker предлагает WaveMaker CoPilot — AI-ассистента, который помогает кастомизировать интерфейсы, сгенерированные AutoCode.
Компания Google анонсировала запуск Gemini 2.0 Flash, что знаменует начало новой эры в развитии их флагманских моделей искусственного интеллекта. Эта версия значительно превосходит своего предшественника — Gemini 1.5 Pro — демонстрируя вдвое более высокую скорость работы и улучшенные результаты на ключевых тестах производительности.
Превращение React в Полноценный Full Stack Фреймворк и Другие Технические Новости
React 19 вот-вот выйдет, спустя два года после выхода предыдущей версии, а еще обновления Angular и Astro, а также фонд искусственного интеллекта на GitHub.
Расширение C# Dev Kit включает в себя основные сервисы языка C#, помощь IntelliCode, возможности тестирования, отладки и управления проектами. Поддержка .NET MAUI и Unity сейчас находится в стадии предварительного просмотра.