Download - Ptengineヒートマップの読み解き方
![Page 1: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/1.jpg)
Ptengineヒートマップの読み解き方
株式会社 PtmindVer. 1.1
![Page 2: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/2.jpg)
2
プロローグ
シンプルな事例
![Page 3: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/3.jpg)
(1) ヒートマップからユーザーの動向を読み取る際の考え方、推測の仕方など②
成果を上げた事例:シューズ EC
3出所: http://www.eye-brain.jp/blog/rakuten-heatmap/
トップページの直帰率が―20%ポイントと大きく低下
![Page 4: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/4.jpg)
4
左の事例だと、ファーストビューで大きな割合を占めるスライドバナーはそれほどクリックされておらず、下にスクロールした所にある「メンズスニーカー」などの商品カテゴリバナーはよくクリックされています。
また、ファーストビューから1スクロールした人は僅か31%と、殆どの人が離脱していることがわかります。
ユーザーの31%がこのラインに到達
スライドバナー
商品カテゴリーバナー
![Page 5: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/5.jpg)
5
そこで、スライダーを取り払って商品カテゴリバナーを上に持ってきてみました。また、クリックの多いカテゴリを優先して上に置くようにしてみました。
ファーストビューからのスクロール数は 34%とあまり変わっていませんが、検索ボタンや商品カテゴリのクリック数が大きく増えています。
この結果、トップページの直帰率は― 20ポイントと大きく下降しました。
ユーザーの34%がこのラインに到達
![Page 6: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/6.jpg)
6
よく見られている(よく使われている)コンテンツが下にある
![Page 7: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/7.jpg)
7
出店ショップ事例
![Page 8: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/8.jpg)
8
セレクトショップスマホ向けトップページ
「週間レビューランキング」
1ページを2分割してあります
![Page 9: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/9.jpg)
9
アパレルPC向け
トップページ「Now Hit! リアルタイム売れ筋アイテム」
![Page 10: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/10.jpg)
10
アクリル加工PC向け
トップページ「カテゴリー別おすすめアイテム」
![Page 11: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/11.jpg)
11
楽天以外のショップ事例
![Page 12: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/12.jpg)
よく見られている「 NEW」の上にあまり見られていないエリア。
ヒートマップから見えるファクト アパレル
「 NEW」12
EC
![Page 13: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/13.jpg)
よく見られている「特選ギフトセット」のスクロール到達率は47%。
ヒートマップから見えるファクト 食品
「特選ギフトセット」
13
EC
![Page 14: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/14.jpg)
よくクリックされているリンクの場所のスクロール到達率が 10%未満(同じリンクはページ上部には無い(ハンバーガーメニューも無い))
ヒートマップから見えるファクト アパレル
新着商品一覧
オススメ商品一覧
14
EC
![Page 15: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/15.jpg)
ケース
6 よくクリックされている「テーブルウェア」のリンク。スクロール到達率が 23%前後。
ヒートマップから見えるファクト アクセサリー
テーブルウェア
15
EC
![Page 16: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/16.jpg)
16
ユーザーの興味・関心を把握する
Part 1
![Page 17: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/17.jpg)
ヒートマップの分析方法分譲マンション 物件サイト事例
17
![Page 18: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/18.jpg)
ケース 1東京都文京区 高級物件
18
![Page 19: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/19.jpg)
19
交通アクセス
マンション物件サイト「周辺環境」のページ
Q. 「交通アクセス」以外でじっくり見られているのは?
??
PC向けサイト
![Page 20: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/20.jpg)
20
交通アクセス
マンション物件サイト「周辺環境」のページ
A. 「教育」「子育て」
![Page 21: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/21.jpg)
ケース 2東京都杉並区シングルマザーに人気の物件
21
![Page 22: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/22.jpg)
22
A. じっくり見られているのは?
?
PC向けサイト
![Page 23: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/23.jpg)
23
A. 物件から近いスーパーの情報
イトーヨーカドー サミット
![Page 24: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/24.jpg)
ケース 3横浜市中区めったに出ない駅近希少物件
24
![Page 25: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/25.jpg)
25
Q. スクロールを止めて見ているユーザーが多いのは?
?
Smart Phone向けサイト
![Page 26: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/26.jpg)
26
A. 「プロジェクトストーリー」 希少物件が実現した物語
プロジェクトストーリー
![Page 27: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/27.jpg)
たとえば今回の分譲マンションの分野では、アテンションヒートマップでユーザーの興味関心の知見をためていくと・・・
27
このように
![Page 28: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/28.jpg)
ユーザーの興味関心のデータの蓄積があります!↓コンペで優位に立てる
28
分譲マンション専門のウェブ制作会社では
![Page 29: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/29.jpg)
ターゲット購買層を想定した「外さない」マンションサイトを発注↓機会損失を防ぐ
29
マンションデベロッパーウェブ管理部門では
![Page 30: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/30.jpg)
30
ユーザーの興味・関心を把握する
Part 2
![Page 31: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/31.jpg)
31
「 AI の浸透」「技術の発展と社会への影響」はここまで到達したユーザーにしっかり見られている。「 AI が今後社会にどう影響を与えていくのか」、詳しく知りたいと考えている読者が多いと推測される。=このような注目エリアは、今後 執筆される記事のテーマの 参考になる可能性がある。
アテンションヒートマップじっくり読まれている箇所から次の記事のヒントを得るメディア
![Page 32: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/32.jpg)
32
クリックヒートマップ
【 1】 【 2】 【 3】 【 1】
【 2】
【 3】【アテンションヒートマップの活用】長いページは、その時々の後半のアテンションに注目。
長いページになると後半のアテンションの色は、ブルー、透明になりがちです。その中で、ユーザーがスクロールを止めた位置が水色、緑色、黄色等になります。日々更新されていくページでは、その時々で、ユーザーがスクロールを止めている位置を見ることで、ユーザーが注目しているコミックを知る手掛かりになります。
電子書籍販売
![Page 33: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/33.jpg)
33
「導入実績はこちら」を見せるのが遅すぎないか?
ヒートマップから見えるファクト 経理ソフト
BtoB
![Page 34: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/34.jpg)
34
データ連携の話を先にするべきか?
ヒートマップから見えるファクト 経理ソフト
データ連携の説明
「お客様の声」
「事例を見る」
BtoB
![Page 35: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/35.jpg)
35
ユーザーの関心事を、アテンションヒートマップから知る
ヒートマップから見えるファクト 経理ソフト
はじめて会計ソフトを使うので、無料版では不安です。
サポート面では「丁寧なマニュアル」「使い方がよくわかる動画」「よくある質問集」も利用できます。
BtoB
![Page 36: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/36.jpg)
36
集中力が途切れた理由を推測する
![Page 37: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/37.jpg)
37
アテンションの流れが変わる地点エステ
格安で体験できるコースを紹介するLP 。7万円、9万円のコース紹介が掲載されて以降の場所は、アテンションがあまり集まっていません。
![Page 38: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/38.jpg)
38
ユーザービリティとナビゲーションの改善に
役立てる
![Page 39: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/39.jpg)
39
旅館
![Page 40: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/40.jpg)
40
【課題】リンク先に何があるかを分かりやすく示す
2016年春・夏ウェア&グローブのニューモデルをご紹介します。
【課題】 「 2016 SPRING & SUMMER 」のバナーは、ファーストビューに近く、ユーザーの視界に入りやすい位置にありながら、あまりクリックされていません。その原因の一つは、 「 2016 SPRING &SUMMER 」という表記しかないために、リンク先にどんなコンテンツがあるのか、ユーザーにとって分かりにくいという点にあります。
【改善案】 「 2016 SPRING & SUMMER 」のバナーは、洗練されたデザインである一方、「リンクの先に何があるか分かりにくい」という点においては、導線として、誘導力が弱いと言えます。左の改善例のように、バナーのデザインを損なわないようにしつつも、リンク先にどんなコンテンツがあるのかを具体的に示した方が、よくクリックされるようになります。
改善案
バイク用品・バイクパーツ
![Page 41: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/41.jpg)
41
【課題】よく使われる導線を上へ
スクロール到達率11 %
【課題】 「部品情報検索(パーツカタログ)」はよくクリックされていますが、スクロール到達率 11% の所に設置してあり、よく使われる導線としては、設置されている位置が下になってしまっています。【改善案】 よく使われる導線は探さなくても視界に入ってくる位置に置くことで、ユーザーはリンクを探す時間を節約することができます。「関連コンテンツ」は、右サイドメニューの「キャンペーン」の上に持って行くことをおすすめします。
「キャンペーン」
ボート
![Page 42: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/42.jpg)
42
メディア等「読ませる系コンテンツ」で
知見をためる
![Page 43: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/43.jpg)
43
クリックヒートマップ本文終了地点のスクロール到達率 15 %
記事の本文の最後まで読んだのは何%?
メディア
![Page 44: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/44.jpg)
44
クリックヒートマップ本文終了地点のスクロール到達率 26 %
記事の本文の最後まで読んだのは何%?
メディア
![Page 45: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/45.jpg)
45
クリックヒートマップ
記事のインデックスがよくクリックされている。この記事を読んだことで、関連記事を読みたいというモチベーションが高まったことが表れている。
連載記事の場合、読み終わった後の、バックナンバーのリンクのクリックに注目メディア
![Page 46: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/46.jpg)
46
LPの評価
![Page 47: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/47.jpg)
ファーストビューを過ぎると、スクロール到達率が、 100% → 69% → 55% と低下していく。
ヒートマップから見えるファクト コスメ
47
EC
![Page 48: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/48.jpg)
48
ユーザーの行動を把握する
![Page 49: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/49.jpg)
動きがあるバナーがクリックされていない
ヒートマップから見えるファクト アウトドア
画像が次々切り替わるエリアだけクリックが少ない
49
EC
![Page 50: Ptengineヒートマップの読み解き方](https://reader031.vdocuments.pub/reader031/viewer/2022022200/58abb5291a28ab04618b4f19/html5/thumbnails/50.jpg)
50