Шаблон Pulseboard: лендинг аналитики и живой дашборд
Pulseboard это готовый шаблон из галереи Zugo: лендинг сервиса продуктовой аналитики и дашборд за кнопкой входа. На витрине есть блок возможностей, объяснение запуска в три шага, тарифы с переключателем периода и FAQ, а внутри воронки, удержание и когорты. Клон бесплатный, правка стоит 300 кредитов.
Ниже разобрано, из чего состоят обе части, чем такой шаблон отличается от обычного лендинга и что придётся доделать, прежде чем показывать его инвестору или первым пользователям.
Что внутри шаблона Pulseboard?
Шаблон закрывает типичную задачу SaaS-компании: объяснить продукт незнакомому человеку и тут же показать, как он выглядит изнутри. Обе поверхности лежат в одном проекте и правятся одинаково, обычным текстом в чате, без переключения между инструментами.
| Часть | Что внутри |
|---|---|
| Первый экран | Обещание аналитики без долгой настройки |
| Возможности | Пять блоков: отвал пользователей, удержание, срезы, отсутствие ручной разметки, оповещения |
| Как это работает | Три шага: поставить сниппет, назвать важные события, смотреть ответы |
| Тарифы | Цены за события, а не за места, с переключателем месяц и год |
| FAQ | Ответы на возражения про сложность внедрения |
| Дашборд | Обзор, воронки, удержание, когорты, мониторинг, сигналы, живой просмотр |
Внутренний экран разложен по вкладкам, которые повторяют реальные вопросы к продукту: обзор, воронки, удержание, когорты, мониторинг, сигналы и живой просмотр. Названия здесь важнее оформления, потому что именно они показывают, о чём продукт умеет думать.
Дашборд сделан подробно: есть переключатели периода на 7, 30 и 90 дней, фильтры по платформе, блоки активных пользователей и топа событий. Такой уровень детализации редко доходит до лендинга, а он важен: покупатель B2B-инструмента решает по внутреннему экрану, а не по обещанию на витрине.
Раздел с возражениями стоит отдельного упоминания. Он прямо отвечает на скепсис про внедрение, и это правильный ход для продукта, чья главная преграда звучит как «у нас нет времени это подключать». Такой блок снимает возражение до того, как оно дойдёт до переписки с продажами.
Что здесь работает, а что показано как интерфейс?
Витрина рабочая целиком: навигация, якоря, переключатель тарифов, раскрытие вопросов, поведение на телефоне. Её можно опубликовать почти без изменений, заменив тексты и цены на свои. Убедиться в этом можно до клонирования: превью в галерее открывается и работает.
Дашборд работает как интерфейс. Переключатели переключаются, фильтры фильтруют, графики отрисованы. Но за ними нет вашей аналитики: цифры демонстрационные, а состояние не сохраняется между перезагрузками, потому что базы за шаблоном нет.
Это принципиальная граница, и обойти её правкой нельзя. Настоящая аналитика требует сбора событий и хранилища. Из коннекторов есть Supabase для базы и Google Analytics для посещаемости сайта, и это разные задачи: посещаемость страницы и продуктовые события внутри приложения меряются по-разному. Как подключается счётчик, разобрано в статье приложение с Google Analytics.
Честная формулировка звучит так: Pulseboard даёт вам витрину аналитического продукта и убедительную демонстрацию его интерфейса. Сам аналитический движок это отдельный продукт, а не то, что достаётся вместе с шаблоном, и относиться к нему надо как к самостоятельной задаче.
Кому подходит Pulseboard?
Подходит команде, которая делает SaaS-инструмент и которой нужен сайт с показом интерфейса. Не обязательно аналитику: этот же каркас годится для мониторинга, дашборда отчётности, панели логистики, любого продукта с числами на экране.
Подходит для проверки спроса до разработки. Собрать витрину, показать интерфейс, поставить форму на ранний доступ и посмотреть, сколько людей оставят почту: это разумный способ потратить неделю вместо полугода.
Не подходит, если продукт не про данные. Лендинг курса, услуги или физического товара лучше начинать с шаблона попроще: дашборд там будет мёртвым грузом, который придётся вырезать, а это лишние правки на старте.
Есть и пограничный случай: внутренний инструмент компании, который не продаётся никому. Тогда витрина не нужна, но она не мешает, и её проще оставить как страницу с описанием для новых сотрудников.
Отдельная развилка: вам нужен только дашборд, без витрины. Тогда одной правкой убирается публичная часть, и остаётся внутренний экран. Как собрать такой экран осмысленно, разобрано в статье дашборд для SaaS нейросетью.
Взять шаблон или собрать лендинг с нуля?
Считается это просто. Сборка по описанию стоит 600 кредитов и даёт страницу ровно по вашему тексту, включая всё, что вы в нём не назвали. Клон бесплатный, и платите вы только за отличия от каркаса, который видели работающим в превью.
Pulseboard выигрывает, когда продукту нужны обе поверхности: и продающая страница, и показ интерфейса. Собрать такую пару с чистого промпта дороже и дольше, потому что описывать приходится два разных экрана с разной логикой, и половину деталей всё равно вспоминаешь уже после первой сборки.
Чистый промпт выигрывает, когда нужна только витрина без внутреннего экрана. Тогда дашборд превращается в лишний груз, который надо вырезать, а это тоже правки.
Есть и побочная польза от шаблона. Он показывает состав блоков, который работает у SaaS-лендингов: обещание, возможности, порядок внедрения, цены, снятие возражений, действие. Этот скелет полезно держать в голове, даже если вы соберёте свою страницу заново, потому что порядок блоков здесь такой же важный, как их наличие.
Как переделать шаблон под свой продукт?
Порядок правок важен: сначала смысл и цифры, потом оформление. Каждая правка стоит 300 кредитов, и переделывать один блок дважды невыгодно. Ниже порядок, который экономит больше всего.
- Замените название и обещание. Одна правка меняет имя продукта везде и переписывает первый экран.
- Перепишите возможности. Пять блоков заменяются на ваш набор, количество меняется тем же запросом.
- Поставьте настоящие цены. Тарифы в шаблоне демонстрационные, и оставлять их нельзя ни одного дня.
- Перекроите дашборд. Замените метрики на те, что реально показывает ваш продукт: чужие названия вкладок сбивают с толку.
- Настройте форму. Заявка должна куда-то приходить: письма отправляет коннектор Resend, данные складывает Supabase.
- Опубликуйте. Проект живёт на адресе вида
имя.zugo.run, свой домен подключается поверх на платных тарифах.
Третий шаг важнее, чем кажется. Демонстрационные цены на опубликованной странице это обещание, которое вы не собирались давать, и разбираться с ним придётся с первым же человеком, который на них сослался. Та же логика касается чисел в дашборде.
Сколько стоит довести шаблон до публикации?
Клон бесплатный, счёт начинается с правок. Полная замена содержимого на своё это обычно от пяти до восьми правок: витрина, тарифы и дашборд требуют внимания по отдельности, и смешивать их в одном запросе не стоит.
| Действие | Стоимость |
|---|---|
| Клон шаблона | Бесплатно, без обращения к ИИ |
| Правка в чате | 300 кредитов |
| Сборка с нуля по описанию | 600 кредитов |
| Многостраничная платформа | 1 200 кредитов за первые три страницы, дальше по 3 за страницу |
| Режим Hi-Fi | Вдвое дороже: правка 6, сборка 12 |
Тарифы Zugo: Free даёт 2 400 кредитов, Pro стоит $25 в месяц и включает 20 000 кредитов, Business стоит $50 в месяц. Каждая сборка перед выдачей запускается в песочнице, и вариант, который не открылся, вам не отдаётся.
Про бесплатный тариф стоит знать одну деталь, потому что арифметика там неочевидная. Стартовых 2 400 кредитов не хватит на сборку с нуля, потому что она стоит 600. Через шаблон путь дешевле: клон ничего не стоит, и первая правка укладывается в бесплатный запас, то есть страницу со своим названием и своими текстами можно увидеть, не заплатив ничего.
Если продукту нужны отдельные страницы под каждый сценарий использования, это уже платформа, и считается она иначе: 1 200 кредитов за первые три страницы и по 300 за каждую следующую.
Какие правки просят чаще всего?
Формулировки, которые срабатывают с первого раза, называют конкретный блок и конкретное изменение. Общие пожелания стоят столько же, но результат у них непредсказуемый.
«Замени пять блоков возможностей на три и опиши их так: ...». «Сделай в тарифах три плана вместо двух и убери годовой переключатель». «Замени вкладки дашборда на: заказы, доставки, возвраты». «Переведи весь сайт и дашборд на русский, включая подписи фильтров и пустые состояния».
Часто просят про доказательства: «добавь блок с логотипами клиентов под первым экраном». Здесь стоит удержаться от соблазна поставить чужие логотипы для красоты. Пустой блок честнее выдуманного, и по той же причине лучше не оставлять демонстрационные отзывы из шаблона.
И почти всегда всплывает поведение на телефоне: «на мобильном показывай вкладки дашборда лентой с прокруткой, а карточки метрик в один столбец». Внутренние экраны на узких устройствах ломаются чаще публичных.
Отдельно про страницу цен: она заслуживает собственной работы, а не одной строки. Разбор того, что на ней должно быть, есть в статье страница тарифов для SaaS нейросетью.
Где границы шаблона?
Аналитики внутри нет. Шаблон показывает интерфейс аналитики, а не считает ваши события. Сбор данных это отдельная система, и её наличие нельзя изобразить правкой вёрстки. Признать это заранее дешевле, чем объяснять потом первому клиенту, который уже поверил в демонстрацию.
Демонстрационные числа опасны. Пока в дашборде чужие цифры, показывать его пользователю нельзя. Либо подставьте свои данные, либо явно подпишите экран как пример интерфейса. Это вопрос не только честности: заметив выдуманные цифры, человек перестаёт верить и всему остальному на странице.
Сложная продуктовая логика доводится правками. Тарификация по событиям, лимиты, биллинг: оплату подключает коннектор Stripe, но правила списания описываются по шагам и проверяются по одному сценарию за раз. На по-настоящему сложном продукте Zugo не заменяет команду разработки, а исходники забираются экспортом в GitHub.
Практический первый шаг занимает несколько минут: откройте галерею на zugo.dev, клонируйте Pulseboard и замените метрики дашборда на те, что действительно важны в вашем продукте. Если после этого экран стал осмысленным, каркас ваш.