Прототипирование и ИИ

На работе у нас проект одного очень сложного модуля к нашему продукту, дизайн которого мы делаем уже почти год. Бывает так, что мы его откладываем, занимаемся другими делами, потом возвращаемся, но длится это уже очень долго. Одна из причин — никак не удаётся нащупать правильные решения.

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

А на днях я подумал — почему бы не попробовать сделать прототип (срезав кое-какие острые углы, разумеется) при помощи ИИ? Выделил на это несколько рабочих часов, заперся в переговорки с дизайнерам и аналитиками и мы попробовали.

Выгрузить вёрстку из «Фигмы», где у нас нарисован дизайн, нам не удалось — предназначенные для этого плагины ничего не дали. Я решил с этой проблемой не бодаться, а попробовать сделать вёрстку из картинки «нулевого состояния», постепенно добавляя поведение так, как это описано в техническом задании.

Это был самый утомительный этап — картинку нейросеть «видит», но судя по тому как получилась первая версия, она её себе каким-то образом описывает на словах, а потом верстает со словесного рассказа.

Особенно хорошо это было заметно на иконках — элементы на них, чаще всего, те же самые, но нарисованы совсем иначе. Если остальную вёрстку я сумел выправить промптами, то иконки мы просто вытащили из «Фигмы», назвали говорящими именами и нейронка сама догадалась куда их применить.

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

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

Потом я просто сказал нейросети где лежит кусок технического задания по которому ему надо написать код, после чего всё заработало более-менее как нужно, но немного не так. Ещё примерно в течение двух часов я иногда возвращался к прототипу и иногда что-то правил, сидя на совещаниях, так что можно, грубо оценить, что на прототип ушли четыре или пять часов.

На этом прототипе днём позже мы смогли оценить кое-какие наши решения и даже найти серьёзную техническую проблему, для которой смогли тут же придумать решение. Я считаю, что это отличный результат, надо продолжать работать с в таком ключе дальше.

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

Во-первых, писал я натуральным «вайб-кодингом», вообще не заглядывая в код, если вы программист и видели какой код пишут нейросети без присмотра, когда решают комплексные задачи, понимаете, что иногда это потом проще выкинуть, чем использовать.

Во-вторых, это чисто интерфейсный прототип без учёты взаимодействия с сервером. Тут никак не учтены очень важные детали, которые необходимо положить в фундамент архитектуры, чтобы потом всё не переделывать.

В-третьих, этот код никак не учитывает архитектуру остального проекта, написан он с «чистого листа», совершенно изолированно, соответственно, при попытке его интегрировать его придётся серьёзно переделывать.

В-четвёртых, мы опасаемся утечек нашего кода в чужие облака. Что там делать с ним будут — неизвестно.