Claude Codeの/datavizスキルとは？
グラフ・ダッシュボード設計を自動化
チャートの種類選びから配色、色覚多様性への配慮まで。データ可視化の「お作法」をClaude Codeに任せる方法を解説します。
Claude Code v2.1.198で追加された/datavizは、チャート・グラフ・ダッシュボードの設計ガイダンスを提供するスキルです。「なんとなく棒グラフにする」「なんとなく赤と緑を使う」を卒業し、データの性質に合った可視化を自動で組み立ててくれます。
/datavizスキルでできること
公式の説明によると、このスキルは以下を行います。
- データに適したチャート形式の選定：Claudeがデータの性質を見て、適切なチャートの種類を選ぶ
- 役割に応じた配色の割り当て：カテゴリの区別・数値の強弱など、色の「役割」に応じて配色を設計
- パレットの検証：バンドルされたスクリプトで、色覚多様性への配慮とコントラストを自動検証
- マーク・インタラクション・アクセシビリティのルール適用：グラフの要素表現や操作性、アクセシビリティに関するルールを適用
配色はブランドニュートラルな仮パレット
デフォルトでは特定のブランドに寄らない中立的なプレースホルダーパレットが使われます。自社のブランドカラーに合わせたい場合は、生成後に置き換える前提の設計になっています。
使い方
基本の呼び出し方
/dataviz 月次売上を部門別に比較する棒グラフを作りたいリクエストの内容に応じて、Claudeがチャートの種類・配色・レイアウトを設計しながら実装します。データ可視化ライブラリ（Chart.js、D3.js、Rechartsなど）と組み合わせて、実際に動くグラフとして出力させることも可能です。
なぜ「チャート選び」が重要なのか
データ可視化でありがちな失敗は、データの性質と表現方法が噛み合っていないケースです。/datavizが意識している可視化の基本原則を踏まえておくと、Claudeへの指示もより的確になります。
| データの性質 | 適したチャート | 避けるべき表現 |
|---|---|---|
| 時系列の推移 | 折れ線グラフ | 要素数の多い円グラフ |
| カテゴリ間の比較 | 棒グラフ | 3D装飾を加えた棒グラフ（比較を歪める） |
| 全体に対する構成比 | 積み上げ棒グラフ・ドーナツ | 要素数の多い円グラフ（判読困難） |
| 2変数の相関 | 散布図 | 棒グラフでの無理な表現 |
色覚多様性への配慮
このスキルが検証する「色覚多様性への配慮」は、赤緑色覚異常など、特定の色の組み合わせが区別しづらいユーザーへの配慮です。バンドルされた検証スクリプトが、パレット内の色同士が十分なコントラストを持っているか、色覚特性によって区別できなくなる組み合わせがないかを自動チェックします。
「赤字は赤、黒字は緑」は避けたい典型例
赤と緑の組み合わせは、色覚多様性の観点から最も注意が必要な配色の一つです。色だけでなく、アイコンや数値の符号（+/-）など、色以外の手がかりも併用する設計が推奨されます。/datavizはこうした観点も踏まえてパレットを検証します。
ダッシュボード設計への応用
単発のグラフだけでなく、複数の指標を並べるダッシュボードの設計にも使えます。指標同士の関連性や優先度に応じて、レイアウト・強調の仕方を整理させることができます。
ダッシュボード設計の依頼例
/dataviz 売上・新規顧客数・解約率の3指標を並べた
月次KPIダッシュボードのレイアウトを設計して利用条件
- Claude Code v2.1.198以降が必要です
- 他の多くのバンドルスキル同様、
/datavizと明示的に呼び出すほか、グラフ・チャート関連の依頼をした際にClaudeが自動的にこのスキルを使うこともあります
よくある質問
Q. 特定のグラフライブラリを指定できますか？
A. できます。「Chart.jsで」「Rechartsを使って」のようにライブラリを指定すれば、そのライブラリのAPIに沿った実装になります。指定がない場合、プロジェクトの既存の依存関係や慣習からClaudeが妥当なものを選びます。
Q. 既存のブランドカラーを最初から使わせることはできますか？
A. できます。プロンプトでブランドカラーのカラーコードを伝えれば、そのパレットをベースに役割ごとの配色を組み立てます。デフォルトの中立パレットは、指定がない場合の出発点です。
Q. PowerPoint資料の中のグラフにも使えますか？
A. /dataviz自体はWebやアプリ向けのチャート設計ガイダンスです。PowerPoint資料の生成はpptxスキルが担当しますが、資料内のグラフの配色原則という点では考え方に重なりがあります。
まとめ
本記事のポイント
/datavizはチャート・ダッシュボードの設計ガイダンスを提供するバンドルスキル（v2.1.198以降）- データの性質に応じたチャート形式の自動選定と、役割ベースの配色設計を行う
- バンドルスクリプトによる色覚多様性・コントラストの自動検証が組み込まれている
- 配色はブランドニュートラルな仮パレットが初期値。自社カラーへの置き換えが前提
「とりあえず棒グラフ」から一歩進んで、データの性質に合った可視化を選びたい場面で試してみてください。社内ダッシュボードやレポートのグラフ作成から使い始めるのがおすすめです。
※本記事の情報は2026年7月時点のものです。仕様は変更される可能性があります。
