Как создать сайт с помощью нейросети и проверить, что он работает

У сайта, который собрала нейросеть, может быть убедительный первый экран: крупный заголовок, кнопка, карточки услуг. Но посетитель приходит с задачей. Ему нужно понять предложение, посмотреть условия и связаться с вами. На этом пути и выясняется, насколько хорошо сделан сайт.

Создать сайт с помощью нейросети можно поэтапно: описать задачу, подготовить материалы, собрать первую версию, проверить пользовательский путь и только потом публиковать. На занятиях UPGRADE мы отдельно разбирали и уточняющие вопросы перед разработкой, и проверку результата в браузере.

Фраза «сделай современный сайт» оставляет почти все решения исполнителю. Для первой версии полезнее коротко описать посетителя, предложение и главное действие.

Например, учебное задание для страницы очного занятия может начинаться так:

В ответе стоит проверить именно структуру: сможет ли человек принять решение по этим разделам? Если нет сведений о формате или условиях участия, добавление анимации проблему не решит.

Подготовьте отдельную папку: описание услуги, действующие условия, контакты, логотип и реальные снимки. Отметьте, какие файлы актуальны. Если в материалах осталась прошлогодняя цена, ее легко случайно перенести на новую страницу.

Фотографии полезно подписать: кто или что на них изображено, для какого раздела они подходят. Не нужно просить модель придумать подписи к неизвестному событию. Если дата съемки не установлена, можно ограничиться тем, что видно и подтверждено.

На занятии мы обсуждали, почему первые версии ИИ-дизайна часто похожи друг на друга. Референсы помогают точнее передать ожидания. Покажите несколько примеров и объясните, что в них нравится: размер текста, расположение фото, спокойная палитра, простая навигация. Копировать чужую страницу целиком для этого не требуется.

Страница с описанием услуги, форма заявки и личный кабинет - разные по сложности задачи. Если попросить все сразу, труднее понять, какая часть работает и где возникла ошибка.

Сначала определите, куда попадет заявка. Нужна ли отправка в почту или рабочую систему? Кто ее получит? Что увидит посетитель при успешной отправке и при сбое? Эти вопросы влияют на реализацию сильнее, чем выбор оттенка кнопки.

Инструменты для создания сайтов различаются. Одни дают редактор готовых блоков, другие создают код, который нужно разместить на хостинге. Перед выбором проверьте, можно ли подключить нужную форму, использовать свой домен и впоследствии редактировать страницу. Условия бесплатного тарифа также стоит проверить отдельно: они могут ограничивать публикацию и функции.

На вебинаре мы разбирали проверку в браузере: открыть страницу, нажать элементы, заполнить данные и посмотреть результат. Такое прохождение помогает найти проблемы, которые не видны на красивом скриншоте.

Для страницы с заявкой пройдите путь целиком:

1. Откройте страницу с телефона и компьютера. Убедитесь, что текст читается, фотографии не закрывают важные детали, кнопки доступны.
2. Нажмите основные ссылки. Проверьте, что они ведут туда, куда обещают подписи.
3. Отправьте тестовую заявку и найдите ее в месте назначения.
4. Проверьте форму с пустыми и ошибочными полями. Посетитель должен понимать, что исправить.
5. Сверьте контакты, условия и обещания с исходными материалами.

Сообщение «Спасибо, заявка отправлена» само по себе не подтверждает получение. Проверить нужно обе стороны: что увидел посетитель и что получил сотрудник.

Вместо «переделай сайт, он какой-то скучный» удобнее указать проблему: на телефоне заголовок занимает почти весь экран; адрес трудно найти; кнопка не объясняет, что произойдет после нажатия.

После исправления снова пройдите соответствующий участок. Если меняли форму, отправьте тестовую заявку. Если меняли мобильную версию, проверьте ее на узком экране. Так обратная связь связана с конкретным поведением страницы.

На занятиях я использовал образ «двух девяток», объясняя разницу между быстрой первой версией и доведенным продуктом. Здесь нет универсального процента готовности. Смысл в том, что впечатляющий первый результат еще требует работы с деталями.

Откройте уже публичный адрес, а не только предпросмотр в редакторе. Повторите основной путь, проверьте изображения и получение заявки. Убедитесь, что у вас есть доступ для дальнейших изменений и понятно, где хранится версия сайта.

Первую страницу разумно делать небольшой. По ней быстрее выяснится, хватает ли посетителям информации и удобно ли им обращаться. Следующие разделы можно добавлять по этим наблюдениям - с пониманием, какую задачу каждый из них решает.

Такие задачи мы разбираем с командами компаний на их рабочих материалах. Подробнее: Нейросети для маркетинга, практический интенсив по нейросетям. Чтобы обсудить задачи своей команды, оставьте заявку на главной странице или посмотрите кейсы компаний.