Шаблон Pulseboard: лендинг аналитики и живой дашборд

Pulseboard это готовый шаблон из галереи Zugo: лендинг сервиса продуктовой аналитики и дашборд за кнопкой входа. На витрине есть блок возможностей, объяснение запуска в три шага, тарифы с переключателем периода и FAQ, а внутри воронки, удержание и когорты. Клон бесплатный, правка стоит 3 кредита.

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

Что внутри шаблона Pulseboard?

Шаблон закрывает типичную задачу SaaS-компании: объяснить продукт незнакомому человеку и тут же показать, как он выглядит изнутри. Обе поверхности лежат в одном проекте и правятся одинаково.

Дашборд сделан подробно: есть переключатели периода на 7, 30 и 90 дней, фильтры по платформе, блоки активных пользователей и топа событий. Такой уровень детализации редко доходит до лендинга, а он важен: покупатель B2B-инструмента решает по внутреннему экрану, а не по обещанию на витрине.

Раздел с возражениями стоит отдельного упоминания. Он прямо отвечает на скепсис про внедрение, и это правильный ход для продукта, чья главная преграда звучит как «у нас нет времени это подключать».

Что здесь работает, а что показано как интерфейс?

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

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

Это принципиальная граница, и обойти её правкой нельзя. Настоящая аналитика требует сбора событий и хранилища. Из коннекторов есть Supabase для базы и Google Analytics для посещаемости сайта, и это разные задачи: посещаемость страницы и продуктовые события внутри приложения меряются по-разному. Как подключается счётчик, разобрано в статье приложение с Google Analytics.

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

Кому подходит Pulseboard?

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

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

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

Отдельная развилка: вам нужен только дашборд, без витрины. Тогда одной правкой убирается публичная часть, и остаётся внутренний экран. Как собрать такой экран осмысленно, разобрано в статье дашборд для SaaS нейросетью.

Взять шаблон или собрать лендинг с нуля?

Считается это просто. Сборка по описанию стоит 6 кредитов и даёт страницу ровно по вашему тексту, включая всё, что вы в нём не назвали. Клон бесплатный, и платите вы только за отличия от каркаса, который видели работающим в превью.

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

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

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

Как переделать шаблон под свой продукт?

Порядок правок важен: сначала смысл и цифры, потом оформление. Каждая правка стоит 3 кредита, и переделывать один блок дважды невыгодно.

1. Замените название и обещание. Одна правка меняет имя продукта везде и переписывает первый экран.
2. Перепишите возможности. Пять блоков заменяются на ваш набор, количество меняется тем же запросом.
3. Поставьте настоящие цены. Тарифы в шаблоне демонстрационные, и оставлять их нельзя ни одного дня.
4. Перекроите дашборд. Замените метрики на те, что реально показывает ваш продукт: чужие названия вкладок сбивают с толку.
5. Настройте форму. Заявка должна куда-то приходить: письма отправляет коннектор Resend, данные складывает Supabase.
6. Опубликуйте. Проект живёт на адресе вида имя.zugo.run, свой домен подключается поверх на платных тарифах.

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

Сколько стоит довести шаблон до публикации?

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

Тарифы Zugo: Free даёт 5 кредитов, Pro стоит $25 в месяц и включает 200 кредитов, Business стоит $99 в месяц. Каждая сборка перед выдачей запускается в песочнице, и вариант, который не открылся, вам не отдаётся.

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

Какие правки просят чаще всего?

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

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

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

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

Где границы шаблона?

Аналитики внутри нет. Шаблон показывает интерфейс аналитики, а не считает ваши события. Сбор данных это отдельная система, и её наличие нельзя изобразить правкой вёрстки.

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

Сложная продуктовая логика доводится правками. Тарификация по событиям, лимиты, биллинг: оплату подключает коннектор Stripe, но правила списания описываются по шагам и проверяются по одному. На по-настоящему сложном продукте Zugo не заменяет команду разработки, а исходники забираются экспортом в GitHub.

Практический первый шаг: откройте галерею на zugo.dev, клонируйте Pulseboard и замените метрики дашборда на те, что важны в вашем продукте. Если после этого экран стал осмысленным, каркас ваш.