Как создать сайт с помощью нейросети за 10 минут: мой кейс Avanta AI
Я Андрей Петров – основатель ИИ Чат-бота «Аванта» из Владивостока. Я стремлюсь облегчить жизнь предпринимателей малого и среднего бизнеса, помогая им автоматизировать взаимодействие с клиентами и увеличить продажи через современные технологии. Веду Telegram-канал, где делюсь полезными инсайтами и советами о внедрении искусственного интеллекта в бизнес-процессы.
Ничего Вам не продаю, просто рассказываю про AI и делюсь своим опытом.
Внедрите 3 ИИ помощников под свой бизнес бесплатно уже сегодня и повысьте эффективность минимум на 30%. Пошаговые гайды:
Содержание
- Почему эта статья важна каждому, кто хочет продавать больше?
- Как подготовить задание для нейросети, чтобы получить не «сырой» сайт, а готовый инструмент продаж
- Процесс создания сайта.
- Публикация сайта.
- Подводим итоги
Как читать статью?
Прочитайте её до конца 1 раз, а после читайте её ещё раз и делайте всё шаг за шагом, для написания лучшего сайта.
🚀1. Почему эта статья важна каждому, кто хочет продавать больше?
Вместо того чтобы тратить недели на дизайн и разработку, я решил проверить нейросеть Bolt.new. Спойлер: сайт был готов за 10 минут. Делюсь опытом! И пошаговым гайдом.
Создать продающий сайт быстро — мечта каждого предпринимателя, маркетолога или фрилансера. Но реальность такова: традиционная разработка сайта занимает недели, требует согласований, брифов, правок и немалых вложений. Когда задача — протестировать продукт, быстро запустить MVP или начать получать заявки уже завтра, время играет против нас.
Особенно это актуально для тех, кто работает с инновационными продуктами. Например, как в моём случае — Avanta AI. Это комплекс умных ИИ-ассистентов для бизнеса, будем делать сайт на примера помощник РОПа: анализ звонков, обратная связь менеджерам, отчёты для руководителя отдела продаж. Чтобы продавать такой продукт, нужен не просто сайт-визитка, а по-настоящему понятный, визуально современный и конверсионный лендинг.
И времени на долгие обсуждения с агентством у нас, как вы понимаете, не было.
Именно поэтому я решил проверить, можно ли за 10 минут сделать рабочий продающий сайт с помощью нейросети. Не макет, не прототип — а готовый инструмент для презентации продукта и сбора заявок. Результат превзошёл ожидания. Ещё и бесплатно.
И в этой статье я покажу вам, как сделать так же: быстро, без сложных технических навыков, без дорогих подрядчиков и без лишней нервотрёпки.
Сохраняйте статью — она станет вашим пошаговым гидом к запуску собственного сайта за рекордное время 🚀
2. Как подготовить задание для нейросети, чтобы получить не «сырой» сайт, а готовый инструмент продаж
Нейросеть — это не волшебник. Она работает на основе того, как вы ей объясните задачу. Именно поэтому 90% успеха зависит от качества вашего запроса.
Когда я готовил ТЗ для Avanta AI, я подошёл к этому, как к брифу для команды разработчиков и дизайнеров одновременно. Чем конкретнее будет ваш запрос, тем лучше результат.
Прежде чем отдавать задание нейросети, ответьте себе на 5 вопросов:
- Какая основная цель сайта? (например: генерация заявок, продажи, презентация продукта)
- Какой стиль визуала нужен? (минимализм, киберпанк, строгий корпоративный и т.д.)
- Какая структура сайта будет максимально эффективной? (пункты меню, блоки)
- Какое главное действие вы ждёте от посетителя? (например: записаться на демонстрацию)
- Какие особые пожелания или детали важно учесть? (скорость загрузки, мобильная версия, интерактивные элементы)
Чем подробнее и яснее вы ответите на эти вопросы, тем ближе к идеалу будет ваш готовый сайт.
3. Процесс создания сайта:
1. Заходим на сайт
2. В правом верхнем углу нажимаем на большую синюю кнопку Get Started
3. Регистрируемся либо через аккаунт гугл или гитхаб, если у Вас такого нет, то просто через почту.
4. Попадаем на вот такое окошко:
Дальше наша задача - написать правильный промпт, у нас есть всего 1млн токенов в месяц и не более 150.000 токенов в день. За 1 день мне удалось многое, но я ещё продолжу работу над сайтом.
Ранее вы уже ответили на важные вопросы, и чем подробнее мы опишем всё, тем дешевле по токенам нам нужно будет создавать сайт. Переходим на сайт пинтерест и пишем свой запрос, в моём случае это был "Site AI"
Я нашёл походящий мне лендинг и загрузил его в bolt.new.
Ниже прилагаю промпт, который задал, перепишите его под Ваш сайт:
Цель сайта:
Сделать продающий, визуально привлекательный сайт компании Avanta, который:
- Презентует все ключевые возможности продукта.
- Создаёт ощущение экспертности и технологичности.
- Подводит пользователя к целевому действию — записаться на бесплатную демонстрацию возможностей ИИ-ассистента в вашем бизнесе.
- Не использует видео, фокус на тексте, визуале и пользе.
🛠 Основной целевой action:
Основное действие пользователя:
- Записаться на бесплатную демонстрацию возможностей ИИ-ассистента в вашем бизнесе
- Кнопка с этим действием должна быть яркой, заметной и дублироваться на протяжении всего сайта: На первом экране. После блока «Как работает». В CTA-блоке перед футером. Повтор в футере. Визуальная рекомендация: кнопка должна выделяться среди других элементов сайта, использовать анимацию наведения (подсветка, лёгкая пульсация).
Структура сайта
1. Шапка (Header) Слева — логотип Avanta AI (стиль: минимализм с киберпанковским акцентом). По центру — меню: Возможности Как работает Для кого Контакты Справа — иконка поиска (лупа), при нажатии раскрывается строка поиска с неоновой анимацией.
2. Первый экран (Hero section) Заголовок: «Avanta — Ваш ИИ-ассистент по управлению отделом продаж» Подзаголовок: «Анализирует, подсказывает, усиливает команду и помогает закрывать больше сделок.» Кнопка: [Записаться на бесплатную демонстрацию] Фон: светлый, с киберпанковыми абстракциями: линии, нейросеть, цифровые узоры, ненавязчиво намекающие на аналитику и CRM.
3. Блок «Возможности Avanta» Карточки/плитки с иконками и короткими описаниями: Интеграция с CRM Подключение за 1–2 дня, полная интеграция. Аналитика по каждому менеджеру Показывает оценки, даёт разборы разговоров. Еженедельный отчёт для РОПа Руководитель отдела продаж получает готовый отчёт с выводами и советами. Ассистент для РОПа в реальном времени Можно спросить у бота: как прошла неделя, кто лучший менеджер, что улучшить. Персональные советы менеджерам Avanta помогает каждому менеджеру повышать конверсию. Улучшение скриптов Подсказывает, какие скрипты работают лучше.
4. Блок «Как работает Avanta» Пошаговая схема или горизонтальный скроллинг-блок: Подключение к CRM Анализ звонков и переписок Советы менеджерам Отчёты для руководителя Интерактивный ассистент для РОПа Под этим блоком: [Записаться на бесплатную демонстрацию]
5. Блок «Для кого Avanta» Карточки с описанием целевых сегментов: ✔ Компании с активным отделом продаж
✔ Малый и средний бизнес
✔ Онлайн-школы
✔ Агентства недвижимости
✔ B2B-услуги
6. Блок «Отзывы и результаты» (можно как заглушку под реальные отзывы) Цитаты пользователей, реальный результат: «Avanta помогла нам увидеть слабые места и увеличить продажи на 37% уже в первый месяц.» Под этим блоком: [Записаться на бесплатную демонстрацию]
7. Финальный CTA-блок Заголовок: «Хотите увидеть, как Avanta усилит ваш отдел продаж?» Подзаголовок: «Запишитесь на бесплатную демонстрацию, и мы разберём ваш кейс персонально.» Кнопка: [Записаться на бесплатную демонстрацию]
8. Футер Логотип Avanta AI Дублирующее меню Контакты: телефон, e-mail, Telegram Слоган: «Avanta — искусственный интеллект для ваших продаж.» Кнопка: [Записаться на бесплатную демонстрацию]
🎨 Визуальный стиль Стиль:
минимализм + элементы киберпанка. Цвета: Основа: светлый серый / пастельный голубой Акценты: неоновый голубой / лаймовый / фиолетовый Элементы: линии, нейросети, цифровые узоры Анимации: Плавное появление блоков при скролле Подсветка кнопок при наведении Плавный переход между секциями
🛠 Функциональность Быстрая загрузка Адаптивность под мобильные устройства и планшеты Интеграция формы заявки на демонстрацию Возможность масштабирования: добавить кейсы, результаты, отчёты Простое добавление новых блоков и страниц
📝 Дополнительно для команды: Цель сайта — продавать демонстрацию продукта. Нет видео-контента: только текст, визуал, инфографика. Главное — донести ценность Avanta как ассистента РОПа и аналитика отдела продаж.
Вписываем промпт и нажимаем на кнопку "Enhance prompt", нейросеть самостоятельно переведёт на английский наш промпт и чуть-чуть переделает его для лучшей генерации.
Следом нажимаем на синюю стрелочку и началась генерация сайта.
Ждём 1-2 минуты и первая версия сайта готова. В моём случае он создал сайт на английском, сразу в чат пишем ему, что нужно исправить.
Промпт для исправлений (Что исправлял я):
Выполните профессиональный перевод всего содержимого веб-сайта с исходного языка на русский язык, включая: Весь текстовый контент на страницах Заголовки и подзаголовки Навигационное меню Кнопки и призывы к действию Метаданные (title, description) Формы и подписи к полям Уведомления и системные сообщения Футер и контактную информацию Перевод должен: Сохранять исходный смысл и стиль Учитывать культурные особенности целевой аудитории Использовать правильную терминологию для данной тематики Быть грамматически и стилистически корректным Сохранять форматирование и структуру оригинала Предоставьте перевод в формате, готовом для интеграции в систему управления контентом сайта.
Далее я исправлял функционал и внешний вид сайта:
Мне нужно внести правки. В мобильной версии добавь гамбургер, в котором будет всё что с шапки: Возможности, как это работает, для кого, контакты. После блока как это работает, добавь блок с примерами работы, там должна быть скроллинговая лента, на которой фото-скриншоты с переписками вот в таком стиле, как на фото, телефон плюс в нём скрин - скриншоты я после вставлю самостоятельно. В отзывах клиентов тоже оставь место под скриншоты
И все другие исправления описываем в таком стиле. По итогу имеем боле-менее сайтик, который ещё можно править.
Публикация сайта
В правом верхнем углу нажимаем кнопку "Deploy"
Бот автоматически публикует сайт и даёт нам не него ссылку:
Верхняя ссылка, чтобы быстро посмотреть сайт, нижняя ссылка, чтобы добавить сайт к себе в аккаунт netlify.
Далее заходим на сайт : app.netlify.com и регистрируем аккаунт, также через большую синюю кнопку в правом верхнем углу - Sing Up
Во время регистрации он просит данные, не переживаем и всё записываем:
Следом заходим назад в bolt.new и переходим по второй ссылке, в открывшемся окне нажимаем Claim apps.
Здесь уже можно настроить домен или оставить тот который даёт нам netlify. Также сайт, который выдал нам bolt.new можно скачать и опубликовать на своём сервере, но это уже другая история.
5. Подводим итоги
Создание сайта больше не должно быть долгим и выматывающим процессом. Технологии сегодня позволяют за считанные минуты получить не просто черновик, а готовый, стильный и конверсионный сайт, который сразу начинает работать на ваш бизнес. Да, это не заменит дизайнера и кодеров, но для MVP и стартапа это идеальное решение.
Если вы откладывали создание сайта из-за нехватки времени, бюджета или ресурсов — попробуйте этот способ. С помощью нейросети вы сможете запустить сайт даже быстрее, чем запустить рекламную кампанию. Это отличный способ быстро проверить гипотезу, протестировать новый продукт или усилить свои текущие продажи.
Теперь — ваш ход.
А вы уже создавали свой сайт с помощью нейросетей или конструкторов? Поделитесь своим опытом в комментариях 👇 Мне будет интересно узнать, какие инструменты вы пробовали и что у вас получилось.
А если Вы думаете, как бы внедрить к себе в бизнес ИИ и как он поможет Вашим продажам, то обязательно: