Перейти к содержимому

Шаблон 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 кредитов, и переделывать один блок дважды невыгодно. Ниже порядок, который экономит больше всего.

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

← Все статьи