코딩 에이전트에게 웹 또는 SwiftUI에서 데이터 스크린을위한 수석 제품 디자이너의 맛을 제공합니다. 으로 기술을 구축하는 것을 가르치고, redesign andcritique 분석, 수익 및 메트릭 대시보드: KPI 타일, 차트, 비교 기간, 순위 고장, 날짜 범위 픽업, 필터, 통찰력, 빈 상태, 넓은 전화 레이아웃. 그것은 모든 일을 끝 스크린 샷 QA 패스, 그래서 그것은 코드에있는 것보다 스크린에 어떤 것이 있는지 판단합니다.

**127 배송 대시 화면에서 증류되었습니다 ** (분석 도구, 수익 대시 보드, 디자인 시스템, 디자인 갤러리), 하나의 수익 분석 제품의 전체 눈물 아래로, 그리고 여기에 모든 규칙이있는 실제 재 설계 한 번 깨진, 스크린 샷에 붙잡고 고정.

변경 사항

| 대신 | 에이전트 구축 | |—||| | 각 목록 행 뒤에 주석 구획 | 행의 가장자리를 따라 슬림 3px 몫 막대기 | | 엄선된 타일의 밑줄 | 부드러운 팅필링으로 | 네이티브 21/09/2026 📅 날짜 입력 | 팝업 캘린더: 소프트 밴드, 솔리드 엔드 일, “12 일” + Apply | | 넓은 모니터에 좁은 열 부동 | 화면으로 열을 더해주는 넓은 모드 |

Dashboard Design: a Claude Code skill for clean, honest dashboards

Give your coding agent the taste of a senior product designer for data screens, on the web or in SwiftUI. This skill teaches it to build, redesign and critique analytics, revenue, metrics and admin dashboards: KPI cards, charts, heatmaps, bullet graphs, comparison periods, ranked breakdowns, date range pickers, filters, empty states, wide and phone layouts. Pages that speak for themselves: numbers and shapes on the screen, every explanation in a tooltip. It ends every job with a screenshot QA pass, so it judges what is on the screen rather than what is in the code.

It was distilled from 127 shipped dashboard screens (analytics tools, revenue dashboards, design systems, design galleries), the field’s classics (Stephen Few, Edward Tufte, Cole Nussbaumer Knaflic, Cleveland & McGill, Nielsen Norman Group, the WCAG), six of Apple’s WWDC sessions on charts, chart accessibility and interface writing, two full teardowns, and real redesigns where every rule here was broken once, caught on a screenshot, and fixed.

New in 2.0

• Wordless: a sentence under every KPI and a row of “insights” sentences are gone. Numbers, shapes and one-word baselines on the screen; explanations in tooltips. The QA pass counts sentences; the target is zero.
• Monitor: overview → what needs attention → closer look → act. Problems are flagged on the data itself, and the action sits on the flag (a not-marked heatmap cell is the remind button).
• Perception reference: the encoding ladder, Few’s colour rules, sequential / diverging / classed scales, the inverted-salience trap, bullet graphs, sparklines, WCAG for charts, Few’s thirteen mistakes as a checklist.
• New components: heatmap of number pills with classed tiers, bullet graph, segmented share bar, one tooltip system, people rows that fold on phones instead of truncating.
• Apple’s chart guidance: glance → interactive → expanded with continuity, fixed vs dynamic axes, gridlines at intuitive steps, spoken values context first, audio graphs, colours distinct by name, the words that remain (specific action labels, guiding empty states, errors with a fix).
• QA: a words audit, a salience test (“where does the eye land first?”), real-data and colour-blindness checks, and twelve new smells.
• Case study: a school’s home dashboard in three versions, including the one its owner rejected for being a page of sentences.

What it changes