使い方ガイドへスキップ
power-bi-report-design-consultation作者 GitHub

Power BI Report Design Consultation スキル。

Claude Code と Codex のダイアグラム・チャート向けスキル:Power BI レポートデザイン(チャート選定、レイアウト、可読性、アクセシビリティ)を提供します。

  • Diagrams & Data Visualization
  • Dashboard
github/awesome-copilot · skills/power-bi-report-design-consultation/SKILL.mdSKILL.md
--- name: power-bi-report-design-consultation description: Power BI report visualization design prompt for creating effective, user-friendly, and accessible reports with optimal chart selection and layout design. --- ## Design Consultation Framework ## Visualization Design Process ## Design Review and Validation ## Visualization Recommendations Output
アップストリームファイルから読み取ったフロントマターとセクション見出し(2026-09-14)· 全10,891文字

01 できること

power-bi-report-design-consultation スキルが Claude Code と Codex で行うこと

概要、ワークフロー、出力。いずれもスキルの SKILL.md から読み取った内容です。

SKILL.md より2026年9月14日読取 · 実行記録ではありません

スキル自身の言葉で

Power BI レポート向けのデザイン相談プロンプトで、要件定義からチャート選定、レイアウト、色、タイポグラフィ、インタラクション、モバイル対応デザインまでを一通り進め、最終的に文書化された仕様を作成します。対象は既にデータを持ち、その提示方法を決める必要があるすべての人であり、このファイルはエグゼクティブ、アナリスト、オペレーターという3つの対象者を想定しています。

このファイルを特徴づけているのは、固定された語彙です:目標値を示すバレットチャート、ブリッジ分析のためのウォーターフォール、ステータス遷移を示すステップラインチャート、4.5:1 のコントラスト最低比、7タブの上限、44px のタッチターゲット。最後はコードではなく、ページ単位のデザインテンプレートと4週間の提供計画で締められます。

生成されるもの

  • 目的、対象者、デザイン原則、そして各主要な視覚的選択の根拠をカバーする、文書化された可視化デザインの推奨事項。
  • ヘッダーの KPI カード、主要チャート、補助的なビジュアル、フィルターパネルを備えたダッシュボード概要ページから始まる、ページ単位のビジュアルアーキテクチャ。
  • クロスフィルタリング、ドリルスルー、ナビゲーションフロー、モバイル最適化のアプローチを規定するインタラクションデザインのセクション。
  • モバイル最適化と最終的な仕上げで終わる、4段階の実装計画。
プロンプト例を見る ↗

仕組み

  1. 01
    何かを推奨する前にコンテキストを収集する

    このフレームワークは、ビジネスコンテキスト、データコンテキスト、技術要件をカバーするチェックリストから始まり、チャートに関する提案がまず課題、対象者、意思決定、データ型に基づいて行われるようにします。

  2. 02
    データの関係性に合ったグラフの種類を選ぶ

    チャートは、比較、傾向、構成、分布といった分析上の目的ごとにグループ化され、各グループには適合するチャートの種類が挙げられています。

  3. 03
    対象者に合わせたデザインパターンを選ぶ

    エグゼクティブ向け、分析向け、運用向けのレポートにはそれぞれ密度、インタラクティビティ、更新頻度に関する独自のルールがあり、同じデータでも読み手に応じて異なる方法で提示されます。

  4. 04
    コンテンツを情報アーキテクチャとして整理する

    コンテンツは重要指標、補足情報、詳細分析の順に優先順位付けされ、ナビゲーションとフィルターは最後に配置され、その後ヘッダー+主要インサイト+二次分析というレイアウトに落とし込まれます。

  5. 05
    レビューとユーザーテストで検証する

    成果物が引き渡される前に、品質チェックリストと、時間制限付きタスクおよび数値的な成功基準を伴う5シナリオのユーザビリティプロトコルで、プロセスが締められます。

  6. 06
    出力を仕様書と段階的計画としてパッケージ化する

    推奨事項は、ページ単位のビジュアルアーキテクチャ、インタラクションデザイン、4週間の開発優先リストを備えたデザイン仕様書としてまとめられます。

02 適合性を確認

power-bi-report-design-consultation スキルを使用するタイミング

この種の図表やチャートの作業には、Claude Code または Codex で power-bi-report-design-consultation スキルを使用してください。適用範囲と制限は、スキル自体のファイルに記載されています。

適している場合

  • ドリルダウン機能や期間比較を伴う、複数レベルの詳細度が必要な分析レポートです。
  • 現場で読まれる運用レポートで、モバイル最適化されたステータス駆動のデザインが求められます。
  • スクリーンリーダー対応や代替テキストなど、アクセシビリティを重視した作業です。

境界を知る

  • 密度の高い行列、複雑な散布図、多系列の面グラフ、スモールマルチプルをモバイルレイアウトに配置することです。ファイルではこれらをモバイルで扱いにくいものとして挙げています。
  • 赤と緑の区別だけで意味を表現することです。パレットはカラーブラインドフレンドリーである必要があります。

提供すべきもの

  • ビジネスコンテキストとレポートの目的このスキルは、ビジュアルを提案する前に、ビジネス上の課題、レポートが支える意思決定、重要な業績評価指標(KPI)を確認します。
  • 対象読者と利用シナリオ誰が読むか、どのようにアクセスするかが重要です。エグゼクティブ向け、分析向け、運用向けではパターンが異なり、デスクトップ、モバイル、プレゼンテーションでのアクセスによってレイアウトが変わります。
  • データの説明と主要指標データの種類、量、粒度、階層構造、そして重要な比較や傾向が、チャート選定のステップを左右します。
  • 技術的な制約と要件パフォーマンス上の制約、想定される負荷、モバイル対応の必要性、他レポートとの連携などが、技術要件チェックリストに反映されます。
  • ブランドガイドラインとアクセシビリティ要件ブランドカラーと色の制約がパレットを決定し、アクセシビリティ要件がコントラストと色以外でのコーディング要件を決定します。

03 スキルの内部

power-bi-report-design-consultation スキルが Claude Code と Codex に与えるルール

SKILL.md がエージェントに設定する 8 つの具体的な指示・既定値・制限 — 結果を変える部分です。

  1. テキストコントラストを最低 4.5:1 に保つ

    どの推奨事項も、テキストで最低 4.5:1 のコントラスト比を満たす必要があり、ハイコントラストモードへの対応とスクリーンリーダー向けの代替テキストも求められます。

  2. 円グラフとドーナツグラフのカテゴリ数を 5〜7 に制限する

    円グラフとドーナツグラフは単純な構成比の表示にのみ使用し、ファイルでは5〜7個までという厳格なカテゴリ上限を設けています。

  3. フォントファミリーは最大 2 種類までにする

    タイポグラフィは一貫性を保ちます。レポート全体でフォントファミリーは最大2種類までとし、レポートタイトルの20〜24ptからフッターの9〜10ptまで、要素ごとにサイズとウェイトの範囲が指定されています。

  4. タッチターゲットは最小 44px にする

    ボタンナビゲーションとモバイルレイアウトのいずれも、タッチ操作のために最小44pxのインタラクションターゲットを確保する必要があります。

  5. タブナビゲーションは7個までに抑える

    タブナビゲーションは関連するコンテンツ領域や期間の切り替えに使用し、明確なラベルを付け、最大7タブまでに制限し、アクティブ状態を明確に示します。

  6. 意味を色だけで伝えない

    アクセシビリティ準拠のためには、色を唯一の情報伝達手段にせず、色分けに対してパターンや形状による代替手段を用意する必要があります。

  7. モバイルでは密度の高い行列や表を避ける

    モバイルで扱いにくいビジュアルはモバイルレイアウトから除外されます。モバイルでは、カード型ビジュアル、シンプルなバー、データポイントの少ないライン、そして大きな KPI やゲージビジュアルを優先するようにファイルは方向付けます。

  8. 固定セマンティックカラーを適用する

    色には割り当てられた意味があります。緑 #2E8B57 はポジティブまたは目標達成、赤 #DC143C はネガティブまたは目標未達、青 #4682B4 は中立的な基本指標、オレンジ #FF8C00 は警告、グレー #708090 は非アクティブ状態を表します。

04 実際に使う

Claude Code または Codex に power-bi-report-design-consultation をインストール

npx skills add コマンドを実行し、エージェントで最初のタスクを実行して、結果をチェックリストで確認します。

Claude Code、Codex、または使用中のエージェントに power-bi-report-design-consultation を追加

プロジェクトで実行してください。インストーラーが、どのエージェントに追加するかを尋ねます。

Terminal
npx skills add https://github.com/github/awesome-copilot --skill power-bi-report-design-consultation

skills/power-bi-report-design-consultation/SKILL.md 用の汎用的な skills CLI 形式です。リポジトリによっては独自のパスが記載されている場合があります。

スキルに最初の図表とチャートのタスクを与える

スキル自身の用語で記述されています。角括弧の部分はご自身の内容に置き換えてください。

Starter prompt
We need a quarterly sales dashboard in Power BI for our leadership team. The audience is executives, mostly viewed on desktop but also on mobile during meetings, and it has to meet our accessibility guidelines. The data is order-level with region, a product hierarchy, and monthly revenue against target. Recommend the chart type for each KPI, give us a page-by-page layout, and flag anything that will break on mobile.

出典:SKILL.md をスキル自身の用語に沿って記述。

最初の結果を確認

SKILL.md 自体が正しい結果として示しているもの:

  • 視覚的明瞭性チェックリストを実行してください。階層構造、コントラストと可読性、論理的な視線の流れ、低い認知負荷、適切な余白などを確認します。
  • スクリーンリーダー対応、キーボードナビゲーション、ハイコントラストモード、代替テキスト、色による情報伝達の非依存性を含め、アクセシビリティ準拠を確認してください。
  • 5つの時間制限付きシナリオでテストします。30秒での方向確認、2分での特定情報の検索、5分でのモバイルシミュレーションを含みます。
  • 成功基準に対して測定します。タスク完了率80%以上、インサイトまでの時間2分未満、満足度5点満点中4点以上です。
  • 品質保証を実行してください。視覚的な正確性、ブラウザ間のインタラクションテスト、モバイルデバイステスト、ユーザー受け入れテストなどです。

OpenDesignではpower-bi-report-design-consultationをSKILL.mdリンクからインポートします。Plugins → Add → Skill → Import from link の後、上部バーで選択します。

05 オープンソースで追跡可能

ソース、ライセンス、検証

このページの情報の出所と、最終確認日時です。

Author
GitHub
Repository
github.com/github/awesome-copilot ブランチ main
スキルファイル
skills/power-bi-report-design-consultation/SKILL.md 検証時に記録されたコンテンツチェックサム。コミット 1899b18
License
MIT LICENSE より。
リポジトリスター数
38,981 GitHub スナップショットは 2026-09-14 に取得されたもので、github/awesome-copilot リポジトリ全体を対象としています。このカタログには 6 つのスキルが含まれています。power-bi-report-design-consultation の評価や使用回数ではありません。
OpenDesign により検証済み
2026-09-14 ソースファイル、パス、ライセンステキスト、スター数を確認済み。OpenDesign 本体にはバンドルされていません(2026-08-28 確認)。このページには実行記録がありません。

SKILL.md の中身

  1. デザイン相談フレームワーク助言前に完了すべきビジネス、データ、技術要件のチェックリストです。
  2. チャート選択手法比較、傾向、構成、分布分析ごとに分類されたチャートタイプと、対象者に応じたデザインパターンです。
  3. フェーズ1:情報アーキテクチャ重要な指標からフィルターまでを優先順位付けし、ヘッダーとインサイトのレイアウトに配置します。
  4. フェーズ2:ビジュアルデザイン仕様セマンティックカラーマッピング、アクセシビリティとブランドルール、タイポグラフィのサイズとウェイトのスケールです。
  5. フェーズ3:インタラクティブデザインタブ、ドリルスルー、ボタンのナビゲーションパターンに加え、スライサーとフィルター戦略です。
  6. フェーズ4:モバイルおよびレスポンシブデザインモバイルファーストのレイアウト検討事項と、モバイルに適したビジュアルとそうでないビジュアルの区別です。
  7. デザイン品質チェックリスト公開前に確認すべき視覚的明瞭性、機能的デザイン、アクセシビリティの項目です。
  8. ユーザーテストフレームワーク完了率、インサイトまでの時間、満足度について数値の成功基準を伴う、5つの時間制限付きテストシナリオです。
  9. デザイン仕様テンプレートエグゼクティブサマリー、ページごとの視覚的アーキテクチャ、インタラクションデザインを含む記述形式です。
  10. 実装ガイドライン4週間の開発優先順位、QAチェックリスト、導入率やインサイトまでの時間などの成功指標です。
スキル自身による説明
「効果的でユーザーフレンドリーかつアクセシブルなレポートを作成するための Power BI レポート視覚化デザインプロンプト。最適なチャート選択とレイアウト設計が含まれます。」

SKILL.md のフロントマター説明です。完全なファイルは約 10,891 文字です。GitHub で完全なファイルを読む。

06 インストールする前に

power-bi-report-design-consultation スキルに関する質問

回答は 2026-09-14 時点で読んだ SKILL.md に基づくもので、記録された実行結果によるものではありません。

これは Power BI に特化したものですか、それとも他のツールでも使用できますか?

これは Power BI レポートのビジュアライゼーションデザインのプロンプトとして構成されているため、使用される用語、ビジュアル、インタラクションパターンは Power BI のものです。他の BI ツールや統合機能はファイル内に記載されていません。

Power BI レポートデザインコンサルテーション

実際の図表とチャート作業で power-bi-report-design-consultation を実行

OpenDesign をダウンロードし、SKILL.md リンクから power-bi-report-design-consultation をインポートし、上記のプロンプトを貼り付けて、結果を確認する前にプランを読んでください。

ターミナル
npx skills add https://github.com/github/awesome-copilot --skill power-bi-report-design-consultation

OpenDesign デスクトップ版

ひとつのデザインシステムで、すべての制作物をブランドらしく

完全な Vibe Design Workspace で、同じブランドルールを Web サイト、スライド、操作できるプロトタイプ、ダッシュボード、画像、HTML 動画に展開できます。ローカルの Codex、Claude Code、Cursor などを接続して無料で制作しましょう。

  • Web、スライド、プロトタイプ、ダッシュボード、画像、動画
  • 140+ のデザインシステムと完全なテンプレート/スキルライブラリ
  • ローカル Codex と 21+ のコーディングエージェントを接続 · 無料
無料ダウンロード

macOS と Windows に対応