ドラッグ&ドロップのビルダーではなく、説明からダッシュボードを

Open Design でのダッシュボードの流れ

1. 01

   指標を説明する

   大切なものを挙げます。「週間アクティブユーザー、プラン別の収益、解約率、30日間のトレンド」のように。エージェントがダッシュボードスキルを読み込み、一塊のテキストではなく、KPI カード、チャート、テーブルをレイアウトすべきだと理解します。

2. 02

   チャートのパターンを選ぶ

   Open Design はチャートとレイアウトのテンプレートを備えているので、トレンドは折れ線グラフに、内訳は棒グラフに、比率は適切なビジュアルになります。ちぐはぐなデフォルトではなく、一貫したタイポグラフィと余白が全体を通ります。

3. 03

   データをつなぐ

   ダッシュボードを CSV や JSON エンドポイントに向けるか、サンプル行を貼り付けます。データが変わると更新される自己完結した HTML にレンダリングされ、どのブラウザでも開け、どの静的ホストにも置けます。

4. 04

   磨いて出荷する

   エージェントと話して調整します。「収益を地域別にまとめて、KPI 行を一番上に移して」のように。成果物がプロジェクト内にあるので、ダッシュボードは他のコードと同じようにレビューでき、バージョン管理されます。

Open Design でのダッシュボード vs これまでのやり方

プロンプトとデータソースからレンダリングされた本物のダッシュボード。自分に近いものから始め、追跡している指標を説明してください。

ダッシュボードテンプレートを見る →

ダッシュボード FAQ

1. 01 Tableau や Looker のような BI ツールは必要ですか？ +

   いいえ。Open Design はコーディングエージェントの中でダッシュボードを HTML にレンダリングします。指標を説明してデータに向けるだけで、ライセンスや習得が必要な別の BI プラットフォームはありません。

2. 02 データはどこから来ますか？ +

   CSV、JSON エンドポイント、または貼り付けた行から。ダッシュボードはプレーンな HTML と JavaScript なので、どこから読むかを正確に自分で制御できます。ホストされたサービスを経由するものは何もありません。

3. 03 技術者でないチームメンバーも見られますか？ +

   はい。出力は自己完結した Web ページです。リンクやファイルがあれば誰でもブラウザで開けます。アカウントもシートも不要です。

4. 04 どのエージェントを使えますか？ +

   Claude Code、Codex、Cursor Agent、Gemini CLI、その他10種以上のファーストパーティアダプター。プロバイダーの鍵は自分で持ち込みます。