ペルソナを用いた Web ページ改善手法の提案
2011SE074 今津 翔

2011SE308 吉田 将成

指導教員 青山 幹雄

1. 研究背景現在，日常生活において Web ページは不可欠な存在である．スマートフォンやタブレット PC などの急速な普及と発展に伴い多様化と高機能化が進み，PC から Web ページを閲覧するという概念が変化している．しかし，これらの端末は新たな機能を利用することを重視しユーザの求める機能が実装されていない．様々な Web ページの閲覧方法が増えていく中でユーザ要求を満たす Web ページを作成することが必要である．
本研究では，ペルソナ/シナリオ手法に A/B テストを組み込むことで Web ページ更新時にユーザ要求を重視したWeb ページの改善手法を提案する．

2. 研究課題
本研究では上記の背景を踏まえ，以下の2点を研究課題とし，UX(User eXperience)を考慮した Web ページ改善の設計プロセスを提案する．
(1)既存の Web ページを利用するユーザの求める要素を探り，要求を基にしたプロトタイプページを提供する．
(2)UX を向上させる Web ページ改善方法のプロセスを提供する．
ユーザ情報から作成したペルソナ，二つのシナリオとプロトタイプページを作成し，そのプロトタイプページをユーザに評価してもらうことでユーザの視点にたった Web ペー
ジの改善を行う．

3. 関連研究3.1. UX(User eXperience)
あるサービスやシステムを利用することによって得られる経験や感情のこと，以下のように定義される[1]．
「製品，システムまたはサービスに対する使用，または，使用を予想した時の，人の知覚と反応」
使いやすさや機能だけでなく，ユーザの感情の意味も含
ま，ユーザビリティよりも広い概念を持っている．
3.2. 人間中心設計（Human Centered Design）
製品やサービスの設計において，ユーザの使い方に焦点を当て，使いやすさを目的とするシステム開発アプロー
チである．以下の 4 つのステップで行う[5]．
(1)ユーザ調査:利用状況の把握と明示(2)ユーザ情報の視覚化:ユーザと組織の要求事項の明示(3)情報のモデル化:設計による解決策の作成(4)ユーザ評価：要求事項に基づく設計の評価
3.3. ペルソナ[2]Web サイトなどのデザインにおける方法論の 1 つ，利用するユーザの要求をよりよく理解するために収集したデータから架空の人物「ペルソナ」を作成する．個々のユーザパターンをまとめ，類似する行動をまとめることでペルソナの行動パターンを生み出す．また，ペルソナは純粋にユーザに基づき実装されるので厳密に設定が可能である．
3.4. シナリオ[3]
ユーザが目標達成をするための行動と，そこから得られる事象を時系列に沿って記述したもの．ユーザと開発者に共通性を持たせ，ユーザがどのような行動を取るか把握することも可能である．また，シナリオを書くことで要求を文書化できることやペルソナの利用状況，態度，意識の詳細化が可能で開発過程全体で利用できる．ペルソナから作成することでユーザについて具体的で曖昧さがないものとなる．
3.5. Web ページ改善手法
デザインや機能の一部が異なる Web ページを用意し，ユーザの求めるWebページを発見する手法のこと．一定の期間毎に変更してユーザのリアクションや感情を得るという方法で判断する．
3.5.1. A/B テスト[4]元のページに対して一部を変更したページを選び，その反応を記録し効果の高かったものを優れた案として採用するテスト手法である．活用することで，変更点を定量的評価が可能である．
3.6. テストツール
テスト用の Web ページをいくつも作成していては時間や労力がかかるので，テストツールを用いる．テストツールの代表的な例として，Optimizely，Visual Website Optimizer，planBCD の 3 つがあげられる．

4. アプローチ
ペルソナ/シナリオ法を用い，プロトタイプページを作成
し A/B テストをユーザに行ってもらう事で Web ページの改善を行う．これにより，ユーザ要求を取り入れた Web ページ改善手法を提案する．アンケートでユーザ調査を行い，ユーザ要求を収集しペルソナを作成する．ペルソナから二つのシナリオを作成，各シナリオに応じてプロトタイプページを作成する．作成
したプロトタイプページを基に A/B テストを行うことでユーザの要求に応じた Webページの改善と UX の向上を行う（図 1）．
図 1 アプローチ

5. Web ページ改善手法の提案
5.1. 提案方法のプロセス
本研究では，人間中心設計プロセスにおける要求獲得と要求分析のプロセスを拡張する(図 2)．また，作成する 2
つのシナリオは，シナリオ A を作成したペルソナの性格に近いものを仮定し，シナリオBは作成したペルソナの性格とは異なる内容とする．

図 2 提案プロセス
5.2. ペルソナの設定[1]5.2.1. ア ン ケ ー ト 実施
プロセス
ペルソナ作成用のユーザ調査プロセスを図 3に示す．

5.2.5. ペルソナの作成
ユーザがどのような振る舞いをするのか具体化する必要があり，セグメンテーションした特徴を基にして，図5に示すように「ペルソナ」を生み出す．

図 5 ペルソナ例
5.3. シナリオの記述
A/B テストを用いて評価を行うために，ペルソナに基づいたゴールを持つシナリオ A とペルソナに沿わないゴールを持つシナリオ B を作成する．図 6 は作成したペルソナ例
から記述したシナリオ A/B の例である[4]．

図 3 アンケート実施プロセス
5.2.2. 行動変数の抽出
収集データから，ユーザの特徴を表現できる項目を変数として抽出する．抽出方法として KJ 法を用いてユーザの特徴を表すものを書き出し，関連するものや類似性の高いものをグループとして分類する．
5.2.3. データマッピング
抽出した変数に対してデータをプロットすることでマッピングを行う．
5.2.4. セグメンテーション
マッピングされたデータについて共通性のあるパターンを図 4 のように探し出す．

図 4 セグメンテーション

図 6 シナリオ A/B 例
5.4. プロトタイプページの作成[5]テストツールを用いて2つのシナリオに対応するプロトタイプページの作成を行う．
5.5. A/B テスト
プロトタイプページを用いて，ユーザに対してテストを実施する．以下はテスト条件である．
(1)適用した Web ページのユーザが設定したゴールを達成してもらう．
(2)1 人のユーザは 2 種類のどちらかのページを用いてゴールを目指す．
(3)ペルソナ作成時にアンケートを行っていない人にもテストを実施してもらう．
5.6. テスト後ユーザ評価
A/B テスト実施後，プロトタイプページについてユーザがどのように考えているかを収集する必要がある．ゴール達成に要する時間や総クリック数のデータとしての定量的評価とゴール達成までの操作に難しい箇所や容易な箇所があったのかを感覚的評価で判断する．

判断結果のよりその後の工程を以下に示す(図 7)．
(1)プロトタイプ A が良いと判断した場合
ユーザ要求から作り出されたペルソナに沿ったシナリオAから作られているもので，想定したページが正しいと判断されたと認識でき，ユーザ要求に沿った Web ページの改善が行われた．
(2)プロトタイプ B が良いと判断した場合ユーザ要求から作り出されたペルソナに沿わないように作られたシナリオ B から作られたもので，想定したページのどこかが正しくなかったと判断ができる．再設定を行い，ユーザの評価を得る．
(3)どちらの結果にも有意差がない場合
ユーザ要求から作り出されたペルソナに基づいて作られているという点からプロトタイプページ Aの方がユーザ要求を満たしていると判断し，改善した結果として用いる．
2 回目以降のループは B を取り入れた A を作成することで無限ループにはならないとする．

6. 提案方法の例題への適用
6.1. 適用 Web ページ
提案プロセスを適用するにあたり「南山大学瀬戸キャンパススクールバス時刻表」ページを用いて検証を行う．適用範囲は，「瀬戸キャンパス学生情報」ページから「瀬戸キャンパススクールバス時刻表」ページまでの遷移とする．
6.2. ユーザ情報の収集
アンケート対象者として瀬戸キャンパスに通う学生に実施し，ペルソナを作成するための基本的な情報とWeb ページの利用に関する情報を得る．以下にアンケー
ト実施結果を示す．
表 1. 利用時間
表 2.クリック回数

表 3.利用比率
ＰＣ

人数[人]

モバイル

5413025不満

54321

全体

791172

情報理工/理工学部

33852

総合政策学部

463206.3. ペルソナ設定
前節で得られた情報から本ページを利用するペルソナを作成する．図 8 は設定したペルソナである．

図 8.ペルソナ
6.4. シナリオ記述
2 つのプロトタイプページを作成するために設定したペルソナからシナリオ記述を行う．表 5 は設定したシナリオである．
表 5.シナリオ A/B

図 7 評価方法

評価

表 4.全体満足度
満足

1
1020

シーン設定

シーン設定

レポートを提出するのに時間がかいつもの時間より遅いバスに乗るこかりいつもと違う時間に乗ることにとにしたので家の PC でバスの時刻なり，Android のスマートフォンで時表を調べた．

刻表を調べた．
ゴール設定

ゴール設定

今日のバス時刻表をパターン表か

今日のバスの時刻表を PDF ページ

ら確認．

から確認．

途中経過

途中経過

(1)ブックマークから学生情報を開く(1)ブックマークから学生情報を開く(2)スクールバスへのリンクをタップ(2)スクールバスへのリンクをクリック(7)”本郷行き”をタップし，出発時間(7)”本郷線”の PDF 時刻表が表示さを確認れたことを確認

ゴール達成

ゴール達成

時刻表で最短の出発時刻を確認．

時刻表で出発時刻を確認．

結果

結果

バスの出発時間に合わせて乗場

バスの出発時間に合わせて家を出へ向かう．

る．

6.5. プロトタイプページの作成
各シナリオに応じたプロトタイプページをテストツールを用いて作成する(図 9)．

図 9 プロトタイプページ A/B
6.6. A/B テストの実施作成したプロトタイプページに対してユーザの反応を得るために A/B テストを実施する．A/B テストでは，クリック数や到達時間の定量的なデータを収集し，テスト後のアンケートではユーザの感覚的なデータを収集する．結果については 7 章で説明する．

7. 評価
A/B テストによるユーザの評価結果から作成したプロトタイプページがユーザ要求を満たしているか判断する．
A/B テスト後のアンケートにより得られたユーザ評価の結果を図 10 に示す．
また，図 11 はアンケートデータから得られた改善率である．クリック数と到達時間の改善率が 20％台であるのは計測値であることを考慮しても，どの項目においても改善が行われた．

8. 考察
本研究では，ユーザの視点を重視した新たな Web ページ改善の手法をペルソナ/シナリオ法と A/B テストを組み合わせることを提案した．ペルソナ/シナリオ法を利用することでユーザ全体の情報を収集し分析することや2 種類のシナリオを作成することでどちらのページがユーザ要求に適しているか判断することが可能であった．
また，A/B テストを用いることで異なるユーザ評価から客観的なデータを得ることにも繋がった．評価項目としては，(1),(3)の感覚的評価と(2),(4)の定量的評価の 2 種類から判断し，定量的という数値のデータだけでなくユーザの感覚的なデータを判断に取り入れることでユーザ要求に沿った Web ページの改善が行われた．

9. 今後の課題
本学瀬戸キャンパススクールバス時刻表に提案プロセスを適用したが，考えなければならない課題を示す．
(1)PC だけではなくモバイルデバイスからも適用を行う．
(2)多変量テストを用いて直接関係しないようなコンテンツについても改善の対象とすること．
(3)実際の Web ページは不特定多数の人物が利用するので，個々のページに合わせたアンケート方法の考案．

10. まとめWeb ページ改善の手法として，ペルソナ/シナリオ法にA/B テストを組み込むことでユーザ要求を重視することや利用する利便性を考慮した手法を提案し，改善点をユーザに評価してもらい提案の妥当性，有効性の確認をした．

11. 参考文献

図 10. テスト後アンケートによる評価

図 11. 改善率
以上より，本研究の提案するプロセスの有効性が確認できた．

[1] 川西 裕幸, 栗山 進, 潮田 浩, UX デザイン入門,
日経 BP 社, 2012．
[2] S. Muder and Z. Yaar, Web サイト設計のためのペルソナ手法の教科書，毎日コミュニケーションズ,2008.
[3] 村瀬 香，中野 夕美，ペルソナを用いたユーザ中心の要求分析方法，南山大学 2003 年度卒業論文，2004．
[4] D. Siroker and P. Koomen，A/B Testing: The Most
Powerful Way To Trun Clicks Into Customers，Wiley，
2013．
[5] M. A. Torres, Smarty Project: Designing and Implementing
an A/B Testing Platform, University of Valencia, 2013.
[6] Wingify,Visual Website Optimizer,
http://visualwebsiteoptimizer.jp/