Графический дизайн

Дизайн отчёта по метрикам роста

Макет китайского отчёта объединяет четыре KPI-карточки, парные графики трендов, девять строк месячных примеров данных и три карточки выводов в одном вертикальном документе.

OpenDesignРаспространение шаблонов
Официальный

Распространяется в библиотеке OpenDesign Community; шаблон указывает HTMLAnything в качестве исходного апстрима.

Китайский ежемесячный отчёт о росте с KPI, трендами, таблицей исходных данных и выводами6 экранов
Светлый документ-отчёт: четыре KPI-карточки, парные графики трендов, таблица данных и три карточки выводов расположены по вертикали.
Обзор отчёта о ростеСкриншот 1 из 6

Где применяется отчёт о росте

  • Ежемесячная отчётность о ростеПредставляйте регулярные результаты роста в компактном отчёте.
  • Обзор KPIСравнивайте ключевые метрики с изменениями месяц к месяцу.
  • Донесение трендовРазделяйте численность аудитории и месячные проценты оттока во времени.
  • Сводки выводовСопоставляйте приведённые цифры с краткими пояснительными выводами.

Особенности макета отчёта

  • Четыре KPI-карточкиСначала показывает MAU, регистрации, платящих пользователей и отток.
  • Парные графики трендовРазделяет численность аудитории и месячные проценты оттока.
  • Таблица исходных данныхОставляет девять месячных строк доступными для проверки.
  • Карточки выводовСвязывает выбранные изменения с короткими пояснениями.

Четырёхслойный отчёт о росте

Этот китайский отчёт распространяется в библиотеке OpenDesign Community, а HTMLAnything указан как его апстрим. Он проходит через разделы KPI, Growth, Raw Data и Insights. В заголовке использована формулировка недельного отчёта с названием за май 2025 года, тогда как графики и таблица содержат девять месячных строк примера. Макет даёт мгновенную сводку, визуальное сравнение, исходную запись и итоговую интерпретацию; смешанные отчётные периоды нужно согласовать до использования в работе.

Первый кадр задаёт именно документ, а не рабочее пространство инструмента. «来源: 内部 BI» и «截止 2025-05-11» расположены справа вверху, а заголовок отчёта и краткое пояснение — слева вверху. Такое разделение делает происхождение и сроки данных видимыми, не мешая основному маршруту чтения.

Цифры — буквальные примерные значения из предоставленных HTML и JavaScript. Они иллюстрируют связи между элементами отчёта, а не реальные бизнес-показатели или подключённую BI-службу. Графики и таблица используют этот локальный массив, тогда как сравнения в KPI и тексты выводов написаны отдельно. Поэтому перед адаптацией макета для реальной отчётности определения в этих слоях нужно согласовать.

Обзор отчёта последовательно показывает заголовок, источник и дату, ряд KPI, графики трендов, таблицу исходных данных и раздел выводов.
Обзор отчёта последовательно показывает заголовок, источник и дату, ряд KPI, графики трендов, таблицу исходных данных и раздел выводов.

Сценарии использования отчётности о росте

Дизайн подходит для регулярных отчётов, где читателю нужны и быстрая проверка состояния, и достаточно подробностей, чтобы подвергнуть сводку сомнению. Четыре KPI-карточки показывают текущий срез: «月活用户 · MAU» — 23,950, «新增 · SIGNUPS» — 4,250, «付费 · PAYING» — 2,418 / 10.1%, «流失 · CHURN» — 1.8%. Соседние подписи сравнения явно показывают каждое движение, например «▲ 16.0% vs 上月».

Этот компактный ряд удобен для беглого просмотра, но сжимает определения. Отчёт показывает платящих пользователей и процент в одной карточке, а отток — с изменением в процентных пунктах. В рабочей версии эти различия нужно сохранить вместе с подтверждёнными определениями метрик: число и его сравнение не взаимозаменяемы.

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

Сводка для руководителя

Ряд KPI помогает читателям сориентироваться по текущим значениям и изменению месяц к месяцу.

Обзор трендов

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

Проверка доказательств

Таблица исходных данных связывает главный тренд с его исходными строками.

Пояснительное продолжение

Карточки выводов помещают интерпретацию рядом с соответствующим изменением.

Композиция и порядок чтения

Композиция намеренно вертикальная. Тонкий разделитель отделяет шапку отчёта от раздела KPI, а четыре карточки стоят в одном горизонтальном ряду. Ниже область роста отдаёт большую часть ширины панели «MAU & 付费用户增长», а более узкую — панели «流失率 · 月度». Такая пропорция даёт ряду больших количеств более полную область построения и сохраняет читаемость графика доли в его собственном масштабе.

На крупном графике персиковые столбцы MAU и зелёная линия платящих пользователей делят одну ось количеств по девяти подписям с сентября 2024 года по май 2025 года. На меньшей панели месячный отток отображён красной линией в процентах. Разделение панелей количества и процентов исключает смешение единиц, хотя ряд платящих пользователей остаётся близко к базовой линии рядом с крупными значениями MAU. Легенды, единицы и сопровождающая таблица важны, потому что одно направление не объясняет размер каждого изменения.

Таблица исходных данных идёт после графиков со столбцами «месяц», MAU, регистрации, платящие пользователи и отток. Её девять примерных строк идут от 8,420 MAU и 3.4% оттока в сентябре 2024 года до 23,950 MAU и 1.8% оттока в мае 2025 года. Это повторение даёт проверяемую запись за настроенными графиками ценой более длинной страницы. Таблица показывает организацию ряда, но не подтверждает причинные интерпретации отчёта или реальные бизнес-показатели.

Финальный ряд выводов меняет режим чтения с измерения на объяснение. Его три карточки охватывают рост MAU, конверсию в платящих и отток с короткими заголовками вроде «付费转化 7.3% → 10.1%». Отчёт завершается свёрнутым блоком «方法论 · Methodology», который резервирует место для методологического контекста, не конкурируя с основными выводами.

Раздел роста объединяет широкий график MAU и платящих пользователей с более узким графиком месячного оттока.
Раздел роста объединяет широкий график MAU и платящих пользователей с более узким графиком месячного оттока.
Как каждый слой отчёта помогает читать
СлойВидимые доказательстваЗадача читателя
KPIЧетыре текущих значения с подписями сравненияБегло оценить последнюю отчётную позицию
РостСтолбцы MAU, линия платящих пользователей и линия оттокаСравнить направление за девять месяцев
Исходные данныеМесячные строки MAU, регистраций, платящих и оттокаПроверить значения, лежащие за графиками
ВыводыТри письменных утверждения об измененияхПонять интерпретацию в примере

Границы области и возможностей

Этот артефакт — документ-отчёт, отрисованный из авторской разметки, стилей, настроек графиков и примерных строк. Видимые графики передают связи в предоставленном ряду, а нативный блок «方法论 · Methodology» даёт локальное раскрываемое состояние. Эти видимые решения не означают живого подключения к аналитике, автообновления, внешнего хранилища или проверенного процесса отчётности.

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

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

Как создать дизайн отчёта по метрикам роста в OpenDesign

  1. Скачайте и установите OpenDesign

    Скачайте десктопное приложение, установите его и завершите настройку. Создайте проект для своего дизайна.

    Скачать OpenDesign
  2. Задайте последовательность отчёта

    Начните с китайского заголовка отчёта, указания источника и даты среза, затем определите разделы KPI, Growth, Raw Data и Insights именно в таком порядке. Для воссоздания используйте один согласованный отчётный период: в исходном примере недельный заголовок сочетается с месячными строками, поэтому его подписи служат дизайн-ориентирами, а не проверенными определениями.

    Рекомендуемый промпт

    Создай дизайн китайского отчёта о росте с чётко подписанным отчётным периодом и датой среза источника. Расположи четыре раздела по порядку: KPI, Growth, Raw Data и Insights. Включи четыре KPI-карточки: MAU, регистрации, платящие пользователи с процентом конверсии и отток; широкий график с столбцами MAU и линией платящих пользователей; более узкий график оттока в процентах; таблицу из девяти месячных строк; и три карточки с осторожно сформулированными выводами. Используй только локальные иллюстративные примеры данных, без подключения к живой BI-системе. Выводи сравнения из одного подписанного периода, разделяй единицы количества и процентов и не придумывай причинных объяснений или операционных результатов.

  3. Распределите роли графиков

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

  4. Проверьте слой доказательств

    Добавьте таблицу исходных данных со столбцами «месяц», MAU, регистрации, платящие и отток. Сверьте её строки с подписями графиков и KPI-срезом, затем проверьте, что каждый процент, стрелка и надпись «vs 上月» относятся к одному и тому же отчётному периоду.

  5. Пишите выводы в чётких границах

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

  6. Экспортируйте дизайн и получите ссылку для публикации

    Экспортируйте готовый дизайн, затем воспользуйтесь функцией Share в OpenDesign, чтобы получить ссылку. Откройте ссылку в отдельном окне браузера и убедитесь, что нужная версия со всеми ресурсами доступна, прежде чем отправлять её.