🖥 Один промт → готовый план проекта для вайбкодинга

Роль: опытный продуктовый менеджер и веб-разработчик. Задача: составить полное техническое задание для простого веб-проекта на основе данных ниже. Результат должен быть готов для передачи в AI-кодер (Cursor, Replit, Bolt, Lovable). --- ЗАПОЛНИТЬ --- 1. ИДЕЯ В ОДНОМ ПРЕДЛОЖЕНИИ: [Например: сайт-визитка для барбершопа / трекер привычек / лендинг для продажи курса / портфолио фотографа] 2. ДЛЯ КОГО ЭТОТ ПРОЕКТ: [Например: клиенты барбершопа, подписчики в соцсетях, покупатели на маркетплейсе] 3. ГЛАВНОЕ ДЕЙСТВИЕ ПОСЕТИТЕЛЯ: [Что человек должен сделать на сайте? Например: оставить заявку / купить товар / записаться / посмотреть портфолио] 4. СКОЛЬКО СТРАНИЦ (примерно): [1 — лендинг, 3-5 — небольшой сайт, 5+ — полноценный проект] 5. ОБЯЗАТЕЛЬНЫЕ БЛОКИ (отметить нужное): - [ ] Шапка с логотипом и меню - [ ] Главный экран с заголовком и кнопкой - [ ] Блок "О нас" / "Обо мне" - [ ] Каталог товаров или услуг - [ ] Галерея / портфолио - [ ] Отзывы - [ ] Форма обратной связи - [ ] Контакты и карта - [ ] Подвал сайта - [ ] Другое: [вписать] 6. СТИЛЬ И НАСТРОЕНИЕ: [Например: минимализм, тёмная тема, яркий и молодёжный, строгий деловой, уютный и тёплый] 7. ЦВЕТА (если есть предпочтения): [Например: чёрный + золотой, пастельные тона, синий + белый, или "на усмотрение"] 8. РЕФЕРЕНСЫ (если есть): [Ссылки на сайты, которые нравятся, или описание словами] 9. НУЖНА ЛИ МОБИЛЬНАЯ ВЕРСИЯ: да / нет 10. ДОПОЛНИТЕЛЬНЫЕ ФУНКЦИИ: - [ ] Анимации при прокрутке - [ ] Кнопка WhatsApp / Telegram - [ ] Интеграция с платёжной системой - [ ] Личный кабинет - [ ] Мультиязычность - [ ] Другое: [вписать] --- КОНЕЦ ЗАПОЛНЕНИЯ --- На основе этих данных: ЧАСТЬ 1 — ТЕХЗАДАНИЕ - Описать структуру проекта: список страниц, порядок блоков на каждой - Прописать текст для каждого блока (заголовки, подзаголовки, кнопки, заглушки для контента) - Указать рекомендуемый стек: HTML/CSS/JS, React, или конструктор — с объяснением выбора - Описать визуальный стиль: шрифты, цветовую палитру (HEX-коды), скругления, отступы, размеры - Перечислить все интерактивные элементы: формы, кнопки, попапы, анимации ЧАСТЬ 2 — ПРОМТ ДЛЯ AI-КОДЕРА - Сгенерировать готовый промт, который можно вставить в Cursor / Replit / Bolt для создания этого проекта целиком - Промт должен содержать всю информацию из техзадания в структурированном виде ЧАСТЬ 3 — ПУБЛИКАЦИЯ - Пошагово описать размещение на бесплатном хостинге (Vercel, Netlify или GitHub Pages) - Объяснить подключение домена (если нужно) - Указать как проверить работоспособность на телефоне и компьютере Формат ответа: структурированный документ с заголовками и нумерованными списками. Без воды и общих фраз — только конкретика.