Что вы получите
- Полный KPI-дашборд одним HTML-файлом с видами за 7, 30 и 90 дней
- Скрипт, который превращает выгрузки CSV или JSON в данные дашборда
- React-блок на recharts и версия графика на ECharts
- Чипы изменений, линии прошлого периода, таблица разбивки и целевые полосы
- По желанию: фон шапки отчёта от PopNow, с ценой до запуска
Подходит для
- KPI продукта, магазина, поддержки или роста
- Страницы еженедельных и ежемесячных KPI-отчётов
- Обзорный экран внутреннего инструмента
Не подходит для
- Полноценные админ-приложения со множеством экранов
- Потоковые данные в реальном времени
- Сравнение многих рядов на одном графике
Как пользоваться
В Claude или ChatGPT
Используйте навык PopNow «Шаблон KPI-дашборда» (kpi-dashboard-template) для этой задачи: Соберите KPI-дашборд из exports/orders.csv: заказы, выручка, посетители и время первого ответа, разбивка по каналам.
В агенте для кода
/popnow-kpi-dashboard-template Соберите KPI-дашборд из exports/orders.csv: заказы, выручка, посетители и время первого ответа, разбивка по каналам.
Потом попробуйте
Добавьте цель по выручке 150 000 в месяц и по умолчанию показывайте последние 7 дней.
Дайте версию на React для нашего админ-приложения на Next.js.
Что подготовить
- Выгрузка CSV или JSON либо команда, которая её создаёт
- Четыре метрики и какие из них лучше при снижении
- По желанию: цели и колонка, по которой разбить одну метрику
Похожие навыки
Смотреть все →3D-конструктор аватаров
+3Соберите милого плюшевого 3D-персонажа прямо в браузере и сохраните его как прозрачный PNG или 3D-страницу.
Календарная тепловая карта активности
+3Год ежедневной активности в виде календарной сетки с заливкой — с сериями, итогами и управлением с клавиатуры.
Лендинг SaaS с ИИ
+3Песочный фон, тонкие направляющие и штриховка вокруг живой канбан-доски, где ассистент планирует задачи.
Анимированный первый экран сайта
+3Первый экран лендинга с плавно сменяющимся словом в заголовке, двумя кнопками и широкой рамкой для изображения.
Сайт агентства с шейдерным героем
+3Живой оранжевый шейдерный герой под крупным заявлением, навигация-таблетка и сетка кейсов.
Тёмный лендинг для SaaS
+3Тёмный маркетинговый сайт с насыщенной анимацией для программного продукта — в одном автономном HTML-файле.
Сайт портфолио дизайнера
+3Шесть наклонённых карточек вокруг заголовка на сером фоне, красная карточка портрета и кейсы.
Сайт-портфолио разработчика
+3Тёмный личный сайт для инженеров с кейсами, статьями, докладами, резюме и формой обратной связи.
Редакционный сайт SaaS
+3Тёмно-синий разделённый герой, заголовок с засечками рядом с документальным кадром и кобальтовый акцент.
Шаблон сайта в стиле глассморфизма
+3Матовые стеклянные таблетки на почти чёрном фоне, крупный заголовок с засечками и подписка.
Сайт аппаратного продукта
+3Огромные тонкие названия моделей на студийных кадрах, матовые карточки характеристик и линейка в масштабе.
Интерактивная схема архитектуры
+3Офлайн-схема системы, по которой можно кликать: построена из проверенной JSON-модели, с обоснованием для каждого блока.
Интерактивный герой с сеткой
+3Тёмная сетка тонких нитей, которая гнётся к курсору, и светящееся кольцо от каждого клика.
Граф знаний из заметок
+3Превратите заметки проекта в офлайн-граф с поиском, где каждое утверждение ведёт к строке источника.
Лендинг из ИИ-макетов
+3Сначала три полноэкранных макета на выбор, затем ваш агент собирает выбранный как чистый адаптивный код.
Шаблон сайта журнала
+3Сайт журнала с качеством печатного издания: статьи, рубрики, небольшой магазин и подписка — в одном HTML-файле.
Герой с анимацией частиц
+3Текст на тёплой бумаге рядом со сферой из чернильных и бирюзовых точек, меняющей форму под каждую идею.
Сайт личного бренда
+3Портрет, растворённый в тёплой бумаге под тонкой скобкой, с лёгким и жирным заявлением по бокам.
Кинематографичная страница запуска продукта
+3Почти чёрная страница в свете премьеры: заголовок с засечками, ночная сцена в letterbox и форма брони.
Шаблон админ-панели
+3Рабочая консоль бэк-офиса с графиками, таблицами, канбаном и календарём — в одном офлайн-HTML-файле.
Шаблон лендинга для SaaS
+3Спокойный светлый маркетинговый сайт для программного продукта с рабочей консолью продукта, ценами и регистрацией.
Сайт-портфолио в стиле скрапбукинга
+3Многостраничное онлайн-резюме из бумажных предметов, с кейсами и версией резюме для печати.
Шаблон сайта магазина кроссовок
+3Полноценный магазин обуви или одежды с каталогом, карточками товаров, корзиной и демо-оформлением заказа в одном HTML-файле.
Лендинг автоматизации процессов
+3Графитовая страница, небольшой заголовок слева и живой граф узлов: запускается, повторяет попытку, пишет логи.
Вопросы
Откуда берутся цифры?
Из вашей собственной выгрузки. Встроенный скрипт читает CSV или JSON, дневные итоги или сырые события, строит по строке на день для каждой метрики плюс необязательную разбивку и записывает всё в страницу.
Как считается процент изменения?
Последние 7, 30 или 90 дней сравниваются с таким же числом дней до них. Суммы сравниваются по суммам, время и доли по средним, а показатели вроде активных пользователей — по последнему значению. Метрика, где лучше меньше, показывает снижение как хорошее.
Нужна ли библиотека графиков?
Версия на HTML ничего не требует и работает офлайн. Версия на React использует recharts, а для проектов, которые уже используют ECharts, включена версия графика на нём.
Может ли PopNow нарисовать графики?
Нет, и не должен: модели изображений могут перепутать цифры. PopNow используется только для необязательного фона шапки или карточки без текста, а реальные цифры лежат сверху в HTML.