サービス

ペーパープロトタイプ/ユーザーテスト

サイトの構成や、キーパスシナリオ(主要なコンテンツのワイヤーフレーム)が固まった後に、
具体的な画面設計書となるペーパープロトタイプを作成します。
ペーパープロトタイプは多くの場合、実際のスマートフォンと同サイズの画面枠を出力した紙に、鉛筆を使って手書きで行います。ワイヤーを画面上で作成できるツールも多く存在しますが、それらを使うとどうしてもテンプレートの範囲内だけで設計してしまうことになり(=キャンバスイン)、本来そのコンテンツがあるべき姿を制限してしまうケースがあるからです。

ユーザーフローと同じく、ペーパープロトタイプ制作にもいくつかのコツがあります。

  1. デザインされた場合と同じ大きさのボタン、テキストを書く
  2. テキストやボタンのラベリングを「~~~」のように省略しない
  3. ボタンはクリックできることを明示するため影を付けておく(後のユーザーテストのための準備)
  4. 複数の機能をまとめたボタンを考えてみる、文字でなくアイコンで表現できないか考えてみる、など限られた画面内での合理的な画面設計を検討する

このように、実際の画面デザインや操作感を配慮して作るため、デザイナー、フロントエンジニアとも綿密なコミュニケーションを取りながら進めることが特に重要なステップとなります。

ペーパープロトタイプ

いったんペーパープロトタイプが完成したら、それを使ってのユーザーテストを行います。
通常は、

  • 被験者(テストを実施する人、ユーザー役)
  • モデレーター(司会進行役)
  • 記録者(気になった動きなどを記録する役)

の3名で行います。
「あなたは会社帰りに今日が妻の誕生日であることを思い出し、プレゼントにケーキを買って帰ろうと思っています」といった課題を与え、ペーパープロトタイプを見ながら、実際にサイトを利用してもらいます。
クリックしたい場合は紙の上のボタンを実際に指で押し、そうすると司会役が次のプロトタイプを被験者の前に差し出す、とった流れです。

こうしたテストを行うと、思ったボタンを押してくれない、予想と異なる動きをする、といった課題が必ず浮かび上がってきます。それらをもとに、ペーパープロトタイプを改善し、再度ユーザーテストにかけてみる。というフローを繰り返すことで画面設計の精度を高めます。

これらは一見手間のかかることのように思われがちですが、実際にデザインやコーディングをした後に設計上のミスが見つかるといった手戻りを考えると、はるかに合理的・効率的な進行方法といえます。
また、ペーパープロトタイプの時点でクライアントと設計のコンセンサスを取っておくことも、スムーズなプロジェクト進行には欠かせません。
TAMでは、ペーパープロトタイプテストをクライアントとともに行い、互いの意見を交わしながら設計を詰めていく、というケースも多く行っております。