본문으로 건너뛰기
cccskills
무료GitHub에 공개

dashboard-designer

Design clear, actionable dashboards with KPI hierarchy, data visualization best practices, and layout patterns.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

설치 방법 보기

포함된 파일(1)

  • SKILL.md4.5 KB

SKILL.md(원문)

설치하기 전에 에이전트에게 전달되는 지시 내용을 확인할 수 있습니다.

Overview

Dashboards fail in two directions: data vomit (everything, understood by no one) or data decoration (pretty charts, zero decisions). A great dashboard answers specific questions for specific people and drives action. This skill covers dashboard UX: defining the questions, structuring KPI hierarchy, choosing visualizations, and designing for scanability and action.

When to use

  • Designing analytics dashboards, admin panels, or reporting interfaces

  • Improving an existing dashboard nobody uses

  • Choosing KPIs and metrics for a product or business view

  • Designing data-dense interfaces for operators or executives

  • Planning dashboard personalization or alerting

Core concepts

      • Question-first design. Every dashboard starts with: who uses it, what decisions do they make, what questions must it answer in under 30 seconds? A dashboard without defined questions is a junk drawer.
      • KPI hierarchy. 3-5 headline KPIs (the numbers that matter most), supporting trends, then diagnostic detail. The inverted pyramid: summary first, drill-down on demand. Nobody should scroll to find the headline.
      • Actionability test. For every widget ask: "if this number moves, does the user know what to do?" If not, it's decoration — cut it or add the context that makes it actionable (targets, thresholds, comparisons).
      • Comparison is comprehension. Numbers need context: vs last period, vs target, vs benchmark. A lone number ("4,203") means nothing; "4,203 (↑12% vs target 3,800)" means something.
      • Right visualization, minimal ink. Line for trends, bar for comparisons, sparklines for compact trends, tables for precise values. Remove gridlines, 3D, and decoration — maximize data-ink ratio.
      • Progressive detail. Overview → filtered view → row-level detail. Don't cram the atomic data into the overview; provide drill paths. Dashboards are maps, not territories.

Practical workflow

      1. Interview the users. What decisions do they make weekly? What do they check first? What surprises them? What do they export to spreadsheets (that's the dashboard failing)?
      1. Define the question set. 5-10 specific questions the dashboard must answer. Prioritize: the 3 that get asked daily go above the fold.
      1. Select KPIs ruthlessly. For each candidate metric: is it actionable, is it trusted (data quality!), does someone own it? Aim for 3-5 headline KPIs; everything else is supporting.
      1. Sketch the layout. KPI band on top (big numbers with deltas), trend visualizations middle, detailed tables/breakdowns below. Group by question, not by data source.
      1. Design visualizations. Choose chart types by message, apply consistent scales (never truncate axes to exaggerate), use color sparingly (highlight the signal, gray the context), add targets and thresholds.
      1. Add interactivity deliberately. Filters (date range, segment), drill-downs, and hover details — but keep the default view answering the top questions with zero interaction. Most users never touch filters.
      1. Validate with real data. Test with production-scale data (not 5 perfect rows): long labels, missing values, outliers, timezone issues. Then usability-test: can users answer the 5 questions in under a minute?

Common pitfalls

      • The executive Christmas tree. 40 widgets because every stakeholder wanted "their number." Dashboards serve decisions, not egos — curate or create separate views.
      • Vanity metrics. Totals that only go up (total users ever) instead of actionable rates (weekly active, conversion). If it can't go down, it can't inform.
      • No targets or context. Numbers floating without comparison. Always show: vs previous period, vs target, or vs benchmark — preferably all three where relevant.
      • Chart junk. 3D pies, gauge charts, excessive color. Every non-data pixel is a tax on comprehension.
      • Stale or untrusted data. A dashboard with wrong data is worse than none — it destroys trust permanently. Show data freshness timestamps; fix quality before adding widgets.
      • One dashboard for everyone. Executives, operators, and analysts need different views. A single dashboard serving all three serves none. Build role-specific views on shared components.

리뷰

아직 리뷰가 없습니다. 사용해 본 소감을 남겨 주세요.

댓글

로그인 없이 쓸 수 있습니다. 사용 후기, 질문, 작동하지 않은 환경 등을 편하게 남겨 주세요.

아직 댓글이 없습니다. 첫 댓글을 남겨 보세요.

보내면 바로 공개됩니다. 이메일 주소나 전화번호 같은 개인 정보는 쓰지 마세요. URL은 2개까지입니다.

0 / 1,000자

이 양식은 reCAPTCHA로 보호되며 Google 개인정보처리방침 및 서비스 약관이 적용됩니다.

같은 저장소의 스킬

Master 1Password: vaults, Watchtower, passkeys, SSH agent, CLI, and family/team administration. Use when getting full value from 1Password personally or administering it for others.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

aicodedecode/awesome-muse-skills282026년 10월 10일 업데이트

Create 3D visuals with modeling, texturing, lighting, rendering, and optimization for web and product.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

aicodedecode/awesome-muse-skills282026년 10월 10일 업데이트

Create 3D web experiences: scene setup, models, materials, lighting, animation, scroll-driven scenes, and performance budgets. Use when adding 3D to websites beyond basic demos.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

aicodedecode/awesome-muse-skills282026년 10월 10일 업데이트

Writing abstracts that get papers read — structured content, the 5-sentence core, and journal-specific constraints.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

aicodedecode/awesome-muse-skills282026년 10월 10일 업데이트

Learn effectively from courses and academies: choosing programs, studying actively, and converting courses into skills. Use when investing time/money in structured learning.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

aicodedecode/awesome-muse-skills282026년 10월 10일 업데이트

Audit designs for accessibility with WCAG checklists covering color, type, focus, motion, and content.

한국어 요약은 준비 중입니다. 원문 설명을 표시하고 있습니다.

aicodedecode/awesome-muse-skills282026년 10월 10일 업데이트

aicodedecode의 스킬 모두 보기

이 스킬의 문제 신고