Dashboard für Produktanalysen

Kopierbare Prompt-Vorlage

Die technische Vorlage bleibt auf Englisch, damit sie direkt mit den unterstützten Coding-Agenten funktioniert. Erklärung, Auswahlhilfe und Prüfschritte sind lokalisiert.

Create a responsive product analytics dashboard for [PRODUCT TYPE]. The primary user is [USER ROLE], and their most important daily decision is [DECISION].

Build the interface around that decision instead of filling the screen with unrelated metrics.

Include:
- A collapsible sidebar with Overview, Acquisition, Activation, Retention, and Settings.
- A top bar with workspace switcher, date range, comparison period, and export action.
- Four KPI summaries for [KPI 1], [KPI 2], [KPI 3], and [KPI 4], each showing current value, change, and a short interpretation.
- One primary trend visualization and one supporting breakdown visualization using realistic sample data.
- A sortable table for [CORE ENTITY] with search, filters, pagination, and a row detail interaction.
- A small insight panel that explains the most meaningful change in plain language.

Interaction and states:
- Filters must visibly change the displayed sample data.
- Add useful loading skeletons, an empty state, and a recoverable error state.
- On mobile, prioritize KPIs and the main trend; move secondary controls into a clear drawer.
- Provide keyboard-visible focus and descriptive labels for chart controls.

Visual direction: [VISUAL DIRECTION]. Use color to communicate status and data, not as decoration. Avoid a wall of identical cards. Use spacing, dividers, typography, and alignment to establish hierarchy.

Finish by checking that totals, percentages, trends, chart labels, and table values are internally consistent.