Microsoftの無料ヒートマップツール「Clarity」とは?設定方法や使用方法、使用上の注意事項についてまとめて記載

2018年にβ版が公開されていた Microsoft の Clarity (クラリティ)が2020年10月29日に一般公開されました。この記事では Clarity に関する基本的な情報や設定方法や使用方法、使用上の注意事項についてまとめて記載しています。

※本記事は2021年1月15日時点の情報をもとに作成した記事であり、今後変更が加えられることによって修正が入る可能性があります

そもそもClarityとは?

そもそも Clarity とはどのようなものでしょうか。公式サイト上では以下のように記載されています。

Clarity is a cutting-edge behavioral analysis tool that helps you understand users interaction with your website. By using Clarity’s robust analysis tools, you can enhance your website for your clients and your business.

What is Clarity?」より引用

原文を翻訳すると次のような形になります。

Clarityは、ユーザーとユーザーのWebサイト利用を理解するのに役立つ最新の行動分析ツールです。 堅牢な分析ツールであるClarityを使用することにより、クライアントとビジネスのためにWebサイトをより強化できます。

What is Clarity?」引用文を PPC-LOG 執筆者訳

また機能面については以下のように言及されています。

・Session Recordings
・Heatmaps
・ML Insights

What is Clarity?」より引用

これは翻訳するまでもありませんが、機能は以下の通りです。

・セッションのレコーディング
・ヒートマップツール
・インサイトダッシュボード

つまり Clarity とは「セッションのレコーディング」「ヒートマップツール」「インサイトダッシュボード」を機能として実装した、ユーザーの Web サイト利用を理解するためのツールです。

Clarityの5つの特徴

これまでにも様々なユーザーの Web サイト利用を理解するためのツールは存在してきましたが、 Clarity ならではの特徴が5つ存在します。その点についても解説していきたいと思います。

1.費用は無料

無料で登録し利用することが可能です。登録自体も簡単で(詳細下記にて記載)1分ほどで登録することが可能です。今後課金プランなどが明示される可能性はあるかもしれませんが、現在は無料で使用することが可能です。

2.セッションのレコーディングに無料ながらも対応

Clarity ならではの魅力はなんと言っても「セッションのレコーディング」に対応し、下記図のように動画として管理画面上で確認可能な点ではないでしょうか

今まで無料ツールでセッションのレコーディングにセッション数無制限で対応してくれていたツールは存在しませんでした。

またユーザーが個人情報などを入力する際にはマスキング(表示されなくなる)が入るようになっている点も大きな特徴です

The sensitive data is masked by default before sending it to Clarity.

訳:機密データは、Clarityに送信する前にデフォルトでマスクされます。

How to mask and unmask the content?」より引用、PPC-LOG執筆者が Google 翻訳を用いて翻訳

テキストのマスキング加減は「Settings」内「Masking」から調整可能です。

マスキングには「Strict」「Balanced」「Relaxed」の3種類が存在しますが「Relaxed」を設定するとテキスト情報がマスキングされなくなります。デフォルトでは「Balanced」に設定されており、機密度の高いテキスト情報だけがマスキングされるように設定されています。「Strict」を設定すると全てのテキストがマスキングされるようになります。

3.セッション数に制限なし

今のところ公式ヘルプ上にセッション数に制限がある記載はありません。小規模なサイトから大規模なサイトまで導入可能なツールになります。

大規模なサイトに関しては既に有料の上位互換となるようなツール(例えばContentsquareなど)を導入しているケースもあるかとは思いますが、有料となると敷居が高く、今まで手が届かなかった方も多かったのではないでしょうか。

「それでもセッションをレコーディングして動画で確認したい」

そんな場合は Clarity がオススメです。Clarity ならセッション数に制限なく、無料で使用し続けることが可能です。費用面で導入が難しかった案件などは早速導入してみてもいいかもしれません。

4.GA(Google Analytics)と連携しデータの受け渡しが可能

2020年11月4日から GA との連携が可能になりました

以下は連携の流れになります。

まずはホームへの「Settings」内「Setup」へと遷移し紐付けを行います。

そして「Setup」でGAの認証、紐付け作業を行っていきます。

Google アカウントのIDを入力していきます。

パスワードを入力し「許可」をクリックします。

最後に使用したい GA を選択し「Active」にすれば完了です。

次に連携後に GAの管理者アカウントの Gmail に「セキュリティ通知」の届く仕様になっているため、そちらの承認作業を行っていきます。そのためクライアントのWebサイトで設定する場合、事前にクライアントに話をしておくことを強くオススメします

「アクティブを確認」をクリックします。

「はい、心当たりがあります」をクリックします。

これで本人確認は完了です。

しばらく時間を置いて GA 側のカスタムディメンションに「Clarity Playback URL」と表示されていれば成功です。

ちなみに 作成されない場合、公式ヘルプによれば以下のことが考えられるそうです

When integrating with Google Analytics, Clarity will attempt to create a custom dimension on your behalf. There are a few reasons this could fail, including a limit on the number of custom dimensions Google enforces per web property. If integrating is unable to complete, try creating a new dimension or editing an unused dimension with the following values:

Name: Clarity Playback URL
Scope: Session
Active: checked

Google Analytics integration」内「FAQ」より引用

以下は訳した内容になります。

Clarityはユーザーの代わりにカスタムディメンションを作成しようとします。これが失敗する理由はいくつかあります。カスタムディメンションの数の制限はその1つです。また作成が完了しない場合、次の値で新規のカスタムディメンションを作成してみてください

Name: Clarity Playback URL
Scope: Session
Active: checked

Google Analytics integration」内「FAQ」引用文を PPC-LOG 執筆者訳(一部引用ママ)

実際に拙ブログ記事を読んだ方からも「連携ができない」とのお声がありましたが…

カスタムディメンションを新規に作成したところ「連携ができた」とのご連絡がありました

もし設定がうまくいかない場合は実施してみることで解消する可能性が高いと思われます。

GA との連携を行うことで GA 側にカスタムディメンションが作られ、イベントヒットが送信されるようになります。そのため既にイベントを設定している場合はイベントの表示が混在することになるため注意が必要です。個人的には GA アプリなどでイベントを日頃確認している場合、少し見にくくなるように思います。

5.データ保有期間も無制限

詳細は確認中ですが、おそらくデータの蓄積に期間的な制限がないものと思われます。管理画面上「 Time frame 」では以下のように最短で本日の数値、最大で直近30日以内の数値、Custome にて期間変更が可能です。 

自分は以前に Contentsquare の操作経験があるメンバーから「レコーディングデータを確認する場合、過去3か月程度データをストックし、1つずつ確認していくことで偏りのないデータ分析が可能になる」との話を伺ったことがあります。早めに設定しておけばデータをストックしておくことができるため、もし導入を検討されているのであれば無料のツールですので早期導入をオススメします。

Clarityの設定方法

まずは重要な初期設定方法についてです。初期設定方法は単純明快です。やり方さえわかれば1〜2分ほどで設定可能です。

手順としては下記の通りです。

  • 公式サイトにアクセス
  • 登録を済ませ情報を入力
  • タグをWebサイトに設置(GTMでの設置可)

以下はそれらの流れを図解したものです。まずは Clarity の公式サイトにアクセスし「Get started」をクリックします。次に今回はGoogleアカウントを用いて登録を行うため「Sing in to Google」をクリックします。

ログインし終えると「New project」と表示されます。Nameには「サイト名」を、Websiteには「URL」を入力していきます。

「Site Category」は以下より選択が可能です。

  • E-Commerce
  • SaaS
  • Blog
  • Marketing
  • Conslting
  • Media
  • Education
  • Community
  • Non-profit
  • other

こちらはサイトの内容に厳密に合致する情報を入力する必要性はないものと思われます。

「Creat」のクリックする前に注意事項が2つあります。

まず現在「New project」で最初に設定した情報を後から更新できない仕様になっています。そのためName、Website、Site categoryを変更したい場合は「New project」の作り直しが必要となります。

そして「Site Category」は選択後に管理画面上では何を選択したのかが確認できない仕様になっています。そのため今後何を選択したのかが確認したくても確認できない可能性が高いため、もし心配であれば何を選択したのかはメモしておくことをオススメします。

「Creat」をクリックすると計測用タグが表示されます。

ここからは計測用タグをサイトに埋め込んでいく作業が発生します。今回はGoogle Tag Manager(GTM)が対応しているため、GTMで設定を進めていきます。

以降の手順は指定のサイトへのGTM設置がなされていることが前提となります。GTMをサイトに導入していない場合、まずはGTMの設定をお願いします。 

Clarity 側で計測用タグを取得した後、GTM 側で設定を進めていきます。ここではわかりやすいように「 Microsoft Clarity 」と名前をつけます(名前は適当でOKです)

タグタイプは「カスタムHTML」でトリガーを選択します。

下記図赤枠内にタグ情報を貼り付けます。

「All Pages」を設定します。

設定後に「公開」を押します。

最終確認画面では「続行」をクリックしてください。

このように割とサクサク設定することが可能です。これで GTM 側での設定は完了です。

下記図赤枠内に「It may take up to two hours.」と記載ある通り通常2時間程度で反映されるようですが、タイミングによっては差があります。

自分の場合、最短で設定後15分ほどでレコーディングされた動画が見れるようになった例もありました。

ちなみに計測できるようになると、直後は下記のような管理画面上の表示がなされるようになります。こちらが「Dashboard(インサイトダッシュボード)」になります。

「Dashboard」以外にも「Recordings(セッションのレコーディング)」「Heatmaps(ヒートマップツール)」などありますが、「Dashboard」がもっとも早くデータが表示されるようになります。また初期設定時に設定した内容は「Settings」からも確認可能です。

「Settings」内「Setup」から計測用のタグを再確認することも可能です。

「Team」からは特定のユーザーへのメールを用いた権限付与が可能です。

Clarity を使用することでできるようになる3つのこと

Clarity を導入しデータを集め分析を行っていくことで下記3つのことができるようになるのではないかと考えられます。

(1)Webサイトのどこをユーザーがどう見ているのかがよくわかるようになる

「セッションのレコーディング」によって記録されたセッションの記録を映像で見ることにより、より具体的にユーザーがWebサイトのどこをユーザーがどう見ているのかが具体的にわかるようになります。

特に重点的に見られているテキストや画像、動画なども視覚的に見えるようになるため、それらをベースにランディングページの改良などを実行可能になります。

(2)わかりやすい素材で他者を説得することが可能に

リテラシーの高くない決裁権者や意思決定者に伝わりやすい、理解しやすい素材を用意することが可能となります。

例えばGAの「ユーザーエクスプローラ」を直接見せるよりも Clarity の「セッションのレコーディング」を直接見せた方がリテラシーに関係なく理解が可能なため、話をスムーズにすることが可能となるはずです。

(3)問題点の明確化、可視化、解釈の余地のない話し合いの場への素材提供

例えば明らかにフォームに問題点がある場合でも議論が事実ではなく、解釈のぶつけ合いになり進展しないことは多々あります。しかし実際にデータを提示することで解釈の余地が生まれない話し合いが可能になります。そのための素材が無料で手に入れられるというのは非常に強力なのではないでしょうか。

Clarity に関する現在上がっている6つのQ&A

今現段階で上がっている Clarity に関する質問を Twitter や社内チャットなどから抽出しました。

(1)セキュリティ面について

2021年1月現在、リリース以降は今の所脆弱性などの指摘はありません。

(2)反映スピードについて

初期設定後の反映スピードは若干個体差のようなものがあるように思います。サイトの規模感などによる影響は殆どないものと思われます。そのため初期設定を行い、2時間待ち数値が一切反映されないようであれば設定ミスを疑いましょう。

(3)レコーディングしたデータの共有方法

レコーディングしたデータの共有方法は今のところありません。Mac であればスクリーンショットと同じように録画することができるのでそれを使うなどすることで可能です。Windows の場合、 Chrome の拡張機能でレコーディングが可能なのでそちらを活用する方法がオススメです。

参照:Google Chrome用スクリーンレコーダー

(4)権限付与について

権限付与が可能です。詳細は下記別記事にて詳しく解説しているのでご参照下さい。

(5)データ保有期間について

記事内に記載した通り無制限です。ただし今後制限に関しては実施されるor発表される可能性があります。今のところ細かく設定可能です。

(6)膨大なレコーディングデータをどのようにMSは管理しているのか

最後にレコーディングされたデータをどう MS が管理しているかについてですが、まずレコーディングされているデータは「単純録画」ではありません。ピクセル単位でのデータのみをレコーディングし( Session Recordings )再生時にレンダリングしているようです。

自分も社内の詳しい方に聞くまで気付きませんでしたが、それ故に動画を単純に撮影するよりもデータ量も少なく、サイトの読み込みスピードにも影響を与えず、サクサク機敏に動くことを可能としているようです。

Clarity を使用する上での3つの注意点について

Clarity を使用する上での注意点が3つあります。その点についても説明していきます。

(1)意図したデータを作り上げてしまう危険性について

「セッションのレコーディング」は非常に明快な故、単純な数値データ以上に人を動かす力を持っています。ただし間違った方向に動かすこともできてしまうことは事前に把握しておく必要性があります。

仮説を立ててデータを確認し事実確認をする際に「仮説」に縛られ、仮説を立証するためのデータ集めをしてしまうということはありがちですが「セッションのレコーディング」はより明快なため、その傾向を強めてしまう危険性があります。

データ分析をする際は多くのデータの中からのランダムなデータ抽出、確認が必要となります。偏った見方は間違った結論を導きかねないので要注意です。

(2)分析をする際は目的を持って明確かつ計画的に

「データ分析をしよう」とするとついダラダラと見れしまうことは多々ありますが、「セッションのレコーディング」はよりその「ダラダラ」を加速させます。サイト内のセッション別の行動履歴はGAの「ユーザーエクスプローラ」などでも確認可能でしたが、実際にユーザーの動きが動画として確認できる「セッションのレコーディング」をつい無目的に見続けてしまう人は多いのではないでしょうか。

そのためもしデータを確認する場合、下記のような形で使用される事をオススメします。

  • 確認するサンプルデータ数を事前に明確化した上で確認
  • 分析対象のページを事前に選定しスポットで分析
  • 目的と時間を明確化の上分析する(例えばフォームページのデータだけをみると決めて30分で実施するなど)

(3)リリース直後の無料ツールであることを正しく理解する

無料ツール故データに過度な期待や性能向上を期待するのは避けるべきでしょう。あくまでも無料ツールですから、使用するのであればありがたく利用しましょう。

最後に

まずは「面白い新しいおもちゃ」として使ってみる感覚が必要かと思われます。商業的にインパクトがあるデータが取れるようになるのに2〜3か月ぐらいは最低でも必要になりますので、早めに設定だけ済ませて年始ぐらいから分析を始めるような形がいいのではないでしょうか。

また特に特定のページに強い課題感を感じているのであれば重点的にスポットでデータをチェックして改良案を考えるといった際にも活用できるのではないでしょうか。

無料でここまで明確なセッションのレコーディングが可能なツールは今までなかったように思います。新しい選択肢が提案されたと思ってありがたく受け入れましょう。