AIでダッシュボード作成する方法|Claudeのアーティファクト活用事例で解説

AIでダッシュボード作成する方法|Claudeのアーティファクト活用事例で解説 生成AI
AIでダッシュボード作成する方法|Claudeのアーティファクト活用事例で解説
  • スプレッドシートで作成したレポートを、手軽に見やすいダッシュボードにしたい
  • AIで作れると聞くけれど、結局どのツールで何をどうやればいいのか分からない

もしあなたがこのように感じているなら、この記事はまさにうってつけです。

この記事では、スプレッドシートで運用しているレポートを、AIエージェントのClaudeに搭載されたアーティファクトでダッシュボードにする方法を解説します。

読み終える頃には、アーティファクトの使い方と、自分のケースならどう活用すればよいかが判断でき、今日のうちに1つ試せる状態になっているはずです。

本記事の概要と必須環境
  • 内容:アーティファクトを活用したダッシュボード作成手順
  • 使用機能:Claudeデスクトップアプリ(アーティファクト)・Googleスプレッドシート
  • 必須環境:Claudeの有料プラン(Pro・Max・Team・Enterprise)※無料プランでは上記機能を用いたスプレッドシート連携ができないためご注意ください。本記事のスプレッドシートの事例では、Google Driveのコネクタが利用できる必要があります。

1. アーティファクト(ライブアーティファクト)とは

アーティファクトとは、AIと対話しながらダッシュボードを作り、Claude上に残して使い続けられる機能です。

Claudeデスクトップアプリの作業画面(Cowork)から利用し、コネクタで接続したデータの更新に応じて中身を作り直せます。

なお、2026年8月19日より前に作成されたものは公式ヘルプ上「ライブアーティファクト」と呼ばれています。以降に作成されたものは「アーティファクト」に統一されているため、本記事でもアーティファクトと表記します。

アーティファクトを使ったAIでのダッシュボード作成のイメージ

アーティファクトの概要イメージ

自然言語で依頼をすると、どう見せるかを考え、画面を組み、修正依頼を受けて作り直すところまでをAIエージェントが引き受けてくれます。

そのため、ソフトやアプリケーションの操作習得も、専門知識も要りません。誰でもダッシュボードを作成できるので、属人性の排除にもつながります。デザインの知識がなくても「こういう見せ方にしたい」と伝えるだけでたたき台が返ってくる、そんなイメージを持っていただくとわかりやすいでしょう。


2. AIでダッシュボード作成した事例|スプレッドシートのマーケティングレポートを変換

すでに集計済みのデータがあるなら、わざわざダッシュボードにしなくても良いのでは、と思う方もいるでしょう。まずは、スプレッドシートがどんな画面になるのかを見てください。

以下のようなマーケティングの集計データをまとめたスプレッドシートがあるとします。

AIでダッシュボード作成する元になるマーケティングレポートの集計スプレッドシート

このような集計シートをもとに、ダッシュボードにしたものが以下になります。

2026年11月 集客チャネルからサービスサイトへの送客フローコーポレートサイト・メディア・ブログ・YouTube・SNS・広告キャンペーンA/Bの7カテゴリから、A・B・Cの3サービスサイトへの送客数と問い合わせ目標達成率を示した図。問い合わせ合計819件で月間目標950件の86.2%を達成。MARKETING SIGNAL BOARD / 2026集客チャネル → サービスサイト 送客フローどのカテゴリの施策が問い合わせにつながっているかを観測する(2026年11月・静止版)1月2月3月4月5月6月7月8月9月10月11月12月問い合わせ目標3サービス / 月次Aサービス問い合わせ数109%218/200(月の目標)Bサービス問い合わせ数80%479/600(月の目標)Cサービス問い合わせ数81%122/150(月の目標)3サービス合計 問い合わせ数86.2%819/950(月の目標)集客チャネル7カテゴリサービスサイト送客先 3サイトコーポレートサイトOWNED / HUB表示回数68,900-16%問い合わせ到達720送客CVR22.26%+52%A 送客4,902B 送客5,623C 送客4,809メディアOWNED表示回数590,103-5%新規ユーザー99,317送客CVR0.07%±0%A 送客120B 送客160C 送客133ブログOWNED表示回数244,275+24%新規ユーザー71,657送客CVR0.36%+3%A 送客290B 送客300C 送客290YouTubeOWNED表示回数31,595-6%高評価1,505送客CVR0.18%+10%A 送客19B 送客18C 送客19SNSOWNED表示回数257,248+77%送客CVR0.29%-9%A 送客245B 送客250C 送客245広告キャンペーンAPAIDClick22,341COST¥2,398,359CPA¥16,772+10%CTR0.64%CV → A143広告キャンペーンBPAIDClick28,157COST¥201,581CPA¥1,626-12%CTR0.44%CV → B124Aサービスサイト達成218問い合わせ数 / 目標200件+60%109%表示回数43,844アクティブユーザー数46,796新規ユーザー数14,029問い合わせCVR(対アクティブ)0.47%Bサービスサイト射程圏479問い合わせ数 / 目標600件+45%80%表示回数75,557アクティブユーザー数45,098新規ユーザー数38,374問い合わせCVR(対アクティブ)1.06%Cサービスサイト射程圏122問い合わせ数 / 目標150件+79%81%表示回数92,585アクティブユーザー数27,265新規ユーザー数1,238問い合わせCVR(対アクティブ)0.45%AI COMMENT11月の傾向と今後の対策CサービスBサービスAサービス線の太さ=送客ボリューム今月の傾向問い合わせ819件(目標比86.2%)。Aサービスは218件で目標200件を初めて超過し、C122件も目標比81%まで到達。効いている施策コーポレートサイトの送客CVRが22.26%へ。広告BはCPA¥1,626・CV124で年間最良。今後の対策広告からCサービスへの導線が未整備。C向けキャンペーンを新設し、コーポレートサイト依存(送客の88%)の分散を進める。

図:上記スプレッドシートを読み込ませて作成した集客チャネル別のダッシュボード(横にスクロールできます)

ダッシュボードにしたことで視覚的にわかりやすくなっただけではなく、「月別の目標達成状況」や「AIによる傾向分析のコメント」といった項目が加わっています。元データを参照したこのような追加項目も、自然言語でAIに伝えるだけで作れます。

同じようなことは他のAIツールでも実現できますが、この記事ではClaudeのアーティファクトを使った作り方を紹介します。


3. アーティファクトを使いダッシュボードを作成する方法

アーティファクトの使い方:操作手順

  1. Claudeデスクトップアプリを開き、左のメニューから「アーティファクト」を選択
  2. 右上の「新規アーティファクト」のボタンを選択

    Claudeデスクトップアプリのアーティファクト画面

    Claudeデスクトップアプリのアーティファクト画面

  3. Coworkのチャット画面に切り替わり、何を作るのかについてAIとの対話が始まります

    コネクタからGoogle Driveのスプレッドシートを選択する画面

    コネクタのGoogle Driveの選択

  4. ここで集計データ(スプレッドシート等)を読み込ませます
    ・スプレッドシートの場合:+ > コネクタ > Google Driveから追加を選択してファイルを選択
  5. どのようなダッシュボードを作成するのかをチャットに記載して送信

作りたいダッシュボードを最初から細かく指示して進めることもできますが、「ダッシュボードを作成してください」とざっくり伝えるだけでも問題ありません。以下の画像のようにAIエージェントが質問してくれるので、案内に沿って中身を考えながら進められます。

AIエージェントからダッシュボードの内容を確認する質問の画面

AIからの質問案内

選択を進めることで作成が始まり、完了後に「公開」を押すと、チャット画面の右側にプレビューが表示されます。

この作成完了時の「公開」ボタンは、WEBに公開されるわけではなく、Claudeのアカウントにアップロードする意味合いになります。この時点では自身のアカウント以外の第三者はアクセスできません。
※プランによって表記が異なるケースがあります。特にPro・MAXプランの方は4章の注意点をご確認ください。
アーティファクトで作成したダッシュボードのプレビュー画面

アーティファクト制作画面 プレビュー表示イメージ

すでに具体的なダッシュボードのイメージがある場合

すでに具体的なイメージがあり、直接テキストで指示をする場合は、以下の項目を押さえて依頼するとAIとのやり取りが少なく済み、すぐに作成をスタートできます。

  • 何のためのダッシュボードか(週次の営業定例で使う、経営会議で使う、など)
  • 表示したい指標(案件数、リード獲得数、チャネル別売上、月次推移など)
  • 見せ方の希望(グラフの種類、色味、1画面に収めるか複数に分けるか)

具体的な記載例

週次の営業定例で使うダッシュボードを作ってください。
添付したスプレッドシートの「案件数」「リード獲得数」「チャネル別売上」を、
月次の推移がわかる形で見せたいです。
色味は自社のコーポレートカラー(青系)を基調にし、
1画面で全体像が把握できるレイアウトにしてください。

2章でお見せしたマーケティングレポートの事例のように、アニメーションについても自然言語で指示するだけで、デザインに反映することが可能です。


4. アーティファクトで作成したダッシュボードの閲覧・共有方法

  1. プレビューの上にある「共有」ボタンをクリック
  2. 表示された画面で、アクセスできるユーザー(Claudeアカウントのユーザー)の追加、アクセスできる人の一覧、公開範囲の設定、共有するデータのバージョン選択ができます。ここでダッシュボードの共有設定を済ませ、「Copy link」をクリックします
  3. コピーしたURLをブラウザで開くと、ダッシュボードが表示されます
アーティファクトの共有設定画面

アーティファクトの共有設定画面

公開範囲について

この設定の公開範囲は、プランによって異なります。
組織のみで共有を行う場合は、TeamかEnterpriseのどちらかのプランである必要があります。

以下がプラン別の公開範囲の一覧になります。

項目 Pro Max Team Enterprise 備考
自分のみ 既定値
組織内の全員 × × 同じ組織にログイン済みのメンバーのみ閲覧可
リンクを知っている全員
(外部公開リンク)
Team・Enterpriseは、組織オーナーが外部共有を有効化した場合のみ選択可

公開・共有する前に確認したい3つの注意点

共有ボタンを押す前に、次の3点を確認してください。

  1. 権限設定を確認する。
    更新を任せる必要のない相手に編集権限を渡していないか、共有前に見直します。
    Pro・Maxプランの「公開」は、リンクを知っていれば誰でも見られる状態になる点に注意してください。
  2. 何が一緒に渡るのかを確認する。作成した時点の数値が画面そのものに書き込まれた状態で渡ることがあります。この場合、閲覧者にスプレッドシートの権限がなくても数字は見えるため、共有先に見せて問題ないデータかを先に確認しましょう。
  3. 共有相手と範囲を明確にする。 リンクを渡す相手を必要な範囲に限定し、万が一リンクが他人に転送・共有されても事故にならないよう仕組みやルールを整えましょう。
データの取り扱いは、渡さずに済む範囲と、実際にどこへ送られるかの両方を押さえてください。ダッシュボード用途では、明細を全部渡さず集計後の数値だけを渡す構成が選べます。ただし渡した数値と生成された画面は、クラウド側のモデルに送られます。顧客の個人情報や未公表の経営数値を扱う場合は、社内のAI利用ルールに沿って可否を確認してから進めてください。

チームへの共有について

Team・Enterpriseのプランで、契約しているアカウントに所属する同一組織のメンバーへ共有する場合。公開範囲の設定は既定値の「Only you」もしくは「Only people with access」のまま、メールアドレスを追加することでダッシュボードを共有できます。

その他のやり方もご紹介します。

先ほどの作成手順に入る前にプロジェクトを作成し、その中でアーティファクトを作成すると、プロジェクト側でアクセスできる人を制限して、特定のメンバー間で共有するURLを作成することも可能です。

※プロジェクトを作成すると聞くと難しそうですが、フォルダを追加するような作業です。

  1. プロジェクトを作成し、可視性を 非公開 にする
  2. プロジェクトの「共有」から、見せたいメンバーを名前かメールアドレスで個別に追加する
  3. そのプロジェクトの中の会話でアーティファクトを作成・公開する
  4. アーティファクトの「コピー」のプルダウンから「アーティファクトの共有」を選択
    ※共有範囲がプロジェクトのアクセス権になる
  5. 表示されたURLを配る
プロジェクトのアクセス権限でアーティファクトを共有する設定画面

プロジェクトのアクセス権限でアーティファクトを共有

この方法は、Team・Enterpriseのプランである必要があります。
プロジェクトを活用した方法については、公式ヘルプには特定メンバーへの共有方法は明記されていないため、実機で確認した挙動をもとに記載しています。

5. アーティファクトで作成したダッシュボードの更新方法

アーティファクト機能にある2つの型

アーティファクトには2つの型があります。

分かれ目になるのは、公開されたページ自身が開いたときにコネクタを呼ぶかどうかです。
コネクタを呼ぶ形になっていれば、公式ヘルプにあるとおり開くたびに最新のデータを取りに行きます。

呼ばない形であれば、作成した時点の数値がページに書き込まれた状態になり、最新にするには作成者が会話で更新を依頼します。

注意したいのは、コネクタからスプレッドシートを選んだだけでは開くたびに最新のデータを取りに行く形にならないことです。

コネクタは、作成時にClaudeがデータを読むための経路としても使われます。公開後の画面がデータを取りに行くようにするには、依頼文でそこまで伝える必要があります。

アーティファクトの2つの型のイメージ図

アーティファクトの2つの型のイメージ図

表にすると次のとおりです。
この記事ではコネクタ接続型・スナップショット型として以降説明します。

項目 コネクタ接続型 スナップショット型
何が違うか 公開されたページ自身が、開いたときにコネクタを呼ぶ 作成時に読み取った数値が、ページに書き込まれている
作り方 コネクタを指定し、あわせて「ページを開いたときにコネクタから読みに行く」ことを依頼文で明示。公開時にコネクタ使用の許可を承認する 「ページを開いたときにコネクタから読みに行く」ことを依頼文で明示せずに作成した場合。コネクタからファイルを選んだ場合も、ファイルを添付した場合も同じ
開いたときの数値 その時点の最新 作成した時点のまま
最新にする方法 開く(強制するならヘッダーの更新ボタン) 作成者が会話で更新を依頼して公開し直す
共有したとき 閲覧者のアクセス権で取得。閲覧者側にもコネクタ接続と許可が必要 誰が開いても作成者が更新した状態のまま。閲覧者側の準備は不要
組織側の前提 「Enable artifact connectors」が有効になっている必要がある 不要

コネクタ接続型にするつもりが、スナップショット型で作成してしまった場合でも、作り直しから始める必要はありません。作成時の会話を開いて、ページを開いたときにコネクタから読みに行く形にしてほしい、と伝えれば切り替えられます。

依頼文の例

Google Driveコネクタの「マーケティングコックピット」を参照するダッシュボードを
作ってください。作成時のデータをHTMLに書き込むのではなく、ページを開いたときに
コネクタ経由でスプレッドシートを読みに行く形にしてください。
データが取得できない場合は、必要なコネクタ名を画面に表示してください。

ただし組織の管理設定でアーティファクトからのコネクタ利用が無効になっている場合は、この型を選べません。下記のチェックリストを先に確認してください。

コネクタ接続型を利用するチェックリスト

役割 確認すること
組織管理者 「Enable artifact connectors」がONになっていること(Team・Enterprise)
作成者 依頼文で「ページを開いたときにコネクタから取りに行く」ことまで明示すること
作成者 公開時に出る許可のダイアログで、使うコネクタとツールを承認すること
閲覧者 自分のClaudeアカウントでGoogle Driveのコネクタが接続されていること
閲覧者 参照元スプレッドシートの閲覧権限を持っていること
閲覧者 初回に表示されるコネクタ使用の許可を承認すること(選択は保存されます)

スナップショット型でダッシュボードを更新する場合

データ元は、作成時に読み込ませたスプレッドシートのファイルです。
スナップショット型の場合参照元のスプレッドシートが更新されたら自動的にダッシュボードの内容が変わる、というものではありません。

最新の数値を見たいときは、同じ会話を開いてチャット欄で「データを更新してください」と指示すれば、同じ見た目のまま数字だけ差し替えられます。

手順は以下です。

作成者

  1. アーティファクトの一覧から、作成したダッシュボードを選択します。左のチャット履歴から作成時の会話を開いても、プレビューの閲覧と続きの指示を再開できます
  2. チャット欄で数値の更新を依頼する
  3. 反映が完了したときに出てくる「公開」ボタンをクリックする

閲覧者

  1. 共有されたURLを開く
  2. 作成者が更新して公開した時点の数値が表示される
    ※すでに画面を開いたままの場合は、ページを再読み込みすると新しい版に切り替わります
プロジェクトで共有しているアーティファクトの場合は、プレビューに反映したあとでリンクを共有する必要があります。

コネクタ接続型でダッシュボードを更新する場合

アクセスした閲覧者がダッシュボードを表示した時点で最新のデータになります。
データ元は同じスプレッドシートですが、取りに行くのは閲覧者側のアカウントです。

手順は以下です。

作成者

  1. スプレッドシートを更新する
  2. アーティファクトを開く
    アーティファクトの一覧から、作成したダッシュボードを選択。
    もしくは左のチャット履歴から作成時の会話を開いても、同様です。
  3. 数値が最新になっていることを確認する
    ※反映されていなければ、ヘッダーの更新ボタンを押す

閲覧者

  1. 共有されたURLを開く。
  2. コネクタ使用の許可を承認する(初回のみ)
  3. 最新の数値が表示される
    ※必要なら、ヘッダーの更新ボタンを押す
コネクタでデータ元に接続したアーティファクトの場合、公式ヘルプ「Coworkでライブアーティファクトを使用する」には「開くたびに接続されたアプリから新しいデータをプルします(独自のアクセスに基づいて)」と記載されています。

データ集計から自動化したダッシュボードを作成する方法

リアルタイムで「今の数字をいつでも見たい」という要望に応えるなら、データを取りに行く仕組みごと作ることになります。データ元はスプレッドシートではなく、GA4などの外部サービスのAPI(外部サービスからデータを受け取るための窓口)です。

進め方は次の順序になります。

  1. 取得する指標の項目名と型を確定する
  2. GA4のAPIを叩いて必要な指標を取得するPythonスクリプトを用意する
  3. 画面のたたき台を作る
    アーティファクトで作成したHTMLをダウンロードする、もしくはClaude Designで作成する
  4. 実装をClaude Codeに引き渡し、スクリプトが吐き出すデータ構造を画面に流し込む

画面から作り始めると、取得できない指標が後で判明して作り直しになります。そのため項目の確定を先に置きます。

Claude Designにはエクスポート機能があり、その選択肢の1つとしてClaude Codeへの引き渡し(ローカルのコーディングエージェント、またはClaude Code Web)が用意されています。

ここまでの2つの型と違って、データ取得と公開先の用意が必要になるため、情報システム部門やエンジニアと組んで進める前提の作り方です。

ダッシュボードのデザインやレイアウトのアップデートを頻繁に行う場合は、修正反映までの工程が増えます。その場合は、アーティファクトを活用してClaudeアカウント内で共有する運用が手軽かと思います。

MCPサーバーを使えば、データ取得のコードを自作せずに済む場合がある
データ取得のPythonスクリプトは、MCPサーバー(AIツールと外部サービスをつなぐ共通規格の窓口。Model Context Protocolの略)で代替できる場合があります。すでに公開されているMCPサーバーで必要な指標がそろえば、取得部分のコードを書かずに進められます。そろわなければ自社でサーバーを用意することになるため、何のデータを見たいかで進め方が変わります。

よくある質問(Q&A)

Q. スプレッドシートの数式やフィルタは、そのまま反映されますか?

A. 数式そのものが移るのではなく、計算された後の値が読み込まれる形になります。

シートで組んだ合計や達成率は、その結果の数字がダッシュボードに載ります。一方で、表示上のフィルタや条件付き書式は引き継がれません。特定の条件で絞った状態を見せたい場合は、ダッシュボードを作るときに「どの条件で絞るか」を言葉で伝えるか、絞り込んだシートをあらかじめ用意しておくと確実です。

Q. 部署ごとに見せる数字を変えることはできますか?

A. できます。ただし方法が2通りあり、意味が違います。

ひとつは、元のスプレッドシート側を部署ごとに分けて閲覧権限を設定する方法です。公式ヘルプに「共有されたアーティファクトは、あなたのアクセスではなく、閲覧者のアクセスを使用します」とあるとおり、権限のない人にはその数字が表示されません。

もうひとつは、ダッシュボード側に部署を切り替える表示を付ける方法です。ただしこちらは見た目を絞っているだけで、データそのものは画面に読み込まれています。見せたくない数字がある場合は、前者を選んでください。

Q. 元のスプレッドシートの列を増やしたら、ダッシュボードは壊れますか?

A. 列を末尾に足すだけであれば、既存の表示はそのまま保たれるケースが多いです。追加した列を画面にも載せたい場合は、作成時の会話に戻って追加を依頼します。

注意したいのは、列名を変えたり並び順を入れ替えたりしたときです。ダッシュボードが参照している項目を見つけられず、その部分が表示されなくなることがあります。継続して使う予定であれば、列は末尾に足す、列名は変えない、という2点を最初に決めておくと運用が安定します。

Q. 作った人が退職・異動したら、ダッシュボードはどうなりますか?

A. アーティファクトは作成者のアカウントに保存されます。1人が作って1人だけが持っている状態は、そのまま引き継ぎのリスクになります。

打てる手は3つあります。Team・Enterpriseのプランであれば、共有の設定で編集できるメンバーを複数にしておくこと。参照元のスプレッドシートを個人のドライブではなく共有ドライブに置くこと。そして、どんな依頼文で作ったかを残しておくことです。3つ目は地味ですが、作り直しが必要になったときに一番効きます。

Q. 同じダッシュボードを、毎月の定例資料としてPDFや画像で配れますか?

A. 画面をPDFや画像にすること自体は、ブラウザの印刷機能やスクリーンショットで対応できます。ですが、もし定例資料として配るなら、その月の数値を固定した別の資料を用意するほうが向いています。

コネクタで接続したダッシュボードは開くたびに最新のデータを取りに行くため、会議のあとに同じURLを開くと数字が変わっていることがあるためです。記録として残す資料と、常に最新を見るダッシュボードは、分けて持つ形をおすすめします。


まとめ

スプレッドシートが手元にあり、アーティファクトが使える状態であれば、ダッシュボードはその日のうちに作れます。専用のツールを導入したり、集計の仕組みを組み直したりする必要はありません。まずは3章の手順で、いま見ているシートをダッシュボードにしてみると、どこまで自動化したいのかが見えてくるでしょう。

ダッシュボードを使い始めると、次に出てくるのは、GA4のような外部データをどうつなぐか、集計の土台をどこに持つか、という話です。

FLINTERSはシステム開発を手がける会社として、外部サービスとのデータ連携やデータ基盤の構築、そしてClaude Codeを使った開発の知見を蓄積してきました。画面を作る前のデータ設計から相談したい方、Claude Codeでの実装まで含めて任せたい方は、ぜひご相談ください。

Claude Code CTA
CTAボタン
タイトルとURLをコピーしました