ユーザーにとってわかりやすく使いやすいデザインを作るためには、どのように使われているか、サービス内でのユーザーの行動の把握は不可欠です。Google Analyticsは多くのサービスで導入されていて、タップ数やダウンロード数などのイベントも簡単に計測することもできます。

今回は、より効果のあるデザインを作るために、私が普段よく行っているGoogle Analyticsの活用方法を紹介します。なお、導入方法や、Google Analyticsの画面の説明などは、都合上割愛します[1]⁠。

見ておきたいユーザーデータ

ユーザーインタビューやユーザー調査は、個々のユーザーの嗜好や行動について深くインプットするために効果的ですが、Google Analyticsなどを用いて広範囲でざっくりとしたサービスの利用状況を得ることもまた効果的です。まず、必ず一度は目を通しておくべきいくつかの項目を紹介します。

スマートフォン、タブレット、PCの内訳

どの種類のデバイスでアクセスしているか把握できる。スマートフォンファーストなサービスが増えているなか、ちゃんと実態を数値で理解することで、どのデバイスに力を入れるべきか身を持って感じておく

画面解像度

使われているデバイスのサイズを把握できる。開発者は最新のスマーフォンでサービスを使っていることがほとんどだが、ユーザーはそうとも限らない。できる限り利用者が多い解像度でデザインを確認する

集客概要、参照サイト

どこからユーザーが訪れているか把握できる。Webサービスの場合、検索経由か、SNS（Social Networking Service）か、直接かアクセス元を知ることで、何の目的で訪れているかわかりやすくなる。集客元によってはユーザーのリテラシーなども想像できるかもしれない

行動概要

どのページが見られているか把握できる。自分たちが思っているようにユーザーが使っていないケースもよくある。たとえばWebサイトのトップページが一番多く見られていると思い、時間をかけてデザインしたくなる。しかし、実際はトップよりもほかのページのほうが多く見られていることもあるため、実際に多く見られている画面を把握し優先順位の参考にする

タップ数を計測して仮説検証をする

Google Analyticsでは、イベントトラッキングを使うことでタップ数などを計測できます。計測する場合、何のために計測するのか、どういった仮説があるのかを、あらかじめ明確にしておくことが大切です。タップ数は取れるようになっても、調べたいことが検証できず、改善に活用できないようでは本末転倒です。

今回は架空の書籍販売サイトのトップページを想定した例（図1）をもとに、普段私がやっている手順を紹介します。

どういう仮説があって何を検証するか

仮に図1のデザインをこれからリリースし、タップ数をもとに改善すること考えると、以下の3つのような仮説が考えられます。

• ❶ 画面上部のファーストビューに入る要素（おすすめ、ランキング）がよくタップされる
• ❷ カルーセルは、見えていないところはほとんどタップされない
• ❸ 開発者が多く使っているという事前情報があるため、WEB+DB PRESSは多くタップされるだろう

これらの仮説がちゃんと検証できるよう計測する必要があります。

どのように定義するか

タップ数をイベントトラッキングで計測するには、以下の3種類を定義します。以下は私がよく利用するパターンです。

イベントカテゴリ

タップされる要素が含まれる大きな枠組みで、エリアごとに分けるのがお勧め。今回の場合は「Recommend」「⁠Ranking」「⁠Web+DB_list」にあたる

イベントアクション

ユーザーがどのようなアクションをしたか。一般的には「Tap」「⁠Click」などとするが、今回は何番目かを計測したいため「Tap_N」（⁠Nには項目の番号が数字で入る）とし、要素の位置も含めてみる

イベントラベル

何のコンテンツかや何のラベルかわかるようにする。今回であれば「WEB+DB PRESS」「⁠リアルサイズ古生物図鑑」「⁠音声UX」など　上記の定義を図1に行ったものが図2になります。

実際のデータを見て仮説が正しかったか考える

図3は、計測開始後しばらくしてからの架空のタップ数だとします。計測期間はサービスの特徴にもよりますが、アクセス数が曜日などで変化する場合は1週間、月末月初などに影響がある場合は1ヵ月を目安に考えるようにします。

それでは、この計測結果を見て仮説が正しかったか、間違っていたか判断できるか見ていきます。

まず❶の仮説を検証するには、各コーナーの合計タップ数が比較するため、イベントカテゴリを見ることが有用です（図3（a）⁠）⁠。「⁠Recommend」と「Ranking」は「WEB+DB_List」に比べてよくタップされています。しかし、「⁠Recommend」は「Ranking」よりもページ上部の良い位置にありますが、「⁠Ranking」のほうがタップされています。イベントラベルで具体的に何がタップされているのか見る必要がありそうですが、ランキングがコーナーとして魅力なのか、それとも高い位置より少し下のほうがよくタップされるのか、位置を変えて再検証をすることでさらに理解が深まりそうです。

次に❷の仮説を検証するためにイベントアクションを見てみましょう（図3（b）⁠）⁠。「⁠Recommend」は1と2、3、4でタップ差が大きいこと、「⁠Ranking」は3以降の数字が低いことから、仮説は正しいと言えそうです。この場合、ランキングはカルーセルをやめて、画面にすべて見えるデザインにしたほうがトータルのタップ数が多くなる可能性が考えられます。

最後に❸の仮説を見るためにイベントラベルを見てみます（図3（c）⁠）⁠。「⁠WEB+DB PRESS」は表示件数が多いため、足すと多くなりますが、❷の検証で確認したイベントアクションではRankingの2番目、そしてイベントラベルでも「音声UX」がよくタップされていることがわかります。このことから、開発者向けのコンテンツでもエンジニアではなくデザイナー向けのコンテンツを多く出すほうがユーザーに刺さりが良くなるかもしれないという新しい仮説を立てることができます。

このように、あらかじめ仮説を立てておき、それらを判断するための計測を行うことで、より効果的なデザインへのきっかけになります。

今回はより良いUIデザインを作るため、Google Analyticsの活用方法を紹介しました。「⁠データ分析ができるようになりたい、それをデザインに活かしたい」と考える方も少なくないと感じています。分析力を付けていくためには、まず数値をちゃんと取得して、日々それをしっかりと観察する。そして、そこから得られる事実を正しく読み取ることを心がけましょう。

本誌最新号をチェック！
WEB+DB PRESS Vol.130

2022年8月24日発売
B5判／168ページ
定価1,628円
（本体1,480円＋税10%）
ISBN978-4-297-13000-8

• 特集1
  イミュータブルデータモデルで始める
  実践データモデリング
  業務の複雑さをシンプルに表現！
• 特集2
  いまはじめるFlutter
  iOS/Android両対応アプリを開発してみよう
• 特集3
  作って学ぶWeb3
  ブロックチェーン、スマートコントラクト、NFT