Недавно тестил возможность создания пользовательского интерфейса с помощью новой модели от GPT Image 2. Результат получался достаточно неплохим. 😎

Долго думал, как попробовать протестировать Claude Design и на каких задачах. Но идея совместить сгенерированный интерфейс и создание игрового прототипа на основе него оказалась удачной - всё хорошо сложилось.

Закинул скриншот и за пару итераций получил игровой прототип UI, предварительно попросив того же Claude написать нужный промпт.

I'm attaching a UI screenshot as a reference.
Your task is to build a fully functional interactive HTML prototype based on it.

Requirements:
1. Recreate all visible screens/windows from the reference as faithfully as possible —
colors, layout, typography, spacing, icons (use emoji or SVG approximations if needed)
2. Implement navigation and transitions between all screens shown or implied
(buttons, tabs, modals, sidebars — make them all clickable and working)
3. Use a single self-contained HTML file with embedded CSS and JS
4. Add smooth CSS transitions between views (fade, slide — match the tone of the UI)
5. Make it responsive if the reference suggests it
6. Preserve the visual style: if it's dark/light, minimal/dense, flat/glassmorphism —
commit fully to that aesthetic
7. All interactive elements must work: menus open, forms are fillable,
navigation switches views
Output: one complete .html file, no external dependencies except Google Fonts if needed.
Do not explain the code — just produce the artifact.

Только представьте: 10 минут назад была идея и вы уже на её основе делаете прототип.
Да, это всего лишь прототип, и нужно рисовать генерировать иконки и дорабатывать в общем. Но какой пласт работы ИИ уже способен забрать на себя. 😱

Кстати, иконки можно так же вытащить с референса, перевести в вектор через ИИ и использовать.

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

Скачать можно в ZIP, PDF, HTML, можно Send to Canva или Figma(но тут есть нюансы, так как нет прямого пути для Figma, есть обходные пути, спросите у своей LLM, она расскажет как).

P.S. Обдумывая этот пост, наткнулся ещё на одну мысль. Из-за большого количества инструментов и информационной каши у многих просто нет понимания, как их матчить между собой.
У меня есть крутой скилл ресёрчера с мультиагентной системой. Думаю, как появится время - пройдусь им и соберу стеки инструментов, которые хорошо дополняют друг друга и которые можно применять в работе, ускоряя процессы и помогая себе. Если интересно - поделюсь потом результатами. 🔥

@VAI_ART
#VAI_Practice