Re:Shift: как я выстроил бренд и запустил сайт с помощью ИИ

Заказчик обратился ко мне, поскольку у меня уже был опыт разработки сайтов для стилистов.

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

Для этого реального заказа я решил использовать ИИ на всех основных этапах — от нейминга и разработки концепции до дизайна, вёрстки и работающих форм заявок. При этом продуктовые решения, контроль содержания и проверку результата оставил за собой. Мне было важно понять, насколько такой подход применим в клиентском проекте, а не только в экспериментальной демонстрации.

От идеи услуги к логике бренда

В работе над позиционированием быстро выяснилось: список услуг ещё не объясняет, зачем человеку обращаться в студию. Например, запрос на обновление гардероба может означать совершенно разные задачи. Одному нужно разобраться с имеющимися вещами, другому — подобрать одежду под изменившийся образ жизни. Если начать с названий процедур, клиенту придётся самому решать, что ему подходит.

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

Эта логика постепенно определила продуктовую матрицу, тексты и структуру сайта. Параллельно с ChatGPT я прорабатывал нейминг и позиционирование. Вариантов было много; часть выглядела интересно, но не передавала нужный смысл. Название Re:Shift в итоге закрепило идею изменений и нового подхода к привычным вещам.

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

Как я связал работу нескольких ИИ-исполнителей

Для проекта сложилась рабочая система из ChatGPT, Notion и Google Drive.
ChatGPT использую для обсуждения решений, анализа и подготовки заданий. В Notion храню утверждённые тексты, требования, текущие задачи и отчёты. На Google Drive собираю референсы, изображения, макеты и скриншоты.

Передачу работы между исполнителями тоже организовал через Notion. Один бот формирует конкретное задание в рабочем документе, другой читает его и выполняет нужный этап. Результат записывается в отчёт, после чего я проверяю его и принимаю решение о следующей задаче.

Такой процесс оказался удобнее длинной переписки, в которой вперемешку лежат черновики, исправления и прежние инструкции. У каждого этапа появляется понятный источник требований, а у меня — возможность вернуться к решению и выяснить, почему его приняли.

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

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

Почему дизайн пришлось отделить от готового содержания

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

Особенно сложно давались длинные разделы, занимающие два экрана и больше. Даже при наличии полного текста в Notion генератор старался уместить секцию в привычный размер изображения. Для этого сокращал абзацы, убирал карточки или придумывал более короткие подписи.

Я перестал добиваться от дизайн-картинки буквального совпадения со всем содержанием. На этом этапе выбирал композицию: расположение элементов, пропорции, визуальный ритм и возможность расширения блока. А уже при вёрстке другой ИИ-исполнитель переносил полный утверждённый текст, добавлял недостающие карточки и корректировал отступы.

В итоге работа стала посекционной: макет одного раздела, проверка, корректировки, вёрстка, тестирование — затем следующий раздел. Это не избавило от правок, зато позволило замечать их до того, как ошибка распространялась на весь лендинг.

От внешнего вида — к работающему сайту

Постепенно собранные секции превратились в одностраничный сайт на PHP и JavaScript, без CMS и базы данных. Но между готовой вёрсткой и рабочим сайтом оставался важный этап: подключить формы и проверить взаимодействие элементов.

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

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

Форма тоже прошла путь от демонстрационного сообщения до настоящей отправки на почту через PHP-обработчик. Я проверял не только ответ сервера, но и получение письма в почтовом ящике. Для посетителя это незаметная деталь, но именно она отделяет презентационный макет от работающего инструмента.

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

Что показала следующая попытка автоматизации

После запуска я стал готовить следующий этап: развитие отдельных страниц услуг и блога на Joomla с YOOtheme Pro. Прежде чем переносить всё, решил проверить подход на отдельном тестовом сайте — на шапке и первом экране.

ИИ-агент смог воссоздать структуру и приблизить внешний вид к исходному дизайну. Но выяснился технический нюанс: значительная часть оформления задавалась отдельными CSS-переопределениями прямо внутри элементов конструктора. Из-за этого глобальные стили и штатные настройки YOOtheme Pro не всегда влияли на элементы ожидаемым образом — их перекрывали локальные правила.

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

Что я вынес из Re:Shift

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

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

ИИ уже стал для меня постоянным рабочим инструментом, но не самостоятельным руководителем проекта. Решение о том, что именно делать, как оценивать качество и когда привлекать других специалистов, остаётся за человеком.

Рабочий сайт доступен по ссылке: www.re-shift.ru