AGENT SKILL

data-visualization

Select chart types and design data encodings — marks, axes, labels, and accessible chart styling. Use when presenting data graphically. Owns chart selection and encoding only; the categorical colour ramp itself belongs to `color-system`.

License 许可
MIT
最近更新
2026-11-04
Stars
★ 0
Forks
0

01 前言 Front Matter

name
data-visualization
description
Select chart types and design data encodings — marks, axes, labels, and accessible chart styling. Use when presenting data graphically. Owns chart selection and encoding only; the categorical colour ramp itself belongs to `color-system`.
disable-model-invocation
true

02 资源文件 3

03 SKILL.md 正文

Data Visualization

You are an expert in designing clear, accessible, and informative data visualizations.

What You Do

You design data visualizations that communicate insights effectively using appropriate chart types and styling.

Chart Selection

Comparison

Bar charts (categorical), grouped bars (multi-series), bullet charts (target vs actual).

Trend Over Time

Line charts (continuous), area charts (volume), sparklines (inline).

Part of Whole

Pie/donut (few categories), stacked bar (many categories), treemap (hierarchical).

Distribution

Histogram, box plot, scatter plot.

Relationship

Scatter plot, bubble chart, heat map.

Design Principles

  • Data-ink ratio: maximize data, minimize decoration
  • Clear axis labels and legends
  • Consistent color encoding across views
  • Start y-axis at zero for bar charts
  • Use annotation to highlight key insights

Color in Data Viz

  • Sequential: light to dark for ordered data
  • Diverging: two-hue scale for above/below midpoint
  • Categorical: distinct hues for unrelated categories
  • Colorblind-safe palettes (avoid red-green only)

Accessibility

  • Don't rely on color alone — use patterns, labels, or shapes
  • Provide text alternatives for charts
  • Keyboard navigable interactive charts
  • Sufficient contrast for data elements

Responsive Data Viz

  • Simplify at small sizes (fewer data points, larger labels)
  • Consider alternative views for mobile (table instead of chart)
  • Touch-friendly tooltips and interactions

Best Practices

  • Choose the simplest chart that communicates the insight
  • Label directly on the chart when possible (avoid legends)
  • Provide context (benchmarks, targets, trends)
  • Test with real data, not idealized samples
  • Allow users to explore details on demand

04 同仓库更多 Skills

jorgesolerrr
jorgesolerrr/skills

explainroo

Make an explainer video (MP4) with a voice-over using explainroo. The voice is made on this computer and no API key is needed. Use when the user asks for an explainer, how-to, walkthrough, launch or tutorial video, an animated diagram with a voice-over, or a short for YouTube, Reels or TikTok.

★ 0
jorgesolerrr
jorgesolerrr/skills

unslop

Cut AI tells from prose a human will read. Use when drafting or editing docs, READMEs, PR descriptions, commit messages, emails or posts, or when the user says unslop or "sounds like AI".

★ 0
jorgesolerrr
jorgesolerrr/skills

technical-writing

Layered technical-writing standard (Diátaxis, Google style, STE, Global English) for docs, RFCs, READMEs, PR descriptions and commit messages.

★ 0
jorgesolerrr
jorgesolerrr/skills

no-comments

Spawn Comment Sicko, fix accepted findings, and offer encodings for claimed constraints.

★ 0
jorgesolerrr
jorgesolerrr/skills

ponytail

Lazy senior dev mode: the smallest change that fully solves the task, and a reply a busy human understands in one read. Use on any coding task (writing, fixing, refactoring, reviewing, choosing dependencies) and when the user says "ponytail", "be lazy", "simplest solution", "yagni", or complains about over-engineering or bloat. Levels: lite, full (default), ultra.

★ 0
jorgesolerrr
jorgesolerrr/skills

ponytail-review

Quality review of a change: is the logic right, is it safe, does it hold under real load, is risky code tested, is it fast enough, and is every line needed. Reads the connected code, not only the diff. Each finding is explained in plain English. Use for "review this", "code review", "review the last commit", "review my PR", "is this over-engineered", /ponytail-review.

★ 0