У любой нетехнической команды есть одна и та же проблема: идеи появляются быстро, реализация — нет. Добавить виджет, собрать калькулятор, автоматизировать отчет — для всего нужен разработчик. А разработчик занят: он исправляет баги и делает то, что важнее прямо сейчас. Задача маркетинга уходит в список ожидания и зависает там на недели.
В Аспро мы начали решать это через вайбкодинг (от англ. vibe coding): описываешь нейросети, что нужно получить — получаешь готовый код. Писать с нуля не надо. За последний год команда маркетинга и PR запустила несколько рабочих инструментов самостоятельно и практически не отвлекала разработчиков.
Рассказываем, что сделали и как это работает.
Кому это полезно
Вайбкодинг помогает всем, кто работает с сайтом или сервисами, но не пишет код профессионально: маркетологам, SEO-специалистам, контент-менеджерам, аналитикам и, конечно же, владельцам бизнеса.
Три сценария, где он выручает:
- Проверить гипотезу — до того, как отвлекать разработчика. Если идея не работает, узнаете за день, а не через месяц ожидания.
- Закрыть задачу самостоятельно — если она небольшая и не требует доступа к боевой базе.
- Собрать прототип — дизайнеры и программисты потом доводят его до нужного уровня.
Что мы уже сделали
На сайте: виджеты и калькуляторы
Виджет с ползунком. Для акционного лендинга сделали интерактивный блок: пользователь двигает ползунок и видит, как изменится доход сайта, если заказать запуск со скидкой прямо сейчас. Дизайнеры подправили стили — блок вписался в страницу.
Шторка «До/После». На странице услуги «Быстрый старт» добавили разделитель: пользователь сдвигает границу и сравнивает сайт до запуска и после. Код получился универсальный — вставляем в кейсы клиентов.
Два калькулятора. Для финансового направления собрали калькулятор расчета затрат на финансовый учет: пользователь видит, сколько стоит ведение таблиц вручную против Аспро.Финансы. Верстку страницы делал разработчик, логику — нейросеть.
Второй — калькулятор потерь сайта без SEO-продвижения. Коэффициенты зависят от типа и возраста сайта. Люди боятся вкладываться в продвижение, потому что первые результаты приходят не сразу. Калькулятор показывает вероятную выгоду через полгода и снимает часть возражений еще до разговора с менеджером.
Игра-раннер. PR-команда собрала браузерную игру в фирменном стиле Аспро. Работает как всплывающее окно при попытке уйти со страницы: выигрываешь — получаешь приз через форму Битрикс24. Полностью автономный инструмент без единой строчки кода, написанного вручную.
Вне сайта: скрипты и автоматизации
Чеклист с автоматическими значениями. В рамках маркетингового аудита сайта мы проверяем сайты клиентов по чеклисту и раньше вручную проставляли критичность каждого пункта. ChatGPT предложил решение через Google Apps Script: теперь значения меняются сами, когда ставишь или убираешь галку. Скрипт сохраняется при копировании файла — работает в любом новом чеклисте.
Ежедневный дашборд сделок. Каждое утро уходило время на ручную сборку отчета по сделкам из Битрикс24. Описали задачу нейросети: скрипт подтягивает сделки из трех воронок, считает выполнение плана по каждой и записывает историю в Google Sheets с цветовой индикацией. Запускается автоматически в 9:40 каждый рабочий день. Экономия — 5 минут ежедневно, около двух часов в месяц только на один отчет.
Как мы это делаем
Основным инструментом был ChatGPT, сейчас вовсю используем Claude Code. Принцип везде одинаковый.
1. Описываем задачу конкретно. Не «сделай калькулятор», а что именно вводит пользователь, что считается и в каком виде показывается результат. Чем подробнее описание — тем ближе первый вариант к нужному.
3. Передаем стилистику через скриншот. Для блоков на сайте прикладываем скриншот страницы — нейросеть подбирает подходящие цвета, шрифты и отступы. Если что-то выбивается, выделяем на скриншоте и объясняем, что поменять.
4. Отдельно проверяем мобильную версию. Это легко пропустить: просим адаптировать верстку под мобильные устройства, иначе блок ломается на телефоне и портит впечатление от страницы.
Что нужно знать из технического минимума
Для работы с кодом через HTML-блоки нужно базово ориентироваться в HTML и CSS. Не писать с нуля — именно ориентироваться: понимать, где стоит контейнер, что такое max-width, как открыть инструменты разработчика клавишей F12 и найти нужный элемент.
Однажды виджет не растягивался на всю ширину страницы. Через инструменты разработчика нашли, что у контейнера ограничена максимальная ширина — убрали это двумя строчками кода. Без базового понимания разметки разобраться было бы сложнее.
Еще один момент: нейросети иногда генерируют лишний код. Тяжелые скрипты замедляют загрузку страницы, а скорость напрямую влияет на позиции в поиске. Если что-то стало работать медленнее — лучше показать разработчику.
И главное: не стоит бояться что-то сломать. У нетехнического сотрудника обычно нет доступов, чтобы уронить сайт целиком. Если возникают сложности — разработчики быстро разберутся: нейросеть комментирует каждый блок кода, и специалисту легко понять, что и зачем там написано.
Итог
Вайбкодинг не заменяет разработчиков. Он убирает очередь для задач, которые их участия не требуют.
Простые вещи закрываются самостоятельно. Идеи проверяются за день, а не за месяц. Рутина автоматизируется. А разработчики фокусируются на том, где они действительно нужны.
