Логика: каждый следующий запрос = ответ предыдущего + дополнительный текст от вас.
Вставляйте в новый чат результат предыдущего запроса и свой дополнительный текст.
ЭТАП 0
Упаковка портфолио
🧠 ChatGPT (GPT-4) или Claude📁 делаем ДО сайта
Зачем: чтобы в запросе на сайт уже были готовые описания работ.
Запрос (для каждой работы отдельно)
Ты — опытный копирайтер и UX-специалист. Я даю тебе ссылку на сайт,
который я сделала как веб-разработчик. Напиши для моего портфолио
привлекательное описание этой работы.
Контекст: я — Наталья, студия Altyn Click. Делаю лендинги для малого
бизнеса на трёх языках (русский, казахский, английский). Работаю
по СНГ, базируюсь в Алматы. Мой подход — эмоциональный дизайн и
психология клиента.
Что мне нужно:
1. Название работы (2–4 слова, цепляющее)
2. Краткое описание: что за проект, для кого, какую задачу решает (1–2 предложения)
3. Что я сделала: список из 4–6 пунктов (дизайн, вёрстка, три языка,
анимации, адаптив, форма записи — что применимо)
4. Одна строка «изюминка» — что делает этот проект особенным
(например: «Тёплая палитра и мягкие формы — под атмосферу детского центра»)
Тон: уверенный, конкретный, без воды. Не хвастаться, а показывать
компетенцию. Не писать «мы», только «я» или безличные формулировки.
Ссылка на сайт: [ВСТАВЬ ССЫЛКУ]
➕ Дополнительный текст (в конец запроса)
Важно: не выдумывай результаты и цифры (конверсии, заявки),
которых у меня нет. Не используй ярлыки «концепт» или «демо».
Просто описывай работу как есть — что я сделала и как.
Описание должно быть таким, чтобы клиент захотел похожий сайт.
💾 Сохрани описания всех 5 работ в отдельный файл. Они пойдут в запрос на сайт.
ЭТАП 1
Аналитика рынка
🌐 ChatGPT с доступом в интернет или Perplexity📊 рынок Алматы / СНГ
Зачем: понять, кто твой клиент, что ему важно, как говорят конкуренты.
Запрос
Ты — маркетолог-аналитик, специализируешься на рынке веб-разработки
в Казахстане и СНГ. Помоги мне провести анализ рынка для моей студии.
Обо мне: Наталья, студия Altyn Click. Делаю лендинги для малого бизнеса
на трёх языках (русский, казахский, английский). Работаю по СНГ,
базируюсь в Алматы. Одна, без команды. Ценю эмоциональный дизайн
и психологию клиента.
Что мне нужно:
1. Портрет целевой аудитории: кто заказывает лендинги у малого
бизнеса в Алматы и СНГ? Сегменты, боли, страхи, желания.
2. Конкуренты: кто в Алматы и СНГ делает то же, что я?
Их цены, УТП, слабые места.
3. Ключевые возражения клиентов: почему малый бизнес боится
заказывать лендинг? (дорого, долго, не окупится, обманут)
4. Что ценят клиенты при выборе исполнителя: портфолио,
скорость, цена, коммуникация, гарантии?
5. Ключевые сообщения для моего позиционирования:
какие 3–5 фраз должны доносить мой сайт, чтобы клиент выбрал меня?
Формат: структурированный отчёт с выводами и рекомендациями.
➕ Дополнительный текст
Учти мои преимущества: я делаю сайты на трёх языках (это редкость
для индивидуальных разработчиков), использую эмоциональный дизайн,
пишу тексты по формуле «клиент — главный герой». У меня есть
5 работ в портфолио, один реальный проект для детского центра.
Не выдумывай конкурентов, если не уверен — укажи, что данные
приблизительные.
📌 Это станет основой для текстов сайта.
ЭТАП 2
Продающие тексты
✍️ ChatGPT (GPT-4) или Claude🧩 структура: 7 смысловых блоков
Зачем: написать тексты для всех блоков лендинга на основе аналитики
и структуры из ТЗ (Дракон → Меч → Оффер → Дедлайн → Доказательства → CTA).
Запрос
Ты — копирайтер, специализируешься на продающих текстах для сайтов услуг.
На основе анализа рынка (ниже) напиши тексты для моего лендинга.
[ВСТАВЬ РЕЗУЛЬТАТ ЭТАПА 1]
Обо мне: Наталья, студия Altyn Click. Лендинги для малого бизнеса
на трёх языках (русский, казахский, английский). Работаю по СНГ,
базируюсь в Алматы. Одна. Эмоциональный дизайн, психология клиента,
тексты по принципу «клиент — главный герой».
ЦЕЛЬ ЛЕНДИНГА И СХЕМА ПРОДАЖ
Главная задача: подчинить всю страницу одному целевому действию —
заявка на консультацию / бесплатный аудит сайта.
Тип продажи: двухступенчатая схема (сначала захват контакта
через бесплатную выгоду — аудит или разбор, потом продажа).
Целевое действие (CTA): «Получить бесплатный аудит сайта».
СТРУКТУРА И СМЫСЛОВЫЕ БЛОКИ ЛЕНДИНГА
Блок 1. Первый экран (Hero)
- Дескриптор под логотипом по формуле «Кто + Что + Кому + География +
Ключевое преимущество».
- Главный заголовок (H1): до 6 слов, точное вхождение поискового
запроса ЦА, бьёт в главную выгоду клиента, а не хвастается студией.
- Подзаголовок: раскрывает заголовок, показывает конкретную пользу.
- Первая кнопка CTA: яркая, с понятным призывом.
Блок 2. Проблема клиента («Дракон»)
- Описание реальной ситуации клиента, с которой он сталкивается.
- Главный герой истории — клиент, а не студия.
- Язык — его задачи и эмоции: «сайт есть, а заявок нет»,
«заплатил за рекламу — слил бюджет», «конкуренты в топе, я нет».
Блок 3. Решение («Волшебный меч»)
- Презентация моего подхода как прямого и лёгкого способа решить
проблему из Блока 2.
- Перевод технических терминов на язык выгод и образов:
«адаптив» → «клиент открыл с телефона — всё читается и кнопка
под пальцем»; «три языка» → «казахстанский клиент читает
на казахском, турист — на английском, и оба заказывают».
Блок 4. Уникальное торговое предложение (Оффер)
- Ответ на вопрос: «Почему я должен заказать именно у тебя и что
получу сверху?»
- Бонус/усилитель: бесплатный аудит текущего сайта, тексты в подарок,
месяц правок после запуска, помощь с доменом и хостингом.
Блок 5. Ограничение по времени (Дедлайн)
- Мотивация принять решение сейчас.
- Формат: открытый дедлайн — «беру 2 проекта в месяц, чтобы
делать вручную и без спешки».
Блок 6. Доказательства и снятие возражений
- Отзывы: реальные, с деталями. Если отзывов пока нет — оставь
заглушку «[отзывы добавим позже]», не выдумывай.
- Маркеры привлекательности: «Хит», «Новинка», «Сделано вручную».
- Гарантии и условия: сроки, оплата (предоплата 50%),
правки, что входит в работу.
Блок 7. Финальный призыв к действию (CTA)
- Строго утвердительная форма и повелительное наклонение:
«Закажите», «Напишите», «Получите».
- Исключить конструкции «Если вы хотите…».
ТРЕБОВАНИЯ К КОПИРАЙТИНГУ
- Короткие абзацы — не более 4–5 строк.
- Подзаголовки, мини-заголовки, стрелки, рамки, маркированные списки.
- «Вы-подход»: обращение на «Вы/Вам», речь о клиенте, не о себе.
- Кнопка «Заказать / Получить аудит» после каждого ключевого блока.
- Не использовать «мы», только «я» или безлично.
- Конкретика вместо общих слов: «сайт за 7 дней» вместо «быстро».
Для каждого блока напиши:
- Заголовок
- Подзаголовок (если нужен)
- Основной текст (коротко, по делу)
- CTA (если есть)
Формат: готовые тексты для вставки на сайт.
➕ Дополнительный текст
Важно для блока «Решение»: переведи мои профессиональные термины
на понятный клиенту язык:
- «Клиент — главный герой» → «Я пишу тексты не о себе, а о вас
и вашем клиенте»
- «Эмоциональный дизайн» → «Я делаю сайты, которые вызывают эмоции.
Люди запоминают эмоции, а не информацию»
- «Иерархия потребностей» → «Сначала сайт должен работать, потом —
быть удобным, и только потом — радовать»
- «Закон Хика» → «Чем меньше выбора на экране, тем быстрее
человек принимает решение»
Важно для блока «Работы»: оставь место для описаний,
я вставлю их отдельно. Не придумывай описания работ сам.
Важно: не выдумывай отзывы и цифры. Если нужны отзывы —
оставь заглушку «[отзывы добавим позже]».
Важно: не используй ярлыки «концепт» или «демо».
✅ Это готовые тексты. Вставляешь их в запрос на дизайн.
ЭТАП 3
Дизайн
🎨 ChatGPT / Claude🧩 дизайн-система под 7 блоков
Зачем: получить структуру, цвета, шрифты, UI-паттерны
под готовые тексты и 7 смысловых блоков лендинга.
Запрос
Ты — UI/UX-дизайнер. На основе текстов (ниже) и анализа рынка (ниже)
разработай дизайн-концепцию для моего лендинга.
[ВСТАВЬ РЕЗУЛЬТАТ ЭТАПА 1]
[ВСТАВЬ РЕЗУЛЬТАТ ЭТАПА 2]
Обо мне: Наталья, студия Altyn Click. Лендинги для малого бизнеса
на трёх языках. Алматы, СНГ. Эмоциональный дизайн.
Лендинг построен по 7 смысловым блокам:
1. Hero
2. Проблема клиента («Дракон»)
3. Решение («Волшебный меч»)
4. Оффер + бонус
5. Дедлайн
6. Доказательства и снятие возражений
7. Финальный CTA
Что мне нужно:
1. Цветовая палитра: основной, акцентный, вспомогательные цвета.
HEX-коды. Обоснование выбора под эмоциональный дизайн.
2. Шрифты: заголовки и текст. Google Fonts. Обоснование.
3. Структура каждого из 7 блоков: что где расположено, какова
иерархия, где стоит CTA.
4. UI-паттерны:
- кнопки CTA (главная и второстепенная),
- карточки работ,
- блок отзывов и маркеров,
- блок гарантий и условий,
- FAQ,
- переключатель языков в шапке.
5. Адаптив: как меняется структура на 480px, 768px, 1200px.
6. Ключевые принципы: как применён эмоциональный дизайн,
закон Хика, когнитивный контраст.
Учти: сайт на трёх языках (русский, казахский, английский) —
нужен переключатель языка в шапке. Сайт должен выглядеть
профессионально, но тепло — не корпоративно-холодно.
Формат: структурированное описание дизайн-системы.
➕ Дополнительный текст
Важно: не предлагай стоковые фото и сложную графику —
я свёрстаю сайт вручную на HTML/CSS/JS. Предлагай решения,
которые реализуемы кодом: типографика, отступы, цвета,
простые анимации, SVG-иконки.
Важно: сайт должен быть быстрым. Не предлагай тяжёлые
библиотеки и фреймворки. Только то, что можно сделать
на чистом HTML/CSS/JS.
Важно: обязательно предусмотри переключатель языков
в шапке сайта.
Важно: кнопка CTA должна повторяться после каждого
ключевого смыслового блока — предусмотри два варианта:
главная (заливка) и второстепенная (контур).
Важно: блок «Дедлайн» оформи так, чтобы он визуально
отличался от остальных — например, акцентная плашка
с иконкой времени.
📐 Это твоё ТЗ на вёрстку.
ЭТАП 4
Создание сайта
⚙️ Claude (лучше всех пишет код) или ChatGPT💻 Cursor / GitHub Copilot
Зачем: получить готовый код или детальное ТЗ на вёрстку.
Запрос (итоговый)
Ты — senior frontend-разработчик. На основе дизайн-системы (ниже),
текстов (ниже) и описаний работ (ниже) создай код сайта.
[ВСТАВЬ РЕЗУЛЬТАТ ЭТАПА 1]
[ВСТАВЬ РЕЗУЛЬТАТ ЭТАПА 2]
[ВСТАВЬ РЕЗУЛЬТАТ ЭТАПА 3]
[ВСТАВЬ ОПИСАНИЯ РАБОТ ИЗ ЭТАПА 0]
Требования:
1. Чистый HTML, CSS, JS — без фреймворков и библиотек
2. Адаптив: mobile-first, брейкпоинты 480px, 768px, 1200px
3. Три языка: русский (по умолчанию), казахский, английский.
Переключатель в шапке. Реализация — отдельные HTML-файлы
или JS-переключение (предложи оптимальный вариант).
4. Форма заявки: отправка в Telegram (я дам токен и chat_id позже,
пока оставь заглушку с комментарием)
5. Анимации: плавные, ненавязчивые, на CSS или чистом JS
6. Скорость: PageSpeed 90+, минимум запросов, оптимизация
7. Безопасность:
- Защита формы от спама (honeypot-поле или простая капча)
- Валидация данных на клиенте
- Экранирование выводимых данных (защита от XSS)
- Без инлайн-скриптов в HTML (CSP-friendly)
- HTTPS-only (уже обеспечен Cloudflare)
8. SEO: meta-теги, Open Graph, семантическая разметка,
alt-тексты для изображений
9. Доступность: контраст, фокус-состояния, aria-атрибуты
Структура сайта (7 смысловых блоков):
1. Hero (первый экран)
2. Проблема клиента («Дракон»)
3. Решение («Волшебный меч»)
4. Оффер + бонус
5. Дедлайн
6. Доказательства и снятие возражений (отзывы, маркеры, гарантии)
7. Финальный CTA
+ Шапка с переключателем языков
+ Футер (контакты: Telegram, WhatsApp, Instagram)
+ FAQ (если уместно)
Формат: готовый код, разбитый по файлам, с комментариями.
➕ Дополнительный текст
Важно: я не использую сборщики (webpack, vite) и фреймворки.
Только чистые файлы: index.html, style.css, script.js,
и отдельные файлы для казахской и английской версий.
Важно: для формы заявки используй отправку в Telegram через
Bot API (fetch-запрос). Оставь чёткие комментарии, куда
вставить токен бота и chat_id.
Важно: предусмотри honeypot-поле для защиты от ботов —
скрытое поле, которое люди не заполняют, а боты заполняют.
Важно: все внешние ссылки — с rel="noopener noreferrer".
Важно: не используй jQuery или другие библиотеки.
Только vanilla JS.
Важно: кнопка CTA должна повторяться после каждого
ключевого блока (после Дракона, Меча, Оффера, Дедлайна,
Доказательств) — используй единый класс и две модификации:
.btn-primary и .btn-outline.
Важно: опиши, как задеплоить сайт на Cloudflare Pages
(пошагово, для новичка).
🚀 Это твой код. Копируешь, вставляешь, деплоишь.
📎
Шаблон ТЗ на лендинг
Справочный блок — используй как чек-лист, когда пишешь ТЗ заказчику
или собираешь бриф для себя. Лежит рядом с цепочкой, чтобы не искать.
Скопировать шаблон целиком
Запрос на разработку продающего лендинга (ТЗ)
1. Цель лендинга и схема продаж
Главная задача: Подчинить всю страницу одному конкретному целевому действию (например: заявка на консультацию, бесплатный замер, скачивание каталога, покупка).
Тип продажи:
Прямая продажа (для простых/недорогих продуктов).
Двухступенчатая схема (для сложных или дорогих B2B/B2C продуктов — захват контакта через бесплатную выгоду/аудит/замер).
Целевое действие (CTA): [Вставьте целевое действие]
2. Исходные данные (Рынок и ЦА)
Продукт/Услуга: [Вставьте наименование и суть продукта]
Целевая аудитория (ЦА): [Вставьте портрет ЦА: демография, интересы, стиль жизни, статус]
Главные «боли» и проблемы ЦА («Дракон»): [Вставьте основные проблемы и страхи клиентов]
Конкуренты: [Вставьте список главных конкурентов и их слабые стороны]
Наши ключевые преимущества: [Вставьте 3–5 главных преимуществ]
3. Структура и смысловые блоки лендинга
Блок 1. Первый экран (Главное впечатление)
Дескриптор (под логотипом): Ёмкая фраза по формуле «Кто продает + Что продает + Кому + География/Условия + Ключевое преимущество».
Пример шаблона: [Компания]: продажа [Продукта] для [ЦА] в [Регион] с [Главная фишка/гарантия].
Главный заголовок (H1): До 6 слов. Должен отражать точное вхождение поискового запроса ЦА и бить в главную выгоду клиента, а не хвастаться компанией.
Подзаголовок: Раскрывает заголовок, показывает конкретную пользу.
Первая кнопка целевого действия (CTA): Яркая, с понятным призывом.
Блок 2. Проблема клиента («Ковыряем болячку»)
Описание реальной ситуации клиента, с которой он сталкивается. Главный герой истории — клиент, а не наша фирма.
Язык общения: Говорим на языке его задач и эмоций.
Блок 3. Решение («Волшебный меч»)
Презентация нашего продукта/услуги как прямого и легкого способа решить описанную проблему.
Перевод технических характеристик на язык выгод и образов (не просто «аккумулятор 5000 мАч», а «держит заряд 2 дня в режиме просмотра видео»).
Блок 4. Уникальное торговое предложение (Оффер)
Ответ на вопрос клиента: «Почему я должен купить именно у вас и что я получу сверху?».
Бонус / Усилитель: Дополнительный подарок, спеццена, бесплатный сервис или расширенная гарантия.
Блок 5. Ограничение по времени (Дедлайн)
Мотивация принять решение прямо сейчас, чтобы избежать прокрастинации.
Формат: Закрытый дедлайн (с точной датой) или открытый дедлайн (ограничение по количеству мест/товара на складе).
Блок 6. Доказательства и снятие возражений
Блок отзывов: Реальные, объективные отзывы (с небольшими детализированными подробностями для доверия).
Маркеры привлекательности: Ярлыки «Хит продаж», «Бестселлер» или «Новинка» на ключевых позициях.
Гарантии и условия: Четкая информация по доставке, оплате и возврату.
Блок 7. Финальный призыв к действию (CTA)
Формулировка: Строго в утвердительной форме и повелительном наклонении («Позвоните...», «Закажите...»). Никаких слов «если» («Если вы хотите...» — исключить).
4. Требования к копирайтингу и оформлению
Легкость чтения: Текст разбивается на короткие абзацы (не более 4–5 строк).
Визуальные акценты: Использование подзаголовков, мини-заголовков, стрелок, рамок и маркированных списков (буллетов).
Фокус на «Вы-подходе»: Писать от первого лица с обращением на «Вы/Вам», говорить о клиенте, а не о себе.
Частота кнопок: Размещать кнопку «Купить/Заказать» после каждого ключевого смыслового блока.
🧭 Используй как чек-лист — чтобы ничего не забыть в брифе или ТЗ.
Итоговая последовательность
Этап
Что делаем
Нейросеть
Результат
0
Упаковка портфолио (5 работ)
ChatGPT / Claude
Описания работ
1
Аналитика рынка
ChatGPT / Perplexity
Отчёт о рынке
2
Продающие тексты (7 блоков)
ChatGPT / Claude
Тексты для сайта
3
Дизайн (под 7 блоков)
ChatGPT / Claude
Дизайн-система
4
Код сайта
Claude / ChatGPT
Готовый код
Время: 3–4 дня интенсивной работы, если не отвлекаться. Важно: не пытайся пройти все этапы за один день. Каждый этап — отдельный чат, отдельная фокусировка. Иначе ИИ начнёт путаться.
Что делать прямо сейчас
Сегодня: прогони этап 0 для всех 5 работ. Сохрани описания.
Завтра: этап 1 (аналитика). Один чат — один запрос.
Послезавтра: этап 2 (тексты). Вставляешь результат этапа 1 + мой доп. текст.
Через день: этап 3 (дизайн).
Финал: этап 4 (код).
Altyn Click · Наталья · эмоциональный дизайн и психология клиента