dashboard-creator

Design and build KPI dashboards with charts, filters, and verified data states.

55|41|Updated Aug 9, 2026
One-click install
npx skills add https://github.com/Rylaispirit/rylai-codex-hermes-skills --skill dashboard-creator-rylaispirit
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: dashboard-creator
Source: https://github.com/Rylaispirit/rylai-codex-hermes-skills/tree/main/skills/dashboard-creator
Command: npx skills add https://github.com/Rylaispirit/rylai-codex-hermes-skills --skill dashboard-creator-rylaispirit

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Building dashboards that people actually trust and use requires more than dropping charts on a page: metrics need precise definitions, data states need handling, and layouts need verification across viewports. This Skill provides a structured workflow for designing, implementing, and validating operational dashboards. ## Core Features & Use Cases - Metric Contract Definition: Establish exact definitions, units, sources, refresh times, baselines, and missing-data states for every KPI before building. - Chart and Layout Guidance: Choose the right visual form (line, bar, scatter, distribution, table, progress) and organize information hierarchy for scanning and comparison. - State and Accessibility Verification: Implement loading, empty, error, stale, and permission-limited states, then verify responsive layout, keyboard access, contrast, and calculation accuracy. - Use Case: A product team needs an operations dashboard showing weekly active users, error rates, and deployment status. Use this Skill to define each metric, build the dashboard within the existing project's design system, and validate it against real data including zero and missing values. ## Quick Start Use the dashboard-creator skill to build a KPI dashboard for our support ticket metrics, reusing the project's existing components and verifying the layout on desktop and mobile.

Frequently Asked Questions about dashboard-creator

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a KPI dashboard for my project?▼

Start by defining a metric contract for each KPI: exact definition, unit, source, refresh time, and comparison baseline. Then reuse your project's existing components and design tokens, place decision-critical KPIs first, and verify the result against real data including edge cases.

Which chart type should I use for dashboard metrics?▼

Use line charts for change over time, bar charts for category comparison, scatter plots for relationships or outliers, distribution charts for spread, tables for exact values and dense comparison, and progress indicators for bounded completion against a known target.

Can this dashboard approach work with my existing design system?▼

Yes. The workflow explicitly reuses the repository's framework, components, tokens, and data-access patterns rather than introducing new dependencies. For standalone deliverables, it selects the smallest format that supports the required interaction.

How do I handle missing or stale data in a dashboard?▼

Define states for missing, delayed, partial, and invalid data in the metric contract upfront. Implement loading, empty, error, stale, and permission-limited states that preserve layout, and never invent values to make a screen look complete.

What should I verify before shipping a dashboard?▼

Test realistic long labels, zero, negative, and missing values across desktop and mobile widths. Confirm keyboard access, focus visibility, contrast, non-color status cues, and validate all calculations against the source data while inspecting for clipping and layout shift.