# Дашборд и диаграммы: показываем вопрос, а не декор

## Результат

Вы спроектируете маленький учебный дашборд: три честные сводки, одна диаграмма и список следующих материалов. Он отвечает на один вопрос, например: какие категории изучались за неделю или сколько материалов осталось в выбранном треке. Не рисуйте график для вымышленных чисел и не превращайте «прогресс» в оценку человека. Если данных пока нет, лучше показать пустое состояние и объяснить, что появится после первых записей.

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

## Шаги

1. Запишите вопрос в одном предложении и определите единицу измерения: материалы, минуты, завершённые практики.
2. Выберите минимальный вид: столбцы для сравнения категорий, линия для изменения во времени, таблица для точных значений.
3. Подпишите оси, легенду, период и источник локальных данных. Цвет не должен быть единственным способом различить серии.
4. Рядом с графиком добавьте одно текстовое наблюдение, основанное на показанных числах, без неподтверждённого вывода о причине.
5. Сделайте пустое и нулевое состояния разными: «нет данных» не равно «значение равно нулю».

## Применимый prompt

```text
Помоги выбрать диаграмму для вопроса «какие категории материалов я завершил за неделю». Укажи единицу, подписи, пустое состояние и одно текстовое резюме без выдуманных данных.
```

## Критерий проверки

Без цвета и tooltip можно назвать вопрос, период, единицы и минимум один вывод, который действительно следует из значений.

### Источники

- [Chart — shadcn/ui](https://ui.shadcn.com/docs/components/radix/chart)
- [Blocks — shadcn/ui](https://ui.shadcn.com/blocks)

## Следующий шаг

Запишите один вопрос к данным и подготовьте таблицу из трёх реальных строк до выбора диаграммы.

Источник: https://ui.shadcn.com/docs/components/radix/chart