Промпт-гайд 📚 Гайды

7 промптов для быстрого MVP в Bolt, Lovable и Replit Agent

Готовые шаблоны для лендинга, простого SaaS, дашборда, формы сбора заявок, маркетплейса и AI-ассистента. Под Bolt.new, Lovable, Replit Agent, WebSim и Cursor Composer.

🎯 7 промптов

No-code-генераторы изменили запуск MVP. Раньше — две недели работы фронтендера. Сейчас — 30 минут на промпт + 2 часа на правки в редакторе. Качество не идеальное, но для проверки гипотезы / собрать первые 100 пользователей / показать инвестору — достаточно.

Внутри — 7 шаблонов под типичные задачи: лендинг, простое SaaS-приложение с авторизацией, интерактивный дашборд, форма с интеграцией, одностраничник «о специалисте», маркетплейс / каталог, MVP с AI-функцией.

По выбору сервиса. Bolt.new и Lovable — лучшие для full-stack веб-приложений с React+Tailwind+Supabase. Replit Agent — встроен в Replit, работает прямо в браузерной IDE, удобно для серверной части и интеграций. WebSim — для быстрых single-page прототипов с фокусом на визуал. Cursor Composer — если уже работаете в Cursor IDE и хотите генерировать целые модули.

Главное про no-code-генераторы: они генерируют стандартные интерфейсы. Чтобы получить хороший результат, давайте максимально подробный промпт со стилем, цветами, контентом, поведением. Промпт в стиле «сделай красивый лендинг для моего стартапа» даст generic-результат, который вы потом будете переделывать дольше, чем если бы написали сразу точно.

1

🚀 Лендинг для стартапа

Сгенерируй современный лендинг для [НАЗВАНИЕ_ПРОДУКТА], [КАТЕГОРИЯ — fintech / SaaS / мобильное приложение / etc].

Структура:
1) Hero — заголовок «[ВАШ_ЗАГОЛОВОК ≤ 8 слов]», подзаголовок одной фразой, две CTA-кнопки (основная и вторичная), фон — градиент [ЦВЕТ_1 → ЦВЕТ_2].
2) Боль клиента — три карточки: иконка, заголовок, описание. Тон — узнаваемый сценарий, не общий.
3) Решение — две колонки: текст слева, screenshot/illustration справа.
4) Как работает — три шага горизонтально, пронумерованные.
5) Социальные доказательства — три-четыре лого клиентов и одна цитата с фото.
6) Тарифы — три плана в карточках, средний выделен как рекомендуемый.
7) FAQ — пять вопросов в аккордеоне.
8) Финальный CTA с фоном и большой кнопкой.
9) Footer — лого, контакты, ссылки на соцсети.

Стиль:
Палитра — [ОПИСАТЬ — например: «синий #1E40AF как основной, белый фон, оранжевый #F97316 для CTA»].
Шрифт — [Inter / SF Pro / Manrope].
Скругления — 12-16px.
Отступы между секциями — щедрые (96px+ на десктопе).

Адаптивность — обязательно: десктоп / tablet / mobile.
Анимации — минимальные (fade-in при прокрутке, hover на кнопках).

Запрет: stock-фото с белыми людьми в офисе, 3D-иллюстрации абстрактных облаков, иконки в стиле Material с Lucide pack (предпочитаю плоские outline).
💡 Примечание

Указание конкретных цветов в hex и конкретных шрифтов даёт лучший результат, чем «современный стиль». Запрет на stock-иллюстрации помогает избежать generic-лука. Предпочтение outline-иконок над filled — стилевая консистентность, которую модель часто ломает по умолчанию.

2

🔐 Простое SaaS с авторизацией

Сгенерируй MVP-приложение [ОПИСАНИЕ_ПРОДУКТА — например: «трекер привычек», «to-do список с приоритетами», «мини-CRM для фрилансера»].

Функционал:
1) Авторизация — email/password + OAuth Google.
2) Главный экран — [ОПИСАНИЕ_ГЛАВНОГО_ЭКРАНА_В_2_ФРАЗАХ].
3) [ФУНКЦИЯ_2 — конкретно].
4) [ФУНКЦИЯ_3].
5) Профиль пользователя — имя, аватар, настройки.
6) Sign-out.

Стек: React + Tailwind + Supabase (или встроенная Bolt-БД).

Структура страниц:
/login — форма входа.
/signup — форма регистрации.
/app — главный экран (защищённый).
/profile — настройки.

Компоненты, которые точно нужны:
Layout с боковым меню и хедером.
Карточка-список основной сущности.
Модалка для создания/редактирования.
Подтверждение удаления.
Loading и empty states для всех списков.

Стиль — минималистичный SaaS, как Linear / Notion. Палитра: серая основа, синий акцент (#3B82F6), зелёный для success (#10B981), красный для destructive (#EF4444).

Не реализовывай:
Платежи (отдельный шаг).
Сложные роли и права (только owner).
Админ-панель.
Мультитенантность.
Аналитику.
💡 Примечание

Раздел «не реализовывай» — критичен для MVP. Без него Bolt/v0 пытаются сделать «полноценный продукт» с админкой, ролями, платежами — и выдают прототип, который ничего не делает хорошо. Лучше сосредоточиться на 3-4 главных функциях и сделать их рабочими, чем на 15 наполовину сломанных.

3

📊 Интерактивный дашборд

Сгенерируй дашборд для [ТИП_БИЗНЕСА — например: «маркетинг-агентство», «e-commerce»] с метриками.

Структура:
1) Сайдбар — навигация: «Главная», «Аналитика», «Клиенты», «Настройки».
2) Хедер — поиск + аватар пользователя.
3) Главный экран дашборда:
   - 4 KPI-карточки сверху (с цифрой, динамикой против прошлого периода, мини-графиком).
   - Большой график (line или bar) — [ОПИСАНИЕ_ГРАФИКА].
   - Таблица последних [N] записей с сортировкой.
   - Виджет [например: «топ-5 клиентов по выручке»].

Используй mock-данные (показать реалистичные числа за 30 дней).
Графики — Recharts или Chart.js.
Таблица — с пагинацией и сортировкой по колонкам.
Фильтр периода — последние 7/30/90 дней / custom.

Стиль — как Linear / Vercel Analytics. Тёмная тема по умолчанию + переключатель на светлую.
Палитра — серый фон #0A0A0A, акцентные графики в #3B82F6 и #10B981.

Адаптивность — на mobile дашборд превращается в вертикальный стек, без сайдбара (заменить на bottom nav).

Не нужно:
Реальной интеграции с БД (mock).
Авторизации (отдельным MVP).
Экспорта в Excel.
Сложных фильтров с сегментами.
💡 Примечание

Дашборд хорошо работает в Bolt/v0 именно как mock-prototype для демо. Если генерировать сразу с реальной БД — получите 50% багов в запросах. Лучше сначала прототип на красивых данных, потом подключение реальных источников ручной работой. Тёмная тема по умолчанию — потому что на демо она выглядит «дороже».

4

📝 Форма с интеграцией

Сгенерируй одностраничную форму с интеграцией.

Цель формы: [например: «сбор заявок на консультацию» / «опрос о продукте» / «регистрация на мероприятие»].

Поля:
1) Имя — обязательное.
2) Email — обязательное, валидация.
3) Телефон — опциональное, формат +7 (XXX) XXX-XX-XX.
4) [ПОЛЕ_4 — например: «Сообщение / что хотите узнать»] — textarea.
5) [ПОЛЕ_5 — например: «Выберите удобное время»] — select.
6) Согласие на обработку данных — обязательный чекбокс.

Поведение:
Live-валидация при потере фокуса (не при каждом нажатии).
Кнопка submit неактивна, пока форма не валидна.
После submit — состояние loading на кнопке.
При успехе — экран благодарности с follow-up («Мы свяжемся в течение N часов»).
При ошибке — inline-сообщение + сохранение введённого.

Интеграция:
Отправка данных в [Webhook URL — Make / n8n / Zapier].
Уведомление в [Telegram / Email].
Запись в [Google Sheets / Airtable].

Стиль — минималистичный, фокус на форме. Один акцентный цвет для CTA, остальное — нейтральные.

Адаптивность — поля должны быть крупными и удобными на mobile.

Запрет: всплывающие подсказки на тач-устройствах (нет hover), капча на каждом шаге (только перед submit), скрытые обязательные поля.
💡 Примечание

Live-валидация при потере фокуса (не при каждом нажатии) — небольшой технический нюанс с большим эффектом. Валидация в realtime раздражает: пользователь набирает «john@» и видит красное «неверный email». Валидация после полного ввода — уважительнее. Запрет на капчу везде — потому что одна капча перед submit достаточно, на каждом шаге убивает конверсию.

5

👤 Одностраничник «обо мне» / визитка

Сгенерируй одностраничник-визитку для специалиста.

Контекст:
Кто: [имя + профессия].
Что предлагаю: [услуги в 1 фразе].
Кому: [целевые клиенты].
Главное достижение: [одно конкретное достижение].

Структура:
1) Hero — крупное фото, имя, профессия, одна цепляющая фраза, CTA «Связаться» и «Скачать портфолио».
2) Обо мне — короткий текст (3-4 абзаца) живым языком, без корпоративной патоки.
3) Услуги — три-четыре карточки с описанием конкретных услуг и стоимостью (диапазоном).
4) Кейсы — карусель из трёх-пяти проектов: фото, название, описание результата.
5) Отзывы — слайдер с цитатами и фото клиентов.
6) Связаться — форма + контакты + ссылки на соцсети.

Стиль — личный, тёплый, не корпоративный. Используй фотографии (плейсхолдеры).
Палитра — [ВАШИ_ЦВЕТА — выберите 1 акцентный + нейтральные].
Шрифт для заголовков можно более выразительный (serif или typeface с характером).

Не нужно:
Бесконечного скролла «о моих достижениях».
Логотипов 50 клиентов в карусели.
Длинного текста о философии.
Всплывающих окон «получите консультацию».

Запрет: эмодзи в имени и профессии в hero, мерцающие кнопки, фото-карусели с автопереключением (раздражает).
💡 Примечание

Запрет на «бесконечный скролл достижений» — против типичной болезни визиток специалистов. Клиент пришёл узнать, можете ли вы решить его задачу — а не читать вашу автобиографию. 3-4 абзаца живого текста, конкретные кейсы и форма для контакта работают в 5 раз лучше длинного «обо мне» на 10 экранов.

6

🛒 Маркетплейс / каталог

Сгенерируй MVP маркетплейса / каталога для [НИША — например: «домашние тортики», «частные уроки», «б/у мебель»].

Функционал:
1) Главная — поиск + фильтры + грид карточек товаров/услуг.
2) Карточка товара (детальная страница) — фото, название, описание, цена, продавец, контакты.
3) Корзина / список избранного (на выбор).
4) Профиль продавца с его товарами.
5) Регистрация продавца + добавление товара.

Фильтры (на главной):
Категория (выпадающий список).
Цена (range slider).
Локация (если важна для ниши).
Сортировка (новые / популярные / по цене).

Карточка товара (превью):
Главное фото.
Название.
Цена жирно.
Локация / краткое описание.
Иконка избранного (сердечко).

Стиль — близкий к Avito / OZON / Etsy (в зависимости от сегмента).
Адаптив — на mobile грид превращается в вертикальный список карточек.

Не нужно в MVP:
Платежей (контакт между сторонами напрямую).
Чата внутри сервиса (просто телефон / телеграм продавца).
Системы отзывов (отдельный MVP).
Модерации (ручной admin проверкой).
Геолокации с картой (текстовое поле «город»).
💡 Примечание

Маркетплейсы часто умирают на сложности «правильной» архитектуры. Платежи через эскроу, чат с уведомлениями, система отзывов с верификацией — всё это нужно потом, не сейчас. MVP-маркетплейс — это просто каталог + контакты продавца. Если реальный спрос есть, усложнения добавите. Если нет — сэкономили месяцы разработки.

7

🤖 MVP с AI-функцией

Сгенерируй MVP-приложение с одной AI-функцией.

Идея: [конкретно — например: «генератор постов в Instagram по теме», «анализатор резюме на соответствие вакансии», «рерайтер текста под другой тон»].

Функционал:
1) Главная страница — описание продукта + большое поле ввода + кнопка «Сгенерировать».
2) Результат — выводится под формой, с кнопкой «Скопировать», «Поделиться», «Попробовать другой вариант».
3) Ограничение — N бесплатных генераций без регистрации, потом — sign-up.
4) История генераций (для залогиненных).

Интеграция с AI:
Использовать [OpenAI API / Claude API / Gemini API].
Системный промпт прописать в коде (не давать пользователю его менять).
Loader при ожидании ответа.
Обработка ошибок API (rate limit, timeout, отказ).
Логирование запросов для аналитики (без PII).

Стиль — современный, минималистичный, фокус на результате. Большое поле ввода по центру. Палитра — [одна акцентная + нейтральные].

Не нужно в MVP:
Платных тарифов (пока бесплатно + лимит на регистрацию).
Сложного промпт-инжиниринга в интерфейсе (settings).
Истории других пользователей (только своей).
Шеринга в соцсети с OG-картинкой (отдельный шаг).

Запрет: давать пользователю редактировать системный промпт (пожгут токены), сохранять API-ключ AI-провайдера в клиенте (только сервер), запускать без rate limiting (защита от ботов).
💡 Примечание

Запрет на «давать редактировать системный промпт» — практическая мера: первые же пользователи научат бота генерировать что попало (включая запрещённый контент), и это станет вашей юридической проблемой. Системный промпт — фиксированный, пользователь только подставляет содержание. API-ключ только на сервере — иначе утечка через браузер за час, и счёт от OpenAI на тысячи долларов.