CtrlK
BlogDocsLog inGet started
Tessl Logo

dashboard-design

Use this skill first when the user wants to design or plan a dashboard, especially Vizro dashboards. Enforces a 3-step workflow (requirements, layout, visualization) before implementation. Activate when the user asks to create, design, or plan a dashboard. For implementation, use the dashboard-build skill after completing Steps 1-3.

91

1.83x
Quality

87%

Does it follow best practices?

Impact

99%

1.83x

Average score across 3 eval scenarios

SecuritybySnyk

Passed

No known issues

SKILL.md
Quality
Evals
Security

Evaluation results

98%

66%

Supply Chain Performance Dashboard — Requirements Phase

Step 1 requirements gathering and spec file generation

Criteria
Without context
With context

spec/ directory created

100%

100%

Spec file present

0%

100%

Dashboard name and purpose

28%

100%

Pages structure

12%

100%

KPI count per page

0%

100%

Data sources documented

42%

100%

Decisions section present

0%

100%

No layout or viz content in Step 1 spec

0%

71%

Multiple pages for user groups

100%

100%

Purpose per page is specific

0%

100%

requirements_summary.md produced

100%

100%

No Step 2/3 output files

100%

100%

KPIs are measurable and actionable

0%

100%

Correct YAML top-level keys

25%

100%

100%

37%

HR Analytics Dashboard — Layout Design Phase

Step 2 layout design, wireframes, and interaction spec

Criteria
Without context
With context

Spec file present

100%

100%

grid_columns is 12

37%

100%

layout_type specified

0%

100%

Page names match Step 1

100%

100%

ASCII wireframe present

100%

100%

Wireframe covers all pages

100%

100%

Wireframe uses standard labels

14%

100%

Time-series chart full-width

100%

100%

Non-time-series charts side-by-side

100%

100%

Global filters in left panel

12%

100%

Container-scoped filters present

57%

100%

filter_placement documented

33%

100%

decisions section present

0%

100%

layout_notes.md produced

100%

100%

100%

32%

E-Commerce Analytics Dashboard — Visualization Design Phase

Step 3 visualization selection and visual design spec

Criteria
Without context
With context

Spec file present

100%

100%

No color_decisions section

100%

100%

kpi_cards section present

100%

100%

kpi_card format fields

62%

100%

No excessive decimal places

0%

100%

Time-series as line chart

100%

100%

Pie chart used only for small categories

100%

100%

Bar for categorical comparison

100%

100%

visualizations list present

33%

100%

needs_custom_implementation field

33%

100%

decisions section present

0%

100%

kpi_card has_reference field

0%

100%

KPI cards not in visualizations

100%

100%

visualization_notes.md produced

100%

100%

Repository
mckinsey/vizro
Evaluated
Agent
Claude Code
Model
Claude Sonnet 4.6

Table of Contents

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.