ダッシュボードを刷新(第2弾)— 管理メニュー集約・全サイト横断のA/Bテスト一覧・表示速度改善

ヒートマップエックス エンジニアチーム5分で読了
  • dashboard
  • performance
  • ab-testing

2026-07-01、HeatMapX のダッシュボード(heatmapx.com/dashboard)を第2弾としてアップデートしました。6月の全面リニューアルに続き、今回は「毎日の運用をシンプルに、そして速く」をテーマに、メニュー構成・一覧表示・表示速度をまとめて改善しています。

主な変更点

⚙ 「管理」メニューを新設

サイドバーに 「管理」セクション を新しく設けました。これまでメニュー内に混在していた プラン&請求設定 を「管理」の下にまとめ、日々よく使う機能(ヒートマップ・A/Bテスト)と、たまにしか触らない管理系をはっきり分けています。

  • よく使う機能が上、管理系は「管理」の下、という自然な並びに整理
  • あわせて「今後実装予定」という表記を 「今後リリース予定」 に変更(開発中の機能がひと目で分かるように)

▤ A/Bテスト一覧を全サイト横断で表示

これまでは A/Bテスト一覧を見るのに、まず対象サイトを選ぶ必要がありました。今回、サイト選択を廃止し、登録している全サイトの実験を1画面にまとめて表示 するようにしました。

  • どのサイトの実験も1つの一覧で見渡せる
  • 一覧に サイト名の列 を追加し、どのサイトの実験かがすぐ分かる
  • 「サイトを指定しないと出てこない実験がある」という分かりにくさを解消

🔗 ヒートマップ一覧のサイト名をクリックで開けるように

ヒートマップ一覧の サイト名をそのままリンク にしました。常時オレンジ色で表示し、カーソルを合わせると下線が出るので、「押せる」ことがひと目で分かります。一覧から目的のサイトへワンクリックで移動できます。

🆔 設定に「アカウントID」を表示

設定画面に アカウントID(アカウント識別子の先頭8桁・一部マスク表示)を追加しました。サポートへお問い合わせいただく際に、この ID をお伝えいただくとお客様の特定がスムーズになります。表示専用で、変更や外部への影響はありません。

◻ フラットデザイン化を開始

ダッシュボード全体を、より見やすくノイズの少ない フラットデザイン へ段階的に寄せていきます。第一歩として、入力欄の影(ドロップシャドウ)を除去 しました。今後も視覚ノイズを減らし、情報が読み取りやすい画面へと調整を続けます。

👣 既存ユーザーのホームにも「はじめの3ステップ」

これまで新規のお客様だけに表示していた 「はじめの3ステップ」 を、既存のお客様のホーム画面にも 折りたたみ形式 で表示するようにしました。普段は畳まれているので邪魔にならず、設置方法を見返したいときにいつでも開けます。

⚡ 表示速度の改善

画面の切り替え時に感じる待ち時間を大きく短縮しました。

  • 配信リージョンを東京に固定:これまでダッシュボードの処理が米国リージョンで実行され、データベース(東京)との間で毎回太平洋を往復していました。処理を 東京リージョンに固定 し、往復の遅延を解消しています。
  • ホーム画面の集計を並列取得:ホームに表示する各種の集計を、順番待ちの直列処理から 同時並行での取得 に変更しました。

この2点により、社内計測ではホーム画面の表示時間が 数秒から 0.2 秒前後 まで短縮されています。キャッシュ(一時保存)に頼らず処理そのものを速くしているため、表示されるデータは常に最新 です。

影響範囲

今回の変更は ダッシュボードの UI・表示・表示速度 に関するもので、計測ロジック・データ構造・API には影響しません。既存の埋め込みトラッカータグはそのまま動作し、計測中のデータにも影響はありません。

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

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