読者です 読者をやめる 読者になる 読者になる

ハウテレビジョン開発者ブログ

『外資就活ドットコム』を日夜開発している技術陣がプログラミングネタ・業務改善ネタ・よしなしごとについて記していきます。

ユーザーの行動パターンをグラフで視覚化する方法

はじめに

データアナリストのn_maoです。

BtoCなWEBサイトやスマホアプリ、リアル店舗の小売業など多くのビジネスでは、ユーザー行動を正しく分析することで、継続率や売上げの向上につながる重要な示唆を得ることが可能です

ユーザー行動分析の中で、あるページからあるページへの遷移確率を算出したり、特定のユーザー群(例えば、多くのお金を払ってくれるユーザー達)に特徴的に見られる行動パターンなどを列挙することがあります。

しかし、多くのWEBサイトでは大量のページやアクションが存在し、それらの組み合わせ(パターン)となるとさらに膨大な数となるため、全てのユーザーの全行動を視覚的に把握するのは困難です。

意味のある分析を行うためには、「適切な課題設定」「欲しい結果を得るためのデータの加工・抽出」「適切な解析手法の選択」「解釈を行いやすいような視覚化」など、様々な工夫が必要となります。

今回はその中でも、行動パターンの視覚化を行う方法に焦点を当て、私が良く使うグラフ表現方法の基本形をまとめてみました

次節以降で順に見ていきます。

有向グラフによる視覚化

ページ間の遷移は、順序関係をもつ系列データのため、有向グラフによる視覚化が可能です。

有向グラフとしてはSankey Diagramネットワークグラフの2種類の手法を紹介します。

Sankey Diagram

シンプルな例を、Google chartを利用して描いてみました。

図1. ページ遷移を視覚化したSankey Diagramの例

f:id:n_mao:20150928121727p:plain

図1では、ノードが1ページを表し、エッジの太さで遷移頻度を表しています。

Sankey Diagramは、ページ遷移の様子をとてもシンプルに表現できる良い手法です。

Google Analytics(GA)でも行動フローとして利用されていますね。

ただし、この図はループやサイクルがないことに注意してください。

つまり、A -> AやA -> B -> Aのような遷移は表現できません。

また、ノードの位置が同じだからといって、特に意味はありません。

図ではAとFが同位置に描かれていますが、これは同じグループに属しているとか何かしらの順序が同じという意味ではなく、 配置上都合が良かっただけです。

綺麗に揃っていることで誤解を招きやすいので注意してください。

GAの行動フローは(おそらく)この辺りの特徴を踏まえ、セッション開始からの遷移数という情報を与えるという工夫を行っています。

図2. GAの行動フローの例

f:id:n_mao:20150925224450p:plain

GAの行動フローでは、ノードの位置と、セッションからの遷移数を合わせています。

この図で最も注目してほしいポイントは、この図のハイライトされたルートを辿っていくと、2番目の接点の位置に「/」が再度登場していることです。

また、最初の通過地点に「/archives」があるにもかかわらず、2番目の接点にも3番目の接点にも「/archives」があります。

Sankey Diagramはサイクルが表現できないはずなのに、なぜこんなことが起こるのでしょうか。

おそらく、グラフを生成する際、同じページでもセッション開始からの遷移数が違えば別のものとして区別しているのでしょう。

つまりこの図では、「/archives」からの遷移の全体像ではなく、あくまでセッション開始から1遷移後の「/archives」からの遷移といった、部分的な情報であることに気をつけて解釈してください

※部分的な情報だから悪だというわけではないです。目的に応じて正しく利用し、正しく解釈しましょう。

ネットワークグラフ

ループやサイクルを含む行動パターンを視覚化したい場合には、以下のようなネットワークグラフで表現すると良いでしょう。

以下の全ての図はgraphvizを利用して描いています。

図3. ネットワークグラフの例

f:id:n_mao:20150928190441p:plain

エッジの向きは遷移の向き、エッジの太さは遷移数を表しています。

サイクルがある分、Sankey Diagramより少しごちゃごちゃしていますね。

ページの階層構造など、何かでグルーピングできる場合は、位置を揃えてあげると見やすいです。

図4. 階層を揃えたネットワークグラフの例

f:id:n_mao:20150928190305p:plain

味気ないので色もつけましょう。

図5. 色もつけたネットワークグラフの例

f:id:n_mao:20150928211526p:plain

これで見やすくなりました。

この図はGAとは異なり、セッション開始から何遷移目かといった情報は無く、(対象データの)すべてのページ遷移の傾向を確認することが可能となります。

ただし、Sankey Diagramでもネットワークグラフでも、長さ3以上のパターンの表現は難しいです。

例えば図4では、「/」から「コラム一覧」への遷移数と、「コラム一覧」から「コラムA」への遷移数はそれぞれ確認できますが、「/」から「コラム一覧」へ遷移し、かつその後「コラムA」に遷移した数は表現できません。

解決策としては、エッジを分けたり、非連結グラフにすることが考えられますが、その場合グラフサイズを小さくしないと複雑になりすぎるのでおすすめできません。

何か良い方法ないでしょうか?

無向グラフによる視覚化

ページの遷移は順序を持っていますが、必ずしも順序を考慮した方が良いわけではなく、順序情報を除いた方が良いケースも多々あります

そういった場合は無向グラフで表現しましょう。

以下ではネットワークグラフ二部グラフの場合の表現方法、そしてクラスやノードの影響力などを考慮した少し高度なグラフ表現方法について述べます。

ネットワークグラフ

まずはネットワークグラフです。

図6. ネットワークグラフの例

f:id:n_mao:20150928192413p:plain

有向グラフの場合と同様、階層を揃え、コンテンツカテゴリーで色分けしています。

上図では有向グラフと違い、サイクルは集約された1本のエッジになっています。

向きがないことでさっぱりしましたね。

向きに意味がなければシンプルに無向グラフで表現した方が伝わりやすいでしょう。

二部グラフ

また、例えばどのような属性のユーザーがどんなページを見ているか?といったように、「属性」と「ページ」という2つのグループに分けられ、かつ同じグループのノード同士が結ばれない場合は二部グラフであるため、グループでまとめてあげるとスッキリします。

まずは何の工夫もなく描いてみました。

図7. 二部グラフを下手に描いた例

f:id:n_mao:20150928212811p:plain

見にくいですね!

グループでまとめて上手に表現してみましょう。

図8. 二部グラフを上手に描いた例

f:id:n_mao:20150928200108p:plain

左が属性、右がページグループです。

どの属性カテゴリーとどのページが接続関係にあるのかが分かりやすくなりました。

対称性をもつランク付きパス図

以下は応用例なので参考程度に。

例えば、継続的に利用してくれるユーザークラス(継続クラス)と、最近利用してくれなくなったユーザークラス(休眠クラス)という2つのクラスにどのような行動パターンの違いがあるのかを確認したい場合、所属クラスや各クラスへの影響度合いなどを考慮するとより直感的に捉えることが可能となります。

図9は、おなじみのUCI machine leaning repositryのbreast cancer datasetを使用して、各クラスにのみ特徴的に出現したパターンを列挙し、視覚化した図です。

図9. 対称性をもつランク付きパス図

f:id:n_mao:20150928201235p:plain

以下では、パターンを構成する要素をアイテムと呼ぶこととします。

左(rank1〜3)が「再発しなかった患者クラス」、右(rank-1〜-3)が「再発した患者クラス」にのみ出現したアイテムを表し、ランク0に両方のクラスに出現するアイテムを位置させています。

ランク0以外のランクは、アイテムが所属するパターンの影響力の総和を、クラスごとに均等3分割したものです。

自己ループは、パタン長1で出現したことを表しています。

このように表現することで、各クラスに対するパターンの影響度を、アイテムレベルで直感的に把握しやすくなります。

終わりに

今回は、ユーザー行動を視覚化するいくつかのグラフ表現方法についてご紹介しました。

うまいグラフ表現を行うことで、鋭い洞察が行えるようになったり、かっこいいプレゼンを行うことができるようになるので、 ぜひトライしてみてください。

もちろん、これらの表現が全てではありませんし、最後の図9のように既存手法にひと工夫加えることで、より直感的な把握が可能になります。

大事なことは、何の情報が必要で、何が不要なのかを正しく取捨選択し、目的にあった表現方法を考えることだと思います

そのために引き出しは多い方が良いですね。

ということで他にも面白い視覚化方法がありましたら教えてください。

それではまた!