Лёгкий вайбкодинг-фреймворк для построения MVP

Предисловие

Привет, VC! За последний год я выпустил три своих продукта и пять клиентских MVP. И каждый раз история была примерно одинаковая. Идея, куча разрозненных заметок, мысли в голове, а дальше привычный путь: пиши код, строй архитектуру, ковыряйся месяцами.

Лёгкий вайбкодинг-фреймворк для построения MVP

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

Этим подходом я собираю MVP в разы быстрее. Так родились replayka.ru, raspisochka.ru и corecut.ai. В пяти клиентских проектах схема тоже сработала. И сегодня хочу показать как я к этому прихожу. Не инструкция для всех, а личный опыт который может кому-то пригодиться или стать основой для спора в комментариях.

Начинаем не с кода, а с головы

Первое, что нужно сделать - описать проект и понять, зачем вам вообще MVP/demo/проект. Самое простое, но именно это большинство пропускает.

Я обычно открываю ChatGPT, создаю там "проект", загружаю все файлы, черновики, куски переписок — и начинаю мучить нейронку вопросами, пока не получится внятный документ. Это описание — база всего остального. Именно на основе этого документа мы будем строить все остальные. Можно сказать, что здесь закладывается стратегический фундамент дальнейших тактических решений.

В этом документе очень хорошо иметь:

  • Цель
  • Основные пользовательские сценарии
  • Архитектура на уровне системы в целом
  • Основные функциональные требования
  • Ограничения

Для тех, кто не знает, смысл "проекта" в chat gpt в том, что у него есть доступ к его контексту и файлам и чат может активно в них искать и запрашивать информацию. Поэтому, самые важные артефакты я всегда загружаю туда, чтобы чатгпт всегда имел боле-менее актуальный ответ на вопрос "а что мы вообще делаем".

Лёгкий вайбкодинг-фреймворк для построения MVP

Когда делал replayka.ru я начал с документа с целью и сценариями. Затем за день собрал Technical Overview. Через Bolt за два вечера сделал рабочий интерфейс на моках и показал его пилотам. Это сразу сняло половину вопросов.

Проект не полетел, но я сэкономил кучу времени и денег и понял это

Дальше — верхнеуровневая техдока

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

По итогу выходит что-то вроде “Technical & Architecture Overview”. Без фанатизма, но структурно. Здесь у меня уже появляются разного рода схемы и диаграммы:

  • Диаграмма компонентов, описывающая систему на уровне компонентов, модулей и их зависимостей
  • Диаграмма последовательностей, которая показывает взаимодействие участников и компонентов системы во времени

И конечно, описательный документ под это все.

Здесь я понимаю техническую картину в общих чертах: "Тээкс, тут у нас значит есть фронтенд, тут мобильное приложение, они ходят в api gateway, который в свою очередь идет в этот и этот сервис, который идет в базу данных и вот в это api, собирает ответ и отдает в api gateway". Что и при помощи каких технологий будем делать мы пока не фиксируем, но общее понимание уже складывается.

Спеки на каждый кусок

Если у системы есть, например, user dashboard, admin panel, backend, worker и API gateway — под каждый из них нужна отдельная спецификация. Тоже делаю с помощью ChatGPT. Получается быстро и аккуратно.

На этом этапе мы как раз уже фиксируем самый жир, конкретику: какие технологии, какие форматы запросов и ответов, какой api. То есть эти документы уже содержат информацию по тому из чего каждый конкретный компонент состоит в деталях.

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

Лёгкий вайбкодинг-фреймворк для построения MVP

Оживляем интерфейс

Я беру описание проекта, tech overview и спецификацию фронтенда и говорю Bolt'у(bolt.new): “Вот тебе проект, вот цели. Сделай мне интерфейс на мок-данных, без реальных интеграций.”

Bolt хорошо стартует: собирает дизайн, показывает навигацию. Через пару итераций он начинает жечь токены и тупить, поэтому дальше я просто забираю результат и дорабатываю его уже в Cursor.

💡 На этом этапе у вас уже есть, что показать - заказчику, партнёрам, инвестору, пользователю из списка ожидания. И это не “идея на слайде”, а реально рабочий интерфейс, пусть и на моках. И куча артефактов, дающих твердо и четко понять и тебе и окружающим что ты вообще делаешь.

Cursor и backend

Создаю папку с проектом, кидаю туда фронт, открываю папку проекта в Cursor. Кормлю ему описание проекта, техобзор, спеки по backend и worker'у. Пишу примерно так: “Братишка, вот у нас фронт на моках. Давай сделаем backend под него. Вот спеки. Давай накидаем план реализации.”

Cursor в план-моде помогает пройтись по архитектуре, уточнить детали, найти слабые места. После пары итераций можно спокойно жать “build” и оно начинает трудится.

И дальше всё крутится только в Cursor + ChatGPT. Они дополняют друг друга идеально. По ходу дела появляются новые артефакты: документация, доп. спеки, идеи. И всё это происходит без ощущения “хаоса”. Еще я многое перекидываю в Notion стараюсь там систематизировать и собрать всю информацию, которую я раскопал в процессе. Помогает с меньшей болью разные инструменты использовать при необходимости.

Лёгкий вайбкодинг-фреймворк для построения MVP

Почему это вообще работает

Когда я говорю про вайбкодинг я не имею в виду что нейросеть делает все за тебя. Самое ценное здесь не код, а умение сформулировать задачу так, чтобы из этого потом получился работающий MVP. Если структура ясная и требования собраны аккуратно, нейросети работают предсказуемо. Если нет, получается то самое AI-каша.

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

Если у вас есть свой подход к быстрым MVP напишите в комментариях. Мне правда интересно как вы это делаете. Если вы ярый противник вайбкодинга и нейросетей - тоже пишите в комментарии!

2
Начать дискуссию