ClaudeにヒートマップをつなぐMCP設定ガイド(1分・コマンド1行)

ヒートマップエックス エンジニアチーム6分で読了
  • how-to
  • mcp
  • claude
  • ai
  • integration

この記事の要約

  • HeatMapXはMCP(AIにツールを接続する標準規格)に対応。全プラン無料
  • 接続は「APIキー発行 → コマンド1行」の2ステップ・約1分
  • つなぐと、Claudeとの会話の中でヒートマップ・ページ集計・A/Bテスト結果を直接参照できる

「ヒートマップを見る→数字をコピー→AIに貼って相談」——この往復、面倒ですよね。MCP接続をすると、Claudeが自分でHeatMapXのデータを取りに行くようになり、会話だけで分析が完結します。

MCPとは

MCP(Model Context Protocol)は、ClaudeなどのAIアシスタントに外部ツールを差し込むための共通規格です。コンセントの規格のようなもので、一度つなげば、AIは必要なときに自分でデータを取得します。

claude.ai / Claude Desktop からつなぐ(いちばん簡単・3クリック)

ブラウザのclaude.aiやClaude Desktopなら、コマンドもAPIキーも不要です:

  1. claude.aiの 設定 → コネクタ →「カスタムコネクタを追加」 を開く
  2. 名前に「HeatMapX」、URLに https://heatmapx.com/api/mcp を入力して追加 →「連携させる」
  3. HeatMapXのログイン→同意画面が開くので、内容(読み取り/A/Bテストの作成・開始・停止/サイト登録)を確認して「許可する」

これだけで接続完了。あとはチャットで「スクロールが浅いページは?」と聞くだけです。接続はいつでも HeatMapXの 設定 → 接続済みアプリ から解除できます。

Claude Code(ターミナル)からつなぐ(2ステップ)

1. APIキーを発行する

HeatMapXダッシュボードの 設定 → APIキー で「新しいキーを発行」を押します。キーは発行時に一度だけ表示されるので、その場でコピーしてください。

2. コマンドを1行実行する

ターミナルで以下を実行します(YOUR_API_KEY をコピーしたキーに置き換え):

claude mcp add --transport http heatmapx https://heatmapx.com/api/mcp --header "Authorization: Bearer YOUR_API_KEY"

これで完了です。Claude Codeを再起動(または新しい会話を開始)すると、HeatMapXのツールが使えるようになっています。

何ができるか(活用例)

接続後は、こんな質問がそのまま通ります:

  • サイト一覧を見せて」→ 登録サイトとURLが返る
  • kpop-ticket.com でスクロールが一番浅いページは?」→ ページ別集計から特定
  • /pricing のヒートマップを要約して」→ クリックの集中場所・スクロール到達率
  • A/Bテストの結果は?もう勝者を出していい?」→ バリアント別の成績と統計的な勝者提案

数字の取得はHeatMapX、解釈と提案はClaude。それぞれの得意分野の分業です。

読むだけじゃない:A/Bテストの作成・配信もできます

書き込み権限つきで接続すると、会話だけでここまでできます:

  • INGOLのトップで、ボタン文言2案のA/Bテストを作って」→ 下書きが完成
  • 開始して」→ Claudeが実験の内容を要約して必ず確認してきます →「OK」で配信開始
  • もう止めて」→ 同じく確認のうえ停止

安全のための設計:

  • 作成は必ず下書きから(勝手に配信は始まらない)
  • 開始・停止はあなたの承諾なしには実行されない二段階方式
  • 削除はできません(取り返しのつかない操作は提供しない)
  • 権限は接続時の同意画面に明示され、いつでも「設定 → 接続済みアプリ」で解除可能

使えるツール一覧

ツール 内容
list_sites 登録サイトの一覧
get_page_stats ページ別のセッション・クリック・平均スクロール
get_heatmap_summary 特定ページのヒートマップ集計(期間指定可)
list_experiments A/Bテストの一覧
get_experiment_results バリアント別成績・改善率・勝者提案

読み取り5種に加えて、書き込み5種(create_site / create_experiment / start・pause・stop_experiment)があります。書き込みは同意画面で明示的に許可した接続のみ・開始/停止は実行前に必ず確認が挟まります。

つながらないときのチェックポイント

  • APIキーの貼り間違いhmx_live_ で始まる文字列全体を貼っているか
  • キーを失効させていないか:設定 → APIキーで有効なキーが残っているか確認

料金

MCP接続は全プランで無料です(連打防止の常識的な制限のみ)。ヒートマップもA/Bテストも、Claudeから。ぜひお試しください。

Claude Codeから動かすヒートマップを、まずは無料で。

計測タグを1行貼って、ブラウザ操作なしで分析・改善提案までCLIから受け取れます。クレカ不要・30秒でセットアップ。