Топ

Создаем ассистента для генерации промптов с помощью Bolt и Claude

Мне нравится возиться с новыми продуктовыми идеями. Бросить в инструмент вроде Bolt или Lovable сырую мысль и через час получить кликабельный прототип — это кайф. Но между идеей и качественным результатом всегда лежит одна боль: проблема «холодного старта».
Контекст прост: вы открываете мощный ИИ-инструмент, видите чистый лист и... ступор. Как сформулировать идею так, чтобы ИИ понял вас с полуслова и выдал именно то, что нужно? Обычно первые промпты получаются смутными, и приходится долго итератировать, уточняя детали.
И вот возникла гипотеза: «А что если создать ассистента, который поможет создавать промпты для других ИИ?» Не тупой шаблон, а умного собеседника, который задаст правильные вопросы и раскроет вашу идею.
Цель эксперимента: создать инструмент, превращающий смутную идею в детальное, структурированное ТЗ для нейросетей.

Подготовка: От хаоса к структуре (PRD)

Казалось бы, зачем план для «вайб-кодинга»? Можно просто открыть Bolt и начать писать. Но я знал: без четкого понимания цели есть риск запутаться и потратить время впустую. Поэтому даже для этого экспериментального проекта я начал с фундамента.
Я использовал Claude, чтобы быстро сгенерировать Product Requirements Document (PRD). В нем были описаны ключевые требования, пользовательские сценарии и этапы разработки. Это заняло 10 минут, но сэкономило часы позже.
Ключевая мысль: ИИ отлично помогает структурировать мысли еще до написания первой строчки кода. Это как набросок схемы перед строительством дома, даже если вы строите его из кубиков Лего.

Первый проход: Фокус на интерфейсе (Frontend)

Вооружившись PRD, я перешел к Bolt. Первый промпт был намеренно простым: «Реализуй этот PRD, сфокусируйся только на UI/UX фронтенда, без логики сервера и БД».
Результат не разочаровал. Bolt мгновенно сгенерировал чистый, интуитивный чат-интерфейс.
Функционал был прямолинейным: ассистент задавал пользователю цепочку вопросов (о цели проекта, ключевых функциях, целевой аудитории), чтобы «раскрыть» идею. На выходе — текстовый промпт, который можно скопировать.

Итерация: Улучшаем качество ответов

Первая версия работала, но результат был общим. Мой внутренний перфекционист требовал больше глубины. Как доработать логику, чтобы итоговый промпт был действительно мощным?
Я стал добавлять в промпт для Bolt специфические инструкции:
  • «Спроси о референсах дизайна (например, "похоже на интерфейс Notion")»
  • «Уточни реальные примеры сценариев использования»
  • «Предложи подумать о неочевидных случаях (edge-cases)»
  • «Спроси про технические ограничения»
Цель: обогатить итоговый промпт так, чтобы его можно было скопировать в тот же Bolt или Lovable и получить максимально близкий к ожиданиям прототип.

Челлендж: «Где мои данные?» (Backend & Persistence)

Самая технически интересная часть началась, когда я решил превратить красивую картинку в рабочее приложение.
Проблема: При обновлении страницы вся история диалога и сгенерированные промпты безвозвратно пропадали. Это было ограничением frontend-only подхода.
Задача: Нужна база данных для сохранения сессий, истории и самих промптов.
На этом этапе я узнал больше всего. Мне пришлось погрузиться в обсуждение с ИИ:
  • Структура БД: Какие таблицы нужны? sessions, messages, prompts?
  • Обновление стейта: Как синхронизировать интерфейс с данными из БД?
  • Автосохранение: Какие события (отправка сообщения, генерация промпта) должны триггерить запись в базу?
// Примерный код, который мы с ИИ сгенерировали для обработки сохранения
const handleSaveSession = async (sessionId, messages) => {
  try {
    await db.sessions.update(sessionId, {
      updated_at: new Date(),
      data: JSON.stringify(messages)
    });
  } catch (error) {
    console.error("Ошибка автосохранения:", error);
  }
};
И были баги! Моменты, когда данные упорно не хотели сохраняться между сессиями. Иногда ИИ тупил, предлагая нерабочие решения, и приходилось вести настоящий диалог-дебаггинг: «Смотри, здесь функция вызывается, но sessionId равен undefined. Почему?».
После нескольких циклов «запуск-остановка» мы с ИИ находили нужное решение, и данные начинали сохраняться корректно. Магия «вайб-кодинга» в том, что ты учишься, делая.

Финал: Запуск и Демо

После всех итераций и правок, проект был готов.
Как это работает сейчас:
  1. Пользователь вводит сырую идею («Хочу трекер привычек с геймификацией»).
  2. Ассистент ведет уточняющий диалог, задавая 5-7 целенаправленных вопросов.
  3. На выходе — готовый, мощный промпт, структурированный и наполненный деталями, который можно скопировать и вставить в Bolt или Lovable для моментальной генерации сложного прототипа.

Главный инсайт: Ирония Vibe Coding

В этом эксперименте есть забавная ирония. Я создавал ассистента для «vibe coding» — стиля, который поощряет импровизацию и создание на лету, чтобы уменьшить необходимость в тяжелом предварительном планировании.
Но парадокс в том, что для его создания мне самому пришлось применить планирование и структурирование (PRD), а затем глубоко разобраться в архитектуре данных (БД, стейт-менеджмент).
Это приводит к важному выводу о роли человека в эпоху ИИ-кодинга.
Ассистент не заменяет думание. Он помогает его структурировать. Инструменты вроде Bolt — это суперсила, но чтобы она сработала на 100%, им нужен качественный контекст. Дать этот контекст — задача критического продуктового мышления (Critical Product Thinking).
Вывод: Vibe Coding Assistant — не волшебная палочка. Это «костыль для мозга», который превращает хаос в твоей голове в четкую инструкцию для ИИ.
А самое интересное начинается потом, когда ты берешь сгенерированный им промпт и в пару кликов создаешь то, что еще час назад было лишь смутной идеей.