Vibe-coding или как я развлекался после работы

Уже довольно давно я с раздражением отмахиваюсь от всего, что связано с ИИ. Но все чаще и чаще изо всех щелей слышится: "за ИИ будущее!".

Поэтому хорошенько отдохнув после Нового года, я решил провести эксперимент. Я захотел проверить, на что в действительности способен ИИ: сделать рабочий MVP, не открывая IDE.

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

Вот, что у меня получилось в конце эксперимента:

Я подрубил Claude Code CLI и задал ИИ примерно такой промпт: "Хочу создать прототип приложения, которое позволит пользователю выбрать день в истории и «окунуться» в культурный срез эпохи".

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

Он начал задавать уточняющие вопросы в духе: а какой период, какой тип контента, кто потенциальная аудитория, причем некоторые из них мне даже не приходили в голову на момент генерации идеи. И спустя десять минут у меня была уже подробно расписанная концепция будущего приложения.

По итогу этой фазы у меня был план, стек и простейший сценарий использования:

* - модель подобрал тоже ИИ, а также предоставил подробную интсрукцию

** - это была уже моя "хотелка" — я раньше не работал с продуктовой аналитикой, поэтому сделал отдельный упор в промптинге на этом аспекте

Все было готово к созданию чистого MVP, задача которого проверить, интересно ли это вообще кому-то кроме меня. Spoiler alert — никому.

После согласования плана, я нажал enter и включил режим авто-принятия правок. Спустя пять минут работы, ИИ агент выдал мне первый результат, который соответствовал предложенному плану. Секции, генерируемые Гроком, динамическая подгрузка исторических фото и выдача фактов из википедии.

И что самое главное, базовый User Story работал от и до. Да, были небольшие огрехи вроде отсутствия анимации клика на кнопку "Отправиться в путешествие", но это мелочи.

Можно было бы сказать: "ок, эксперимент успешный" и call it a day. Но эпоха, когда ИИ заменит нас всех, еще не наступила. Хотя базовый flow работал без нареканий, но вот дальше целостность картинки уже терялась.

1. Шапка и Подвал сайта.

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

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

2. Explore Another Day.

Эта кнопка выглядит так, словно должна нас сразу отправить в новое путешествие. Но в действительно она возвращает нас на лендинг, по сути дублируя кнопку из хэдера "Back to DayTrip". Создается разрыв между ожиданиями пользователя и действительностью

3. Share This Day.

Проблема аналогичная с предыдущим пунктом по характеру. В результате взаимодействия урл копируется в буфер обмена с соответствующим сообщением через alert() браузера.

Я расписал подробно ИИ агенту вышеупомянутые проблемы. После очередного сеанса ответов на вопросы был предложен план по реализации фиксов и внедрению сайдбара с навигацией. Справедливости ради, саму идею сайдбара и sticky header'а я сам предложил (пишу, чтобы уж совсем не восхвалять способности ИИ).

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

Само по себе это не проблема, но на ультра-широких мониторах (вроде моего) появляется огромный white space между навигацией и самим контентом. Понадобилось несколько дополнительных промптов, чтобы поправить эту ситуацию и придти к конечному варианту.

После этого я решил попробовать реализовать несколько разно-форматных фич:

Чем более сложная или нестандартная фича, тем нужно более точно описывать ИИ желаемый результат, тем больше ошибок допускается. Но что примечательно, они все были решены через последующий промптинг — мне так и не пришлось открыть IDE, чтобы что-то дебажить или фиксить руками.

Я задал себе дедлайн, но не уложился в него.

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

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

✅ Быстро собирает MVP: 80% результата за 20% усилий

✅ Отлично работает с типовыми задачами

✅ Умеет объяснять инфраструктуру

✅ Экономит кучу времени на рутине

❌ Начинает плыть на менее типовых задачах

❌ Требует максимально конкретного описания задачи (микро-менеджмент)

❌ Не чувствует продукт и не понимает, что такое удобный UI для человека

Это ускоритель для тех, кто понимает, что именно он строит и как оно должно работать.

Помните, ранее я писал:

Так вот, сейчас главная проблема специалиста, достигшего инженерной зрелости — это не создать продукт (мы этим занимаемся каждый день на работе). Даже придумать идею не проблема.

Я придумал и реализовал MVP за полторы недели. И тут я понял, что проблема в том, чтобы о твоей идее / продукте / гениальном плане узнали другие люди. В том, чтобы понять, что понравится пользователям, а что останется идеей однодневкой.

ИИ позволяет сосредоточиться на решении этой проблемы.

Спасибо, что дочитали.

Если кому интересно посмотреть на результат, то вот:

Буду рад обсуждению и конструктивной (или не очень) критике 👇

#vibecoding #mvp #poc #theorycraft