Добавить в корзинуПозвонить
Найти в Дзене
Секреты нейросетей

Stitch послушно перекраивал экраны

Ну времена пошли… ещё пару лет назад за такой стенд любого дизайнера бы обвинили в колдовстве. Вчера я стоял перед чёрным бесконечным холстом, а меня просили всего лишь: «Скажи словами, какое приложение ты хочешь». Я описал сервис для авторов курсов — главная, страница уроков, личный кабинет, аналитика по оплатам, тёмная тема, современный стиль — и нажал одну кнопку. Через минуту холст взорвался десятком экранов: разные варианты главной, несколько типов дашбордов, страницы с уроками, формы входа и оплаты. Я ещё не успел допить кофе, а у меня уже было то, ради чего раньше неделями гоняли прототипы туда‑сюда между дизайнером и разработчиком. Дальше началось самое странное. Вместо того чтобы перетаскивать прямоугольники мышкой, я начал просто разговаривать с интерфейсом. «Убери лишний текст, оставь только ключевые цифры», «сделай три версии дашборда — для новичка, профи и админа», «подсвети доход за неделю и прогресс по курсам». Stitch послушно перекраивал экраны, подсовывал новые вариант
Оглавление

Я стоял перед чёрным бесконечным холстом

не совсем чёрный
не совсем чёрный

Ну времена пошли… ещё пару лет назад за такой стенд любого дизайнера бы обвинили в колдовстве.

Вчера я стоял перед чёрным бесконечным холстом, а меня просили всего лишь: «Скажи словами, какое приложение ты хочешь». Я описал сервис для авторов курсов — главная, страница уроков, личный кабинет, аналитика по оплатам, тёмная тема, современный стиль — и нажал одну кнопку. Через минуту холст взорвался десятком экранов: разные варианты главной, несколько типов дашбордов, страницы с уроками, формы входа и оплаты. Я ещё не успел допить кофе, а у меня уже было то, ради чего раньше неделями гоняли прототипы туда‑сюда между дизайнером и разработчиком.

Дальше началось самое странное. Вместо того чтобы перетаскивать прямоугольники мышкой, я начал просто разговаривать с интерфейсом. «Убери лишний текст, оставь только ключевые цифры», «сделай три версии дашборда — для новичка, профи и админа», «подсвети доход за неделю и прогресс по курсам». Stitch послушно перекраивал экраны, подсовывал новые варианты, уточнял детали. Это было больше похоже на живой брейншторм с командой, чем на работу в редакторе: каждый промт рождал новую версию продукта, а не очередной скучный макет.

Мы вообще выключили клавиатуру

только голос
только голос

В какой‑то момент мы вообще выключили клавиатуру. Включили микрофон и начали командовать голосом: «Перекрась всё в тёмную тему, добавь блок с рекомендованными курсами, сделай кнопки крупнее и дружелюбнее». На глазах у десятков людей холст превращался то в минималистичный интерфейс для аналитиков, то в яркую витрину для маркетологов. Кто‑то из зала не выдержал и спросил: «А дизайнер здесь вообще ещё нужен?» — и это, пожалуй, лучший комплимент тому, что происходило на экране.

И вишенка на торте: когда шоу должно было закончиться красивой картинкой, инженеры нажали ещё одну кнопку — и весь этот «театр» превратился в код. Те же экраны, о которых мы только что спорили вслух, легли в аккуратный HTML, CSS, компоненты, которые разработчик тут же открыл в редакторе. Через пару минут формы уже что‑то отправляли, таблицы фильтровали данные, а макет превратился в работающий прототип. В голове невольно щёлкнуло: если так можно собирать интерфейс за вечер разговора с ИИ, то сколько идей у авторов и преподавателей всё ещё лежат «в столе» просто потому, что не было силы на дизайн и верстку?

Гибрид тренажёра

сделаю макет
сделаю макет

Ну времена пошли… люди часами вылизывают интерфейсы в редакторах, а кое‑кто уже делегирует это рыжему коту.

Один разработчик в сети рассказывал, как решил «по‑быстрому» прогнать свой старый скучный приложеньице через Stitch, пока делал себе кофе. Задал промт, накидал пару требований и, чтобы не скучать, взял на руки своего пушистого QA‑инженера — рыжего кота, который, как водится, считает клавиатуру законной территорией для прогулок. В самый момент, когда Stitch уже генерировал первые варианты, котяра гордо прошёлся по ноутбуку: открыл голосовой ввод, что‑то промяукал в микрофон и нажал пару случайных клавиш.
Хозяин сначала взвыл: «Ну всё, сломал демку, сейчас придётся начинать заново». Но вместо краша на холсте появилась третья версия интерфейса — почему‑то с огромными карточками профилей, яркими баннерами и отдельным блоком «Your daily streak», словно приложение внезапно превратилось в гибрид тренажёра и игры про питомцев. Народ в комментариях начал шутить, что это первая в мире UI‑концепция, сгенерированная в режиме «cat‑driven development», а автор честно признался: из всех вариантов именно «кошачий» макет клиент в итоге и выбрал — «самый живой и человеческий».

И вот тут становится по‑настоящему интересно: если даже случайный рыжий кот способен внести свой вклад в дизайн через Stitch, то что мешает нам с вами осознанно использовать этот инструмент, чтобы свои идеи сервисов и приложений доводить до прототипа за один вечер?

Вот это я и хочу разобрать дальше: интересно ли вам заглянуть за кулисы и шаг за шагом посмотреть, как из одной живой идеи сервиса можно прямо в Stitch получить и дизайн, и код, а потом подцепить к нему реального ИИ‑помощника?

Пока вы думаете, что бы такое загуглить в отзыве, мы посмотрим в какие передряги попадают мультяшные котики: