Toolverse
All skills
UX / Design

dashboard-design

by mckinsey

USE THIS SKILL FIRST when user wants to create and design a dashboard, ESPECIALLY Vizro dashboards. This skill enforces a 3-step workflow (requirements, layout, visualization) that must be followed before implementation. For implementation and testing, use the dashboard-build

Installation

Pick a client and clone the repository into its skills directory.

Installation

Quick info

Author
mckinsey
Category
UX / Design
Views
3
GitHub repo

About this skill

USE THIS SKILL FIRST when user wants to create and design a dashboard, ESPECIALLY Vizro dashboards. This skill enforces a 3-step workflow (requirements, layout, visualization) that must be followed before implementation. For implementation and testing, use the dashboard-build skill after completing Steps 1-3.

How to use

  1. Zainstaluj skill dashboard-design jako MCP server lub agent skill w swoim środowisku Claude/Copilot.

  2. Uruchom skill, gdy użytkownik chce stworzyć dashboard. Skill automatycznie prowadzi przez trzy obowiązkowe kroki – nie można ich pominąć ani zmienić kolejności.

  3. Krok 1 (Wymagania): Zdefiniuj dla kogo jest dashboard, jakie cele ma spełniać i jakie decyzje zostały podjęte. Skill zadaje pytania z numerowanymi opcjami zamiast długich tekstów – wybierz odpowiedź, aby przejść dalej.

  4. Krok 2 (Układ i interakcje): Stwórz wireframy, określ gdzie będą filtry i jak użytkownik będzie nawigować. Skill ponownie używa pytań wielokrotnego wyboru, aby uniknąć zamieszania.

  5. Krok 3 (Wizualizacje): Wybierz typy wykresów, kolory i kluczowe wskaźniki (KPI). Skill pomaga wybrać najlepsze reprezentacje danych na podstawie wcześniejszych decyzji.

  6. Po ukończeniu wszystkich trzech kroków skopiuj checklist postępu i przejdź do skill dashboard-build – tam implementujesz i testujesz rzeczywisty dashboard. Jeśli masz już część pracy (np. wireframy), skill rozpozna to i zacznie od właściwego kroku, ale zawsze waliduje poprzednie decyzje.

Related skills

content-trend-researcher

by alirezarezvani

Advanced content and topic research skill that analyzes trends across Google Analytics, Google Trends, Substack, Medium, Reddit, LinkedIn, X, blogs, podcasts, and YouTube to generate data-driven article outlines based on user intent analysis

UX / Design
20116

motion-graphics

by rohitg00

Kinetic typography, logo animations, and stylized motion design skill.\n\n**Triggers when:**\n- User wants text animations or kinetic typography\n- Request involves logo reveals or title sequences\n- Content focuses on visual impact over education\n- User mentions \

UX / Design
2126

ui-ux-designer

by sickn33

Create interface designs, wireframes, and design systems. Masters user research, accessibility standards, and modern design tools. Specializes in design tokens, component libraries, and inclusive design. Use PROACTIVELY for design systems, user flows, or interface optimization.

UX / Design
1949

3d-graphics

by samhvw8

3D web graphics with Three.js (WebGL/WebGPU). Capabilities: scenes, cameras, geometries, materials, lights, animations, model loading (GLTF/FBX), PBR materials, shadows, post-processing (bloom, SSAO, SSR), custom shaders, instancing, LOD, physics, VR/XR. Actions: create, build,

UX / Design
2595

writing-rap-lyrics

by asvskartheek

Helps write rap lyrics with proper rhythm, flow, cadences, and structure. Teaches musical fundamentals (bars, beats, tempo, BPM) and lyric formatting. Use when writing rap lyrics, creating verses, understanding flow, structuring bars, improving cadence, learning rhythm patterns,

UX / Design
21102

mermaid

by iOfficeAI

Render Mermaid diagrams as SVG or ASCII art using beautiful-mermaid. Use when users need to create flowcharts, sequence diagrams, state diagrams, class diagrams, or ER diagrams. Supports both graphical SVG output and terminal-friendly ASCII/Unicode output.

UX / Design
1881