Кейс TFT Homes: сайт под ключ собрал AI-агент

Заказчик и задача

Олег делает разборные дома по технологии Timber Frame Tech. Производство находится в Петербурге, детали режут на станках с ЧПУ, на анкерный крепёж есть патент. Продукт настоящий: дом стоит, его возят на объекты и продают. Кейс собран на живом производстве, а не на учебном примере.

Когда проект пришёл ко мне, сайта не существовало. Домен был куплен год назад и всё это время не использовался, в Метрике не было ни одного визита, а в текстах два имени — компания TFT HOMES и технология Timber Frame Tech — шли вперемешку. Человек, попавший на такую страницу, не понимал, что именно покупает: дом, технологию или завод.

Задача звучала так: разобрать рынок и продукт, придумать бренд, найти язык, на котором дом продаётся, сделать три посадочные страницы под разные аудитории, блог, формы заявок и аналитику. Роли разделились с первого дня: Олег отвечал за продукт — узлы, характеристики, формулировки про конструкцию; структуру, тексты, дизайн, вёрстку, маркетинг и приёмку вёл я вместе с агентом.

Что значит «сайт сделала нейросеть»

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

Работа, которую видно на tft-homes.ru, отличается тремя вещами: объёмом контекста, набором инструментов и тем, как принимается результат. Разберу каждую.

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

Три компетенции, без которых ничего не выходит

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

Когда три компетенции живут в одном исполнителе, исчезает главная статья расходов в веб-разработке — время на согласование между подрядчиками. Отсюда сроки в полтора месяца и результат, который не рассыпается на стыках.

Как я обучал агента

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

1. Собрать контекст. Интервью, архив, сайт, цифры — всё складывается в память проекта, чтобы не возвращаться к этому на каждой следующей правке.
2. Оформить процедуру. Вместо «сделай красиво» появляется чек-лист: что должно быть на первом экране, какие поля у формы, что проверяем перед публикацией. Процедура записывается один раз и работает на всех следующих проектах.
3. Дать инструменты. Терминал, API, браузер, git. Без них агент остаётся генератором текста, который ничего не может проверить.
4. Принять результат и вернуть ошибки. Каждая моя правка становится новым правилом в скилле, а не разовой заплаткой в конкретном файле.

Лучше всего это видно на семантике. Агент выгружает частотность через API Wordstat с квотой сто запросов в час, отсеивает нецелевой шлейф вроде «дом из контейнера» или «дом на колёсах», раскладывает кластеры по страницам и только после этого предлагает структуру сайта. Такой порядок действий можно повторить на любом продукте: на стройке, в стоматологии, в доставке. Результат будет предсказуемым, потому что меняются данные, а не метод.

Второй пример короче. Вместо просьбы «посмотри, нормально ли выглядит» агент замеряет рендер страницы в headless-браузере на трёх ширинах экрана и сверяет размеры блоков между собой. Расхождение в отступах или вылезший за границу текст он находит до публикации, а не после письма клиента с фотографией экрана.

Живой прототип вместо картинки

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

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

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

Хронология

Даты считаю от интервью, потому что именно с него начался проект. Этапы шли подряд, без пауз на согласования.

• 16 маяЗаписано аудиоинтервью с Олегом на полтора часа — основа всей аналитики проекта.
• 20 маяРасшифровка загружена и очищена: 61 077 знаков. Собран бриф, описаны продукт, производство и ограничения.
• 26 маяРазобраны 569 файлов архива: презентации, бизнес-планы, логотипы, фотографии производства.
• 2 июняСобрана семантика через API Wordstat: кластеры по пяти нишам, отсеян нецелевой спрос, найдены ловушки запросов.
• 9 июняОпределены аудитории и сценарий: бизнес-глэмпинги и частный заказчик. Посчитана unit-экономика.
• 18 июняГотов бренд: название отделено от технологии, собраны логотип, знак, палитра и типографика.
• 21–22 июняПервый лендинг собран и выложен вживую. Дальше 17 итераций по структуре первого экрана прямо на живом прототипе.
• Начало июляСтраница для глэмпингов: конструктор габаритов, экономика объекта, окупаемость, партнёрская программа.
• Конец июляСтраница для частных клиентов и отдельная мобильная версия: шапка на весь экран, аккордеон, перестроенные блоки.
• Середина августаТри формы с разной логикой полей и серверный обработчик заявок: токен вынесен за веб-корень, заявки идут в Telegram.
• Конец августаРаздел статей и первые материалы под информационные запросы.
• СентябрьНейро-оптимизация: llms.txt с фактами на 4,4 КБ, JSON-LD, FAQ-блоки, robots.txt для одиннадцати AI-краулеров.
• Конец сентябряВключены Метрика с целями и Вебмастер. До этого сайт не считал ни одного визита.
• ОктябрьПравки по первым заявкам, проверка на мобильных устройствах, публикация кейса.

Что стоит на сайте

• Три посадочные страницы и блог. Главная объясняет технологию и разводит два типа заказчиков, отдельные страницы ведут глэмпинги и частных клиентов — каждый читает про свою задачу. В блоге лежат статьи под информационные запросы, откуда приходят те, кто ещё выбирает технологию.
• Три формы под три сценария. Форма «узнать цену дома» спрашивает глубину и мансарду, форма расчёта глэмпинга — количество домов и регион, третья выдаёт юридическое заключение. Тип заявки определяется набором полей, поэтому менеджер сразу видит, что нужно человеку.
• Заявки в Telegram через сервер. Токен бота лежит в файле вне веб-корня. Открыв исходный код страницы, доступа к боту получить нельзя.
• llms.txt с фактами. В файле собраны цена за квадратный метр, сроки, габариты, экономика объекта и юридический статус. Ассистент может процитировать цифру, а не пересказать маркетинговый абзац.
• Разметка и доступ для AI-ботов. JSON-LD с описанием организации, FAQPage на посадочных страницах, одиннадцать краулеров открыты в robots.txt, закрыты только тестовые каталоги.
• Метрика с целями и Вебмастер. Видно, из какого источника пришёл человек и дошёл ли он до формы. Это тот минимум, без которого сайт нельзя улучшать.

Где такие сайты теряют деньги

У сайта на старте есть типовой набор мест, где утекает бюджет и заявки: около двух десятков известных ловушек — от нецелевого трафика в семантике до токена бота в клиентском коде. Список живёт в чек-листе и проходится на каждом проекте. Большую часть удаётся обойти заранее: семантику проверили на ловушки спроса вроде «дом на воде» и «дом на колёсах», одинаковые заголовки страниц развели до публикации, вес картинок и скорость загрузки на мобильном замерили до запуска.

Три пункта из этого списка стоят отдельных слов: они чаще всего всплывают уже после запуска, когда исправление стоит денег и репутации.

• Высокая шапка на маленьких телефонах. На экране шириной 375 пикселей шапка на весь экран съедает первый экран и уводит кнопку заявки за границу видимости. Поэтому высота ограничена, кнопка поднята выше, а видео в шапке на слабых устройствах не загружается.
• Количество полей в форме. Каждое лишнее поле стоит части заявок: человек бросает заполнение на середине. В форме расчёта остались площадь, этажность, регион и телефон — остальное менеджер уточняет в разговоре.
• Вес картинок. Тяжёлый первый экран — это четыре секунды ожидания на мобильном интернете и потерянный посетитель. Изображения отдаются в webp, размеры прописаны в разметке, всё ниже первого экрана грузится лениво.

Что в планах

Следующий этап — не новые страницы, а работа с обращениями и цифрами. Три вещи, которые уже собраны и работают на действующем проекте (клиника УроМед) и переносятся на TFT без переделки.

Запуск зависит от бюджета проекта: сам контур уже написан и проверен на живом трафике, работе остаётся подключить кабинеты TFT и перенести правила ответов на его продукт.