Ты уже знаешь формулу, умеешь давать контекст и уточнять. Но иногда проще не думать с нуля, а взять готовую заготовку и подставить свои данные.
Ниже — большой набор шаблонов, разбитый по сценариям.
Найди свой блок, выбери подходящий шаблон, подставь данные — и отправляй ИИ. Каждый шаблон рабочий и проверенный.
Шаблоны для жизни и личных проектов
1. Персональный планер
Ты — опытный веб-разработчик. Сделай [ежедневный / еженедельный / помесячный] планер для личного использования. Мне важно: [что именно — трекинг задач, расписание, заметки]. Стиль — [минималистичный / уютный / строгий]. Планер должен [описать ключевую функцию: отмечать выполненное, группировать по категориям, показывать прогресс]. Код — одним HTML-файлом.
Пример: Ты — опытный веб-разработчик. Сделай еженедельный планер для личного использования. Мне важно: видеть все дни недели на одном экране, добавлять задачи в каждый день, отмечать выполненные. Стиль — минималистичный, светлый, без лишних элементов. Код — одним HTML-файлом.
2. Трекер привычек
Сделай трекер привычек на [неделю / месяц]. Привычки, которые я хочу отслеживать: [перечисли]. Для каждой привычки — возможность отметить выполнение за день. Покажи [прогресс в процентах / серию дней подряд / оба варианта]. Дизайн — [какой]. Код — одним HTML-файлом.
Пример: Сделай трекер привычек на месяц. Привычки: зарядка, чтение 30 минут, 2 литра воды, ложиться до 23:00. Для каждой — чекбокс на каждый день. Внизу — процент выполнения за неделю. Дизайн — приятный, с мягкими цветами. Код — одним HTML-файлом.
3. Страница-портфолио для хобби
Сделай одностраничный сайт-портфолио для моего хобби — [какое хобби]. Я хочу показать: [свои работы / фотографии / рецепты / коллекцию]. На странице: [перечисли блоки]. Стиль — [какой]. Код — одним HTML-файлом.
4. Калькулятор личного бюджета
Сделай простой калькулятор бюджета на месяц. Пользователь вводит доход и расходы по категориям: [перечисли категории]. Калькулятор показывает: сколько потрачено, сколько осталось, процент расходов по каждой категории. Дизайн — чистый и понятный. Код — одним HTML-файлом.
5. Персональный дашборд
Сделай персональный дашборд — одну страницу, на которой видны мои ключевые метрики: [перечисли, что хочешь видеть — задачи на сегодня, цели на месяц, трекер привычек, цитата дня]. Дизайн — [какой]. Код — одним HTML-файлом.
6. Чек-лист для повторяющегося процесса
Сделай интерактивный чек-лист для [процесс: сборы в поездку, уборка квартиры, подготовка к мероприятию]. Пункты: [перечисли или скажи «предложи сам»]. Каждый пункт — с чекбоксом. Внизу — прогресс-бар. Код — одним HTML-файлом.
7. Страница-подарок или поздравление
Сделай красивую одностраничную страницу-поздравление с [праздник] для [кого]. На странице: [заголовок, текст поздравления, фотографии, музыка / анимация]. Стиль — [какой: тёплый, праздничный, минималистичный]. Код — одним HTML-файлом.
8. Рецептник / кулинарная страница
Сделай страницу с моими любимыми рецептами. Формат: [карточки / список / по категориям]. Категории: [перечисли]. Для каждого рецепта: название, фото-заглушка, список ингредиентов, пошаговая инструкция. Стиль — [какой]. Код — одним HTML-файлом.
Шаблоны для работы и фриланса
9. Лендинг для услуги
Ты — опытный веб-разработчик. Сделай одностраничный лендинг для [твоя услуга]. Аудитория — [кто твои клиенты]. Стиль — [какой]. На странице: [перечисли блоки: заголовок, описание, преимущества, отзывы, кнопка]. Выдай готовый HTML-код одним файлом.
Пример: Ты — опытный веб-разработчик. Сделай одностраничный лендинг для онлайн-курса по рисованию. Аудитория — взрослые новички 25–45 лет. Стиль — лёгкий, вдохновляющий, светлый. На странице: заголовок с ценностным предложением, 3 преимущества курса, блок «для кого», отзывы (3 штуки), кнопка записи. Выдай готовый HTML-код одним файлом.
10. Тексты для сайта
Ты — копирайтер, который специализируется на [ниша]. Напиши тексты для [тип сайта] в сфере [ниша]. Тон — [какой: дружелюбный, экспертный, разговорный]. Целевая аудитория — [кто]. Блоки: [перечисли]. Тексты должны быть [короткими / ёмкими / продающими — выбери].
11. Форма-бриф для клиентов
Сделай форму-бриф, которую я буду отправлять клиентам перед началом работы. Я — [твоя профессия]. Мне нужно узнать у клиента: [перечисли вопросы или скажи «предложи типовые вопросы для моей сферы»]. Форма должна быть удобной, с подсказками к каждому полю. Код — одним HTML-файлом.
Пример: Сделай форму-бриф для клиентов. Я — дизайнер интерьеров. Мне нужно узнать: тип помещения, площадь, бюджет, стиль (с вариантами выбора), сроки, контактные данные. К каждому полю добавь подсказку, чтобы клиент понимал, что писать. Дизайн — аккуратный, профессиональный. Код — одним HTML-файлом.
12. Генератор коммерческого предложения
Сделай генератор коммерческого предложения для [твоя сфера]. Пользователь вводит: [имя клиента, тип услуги, объём работ, цена]. На выходе — готовый текст КП, который можно скопировать или сохранить. Тон — [деловой / дружелюбный-деловой]. Код — одним HTML-файлом.
13. Портфолио фрилансера
Сделай страницу-портфолио для [твоя профессия]. На странице: [блоки — например: обо мне, мои работы (галерея), услуги и цены, отзывы клиентов, контакты]. Стиль — [какой]. Аудитория — [кто будет смотреть: потенциальные клиенты, работодатели]. Код — одним HTML-файлом.
14. Портфолио фрилансера
Сделай калькулятор стоимости услуг для [профессия / сфера]. Пользователь выбирает: [параметры — тип услуги, объём, дополнительные опции]. Калькулятор показывает итоговую стоимость. Дизайн — [какой]. Код — одним HTML-файлом.
Пример: Сделай калькулятор стоимости услуг для фотографа. Пользователь выбирает тип съёмки (портрет, свадьба, предметная), количество часов и нужна ли ретушь. Калькулятор показывает итоговую цену. Дизайн — простой и понятный. Код — одним HTML-файлом.
15. Страница «Мои услуги» с ценами
Ты — веб-дизайнер. Сделай страницу с описанием услуг и тарифами для [профессия]. Услуги: [перечисли]. Для каждой: короткое описание, что входит, цена. Добавь кнопку [записаться / написать / оставить заявку]. Стиль — [какой]. Код — одним HTML-файлом.
16. Шаблон ежемесячного отчёта
Сделай шаблон ежемесячного отчёта для [клиента / руководителя]. Я — [твоя роль]. В отчёте: [перечисли разделы — выполненные задачи, ключевые метрики, планы на следующий месяц, проблемы]. Формат — аккуратная страница, которую можно распечатать или отправить PDF. Код — одним HTML-файлом.
Шаблоны для бизнеса и заработка
17. Страница для сбора заявок
Сделай одностраничный сайт для сбора заявок на [продукт / услуга / мероприятие]. Аудитория — [кто]. На странице: [заголовок с оффером, 3–4 преимущества, форма с полями (имя, телефон, email), кнопка отправки]. Стиль — [какой]. Код — одним HTML-файлом.
Пример: Сделай одностраничный сайт для сбора заявок на бесплатный вебинар «Как начать инвестировать». Аудитория — люди 25–40 лет, которые хотят разобраться в теме. На странице: заголовок с датой и временем, 3 пункта «что узнаешь», фото спикера с коротким био, форма записи (имя, email), кнопка «Записаться». Стиль — строгий, но дружелюбный, тёмный фон с акцентным цветом. Код — одним HTML-файлом.
18. Простая CRM-панель
Сделай простую CRM-панель для [тип бизнеса]. Функции: [список клиентов с фильтрами, статусы заявок, поиск, добавление нового клиента]. Данные хранить в браузере (localStorage). Дизайн — чистый, деловой. Код — одним HTML-файлом.
19. Дашборд с метриками бизнеса
Сделай дашборд для [тип бизнеса], на котором видны ключевые метрики: [перечисли — выручка за месяц, количество клиентов, средний чек, конверсия]. Данные вводятся вручную. Дашборд показывает цифры в карточках и [графики / диаграммы]. Стиль — [деловой / современный]. Код — одним HTML-файлом.
20. Прототип нового продукта
Сделай кликабельный прототип [продукт / сервис / приложение]. Это нужно, чтобы показать идею [инвестору / партнёру / клиентам] и собрать обратную связь. На прототипе: [перечисли экраны или ключевые функции]. Не нужна реальная логика — нужен внешний вид и ощущение от продукта. Стиль — [какой]. Код — одним HTML-файлом.
21. Страница для мероприятия
Сделай страницу для [тип мероприятия: мастер-класс, вебинар, конференция, встреча]. Дата — [когда]. На странице: [описание, программа, спикеры, кнопка регистрации]. Аудитория — [кто]. Стиль — [какой]. Код — одним HTML-файлом.
22. Генератор счетов / инвойсов
Сделай генератор счетов для [тип бизнеса]. Пользователь вводит: [данные клиента, список товаров/услуг, количество, цена]. На выходе — аккуратный счёт, который можно распечатать. Добавь автоматический подсчёт суммы и НДС. Код — одним HTML-файлом.
23. Страница отзывов и кейсов
Сделай страницу с отзывами и кейсами для [тип бизнеса]. Формат: карточки, в каждой — имя клиента, фото-заглушка, текст отзыва, результат работы. Добавь [фильтр по категориям / карусель]. Стиль — [какой]. Код — одним HTML-файлом.
24. Квиз для квалификации клиентов
Сделай квиз (пошаговый опрос) для [тип бизнеса]. Цель — помочь посетителю [выбрать услугу / понять, что ему подходит / оставить заявку]. Вопросы (3–5 шагов): [перечисли или скажи «предложи подходящие»]. В конце — результат и кнопка [оставить заявку / написать / записаться]. Код — одним HTML-файлом.
Пример: Сделай квиз для студии лазерной эпиляции. Цель — помочь клиенту выбрать подходящую процедуру. Шаг 1: пол (мужчина/женщина). Шаг 2: зона обработки (лицо, ноги, всё тело — с картинками). Шаг 3: был ли опыт раньше (да/нет). Шаг 4: удобное время (утро, день, вечер). В конце: рекомендация + кнопка «Записаться» со ссылкой на WhatsApp. Стиль — современный, с мягкими цветами. Код — одним HTML-файлом.
Универсальные шаблоны (подходят всем)
25. Переделать / улучшить существующее
Вот мой [текст / код / структура]: [вставить]. Улучши: [что именно: сократи, сделай ярче, упрости, исправь ошибки, измени стиль на…]. Остальное оставь как есть.
26. Разобраться в чужом результате
ИИ выдал мне вот такой код: [вставить]. Объясни простыми словами: что делает каждая часть? Где я могу поменять [цвет / текст / размер / структуру], не сломав остальное?
27. Исправить то, что сломалось
Вот мой код: [вставить]. Проблема: [опиши, что не работает — не отображается, съехало, не нажимается]. Найди ошибку и исправь. Объясни, что было не так.
28. Адаптировать под мобильный
Вот мой HTML-код: [вставить]. Сейчас он нормально выглядит на компьютере, но на телефоне всё съезжает. Сделай адаптивную вёрстку, чтобы страница хорошо выглядела на любом экране. Остальное не меняй.
Как использовать эти шаблоны
Не нужно копировать слово в слово. Бери структуру и подставляй свои данные. Места в квадратных скобках [...] — это то, что ты заменяешь на свою информацию.
Алгоритм простой:
Найди шаблон, который ближе всего к твоей задаче.
Замени [...] на свои данные.
Отправь ИИ.
Уточни по необходимости (ты уже знаешь как).
Со временем ты начнёшь писать запросы без шаблонов — но для старта они сильно экономят время и нервы.
Сохрани эту страницу в закладки. Ты будешь возвращаться к ней чаще, чем думаешь.
Переходим к следующему уроку
У тебя есть формула, контекст, приёмы уточнения и готовые шаблоны. Осталось одно — попробовать. В следующем уроке мы вместе опишем твой первый проект. Не абстрактный, не учебный — твой. Тот, который ты будешь собирать в следующем модуле.