ユーザビリティテストをやってみました

実際にやってみました。

テスタは開発チームの友人をたどって、4人に参加してもらいました。私は見てるだけの人で、弊社のデザイナの子が案内役です。

次のようなシナリオを用意して、実際に操作してもらいました。

  1. ユビレジのWebサイトにたどり着いて、興味を持ったところからのスタート
  2. 「支払方法の併用はできるの?」「エクセルで作ってるメニューマスタは利用できるの?」といった疑問を持ったと仮定して、それぞれを調べてもらう
  3. 調べて良さそうに見えたと仮定して、サインアップしてもらう
  4. こちらで用意したメニューを5つ、Webサイトから登録してもらう
  5. iPadアプリをインストール済みのiPadを用意して、ログインしてもらう
  6. 会計を入力してもらう

「Webサイトで使い始めることを決意してから実際に使える状況になるまで」を重点的に見ました(メニューの登録ってそういうこと)。一人一時間で、だいたいちょっと短いくらいのタイミングで終了でした。

でだ。これ、実際にやってみたらものすごい面白かったので、なんかシステムを開発してる人はぜひやってみるべきだと思います。要するにユニットテストを書くとガンガンFailureが見つかるのと同じ感覚。

見ていると、「あーーーそこじゃない!!そっち!!それどういう意味だと思う?考えてみて?考えてみて?そうそう!それ!良くできた!!!偉い!!!」みたいな気分になって若干の達成感がありますが、インテグレーションテストだと「よっしゃ!うまいことテスト書けた」と喜ぶべきところですが、しかしよく考えるとユーザビリティテストではこれじゃダメなので注意が必要です。どういう意味なのか考え込まないと使えないシステムというのはゴミです。テストじゃなければ、すぐに使うの辞めます。

そういうわけで、いくつか重大な問題を発見しました。テストしたのは先週の土曜日で、すでに修正済みですので、ユビレジのユーザービリティは若干の改善がされた見込みです。

せっかくなので何を改善したかについて、一つだけ説明しておきましょう。ユビレジでは、販売する商品をあらかじめ登録するのですが、商品を「カテゴリ」によって分類することが可能です。ここで、カテゴリをひとつも登録しないまま、商品の登録に進み、商品の登録が完了してしまうという問題が観察されました。カテゴリに分類されていない商品は「ゴミ箱」に入ることになっているのでそれはそれで良いのですが、そうすると「登録したはずの商品が見えない」ということになります。これはとても混乱を招く挙動なので、修正しました。

  1. 最初にメニュー編集画面を開いた時に、まずカテゴリを登録するよう、インストラクションを表示するようにしました。
  2. カテゴリ無しで新規商品を登録できないようにしました。具体的には、validate_presence_of :category, :on => :createとしました。

まあ、そういうわけで、例によって舞台裏というか舞台を整えるまでの話をします。

準備

まず、テストシナリオを準備します。まあ上にもちょっと書いてあるので、参考にしてみてもいいんじゃないかと思います。

次に会議室を確保します。こういうときに頼りになるのがBOATです(とてもありがたいことです!)。土曜ということでVoyageはお休みで、かなり広い部屋を長時間(6時間も!)確保できました。部屋は思ってたよりも広いほうがいいです。当初、3人だったので、通常4人の部屋を確保してもらおうかと思っていたのですが、「休みだし多分大丈夫だよ!」と「広めが良いです」と希望を出したところ、12人くらいの会議室を確保してもらえました。これが大正解で、とても広々と使えて快適でした。人の他にも、次に説明しますが、カメラを入れるので、広いほうが良いです。広すぎて困ることはまずないでしょうから(仮に実際に広すぎたとしてもちょっと面白いだけです)、広めの部屋を確保しましょう。

準備(モニタリング

Untitled

次に、モニタリングするための準備をします。ユビレジの場合は、MaciPadを使うので、それぞれをモニタリングするための仕組みが必要です。

Mac

Mac OSに組み込みのリモートデスクトップツールを使いました。なんて言ったかな名前……これはちょっとイマイチだったかもしれません。インターネット回線のために用意したのがモバイルルータだったこともあるのか、けっこう速度が遅くて、マウスカーソルをぐりぐりしてるのに追いつかないことがありました。普通にディスプレイを接続するほうが良いかもしれません。と言っても、MacBook Proの画面は意外と広いので、なかなか難しいのですが。今後の課題です。

あとは、監視してる側でマウスを動かすと、ホストの方でも動いちゃうので、触らないように気をつける必要があるとか、そういう感じ。

Macのタッチパッドに慣れてないテスタの人もいるので、マウスを用意しておいたほうがいいと思います。

iPad

こちらは、HDMI接続でディスプレイをつなぎます。ユビレジは外部ディスプレイがあるとカスタマーディスプレイとして使用するので、通常、操作してる画面は見えないのですが、3ヶ月ほど前にセールスの人からの要望で付けたミラーリングするモードが役に立ちました。

こちらはなんの問題もなく動作しました。

テストの様子の撮影

カメラを2台用意しました。部屋全体を撮影するものと、iPadの操作状況を撮影するものです。

部屋全体の動画撮影には、アホみたいに社内に転がっている……じゃなくてお、いつもは社内で開発用機材として利用しているiPad2を使用します。適当なスタンドに立てて、カメラアプリで動画撮影すればそれでokです。便利な時代になったものだ!

さて、問題はiPadの方です。撮影には私のiPhone 4sを使いました。当初は一眼レフカメラで撮影しようとしていたのですが、実際に社内でテストをテストした時にあっさり問題が見つかりました。デジカメは、あんまり長時間の動画撮影ができないのですね(20分くらいでした)。どうやってiPhoneを固定するかというと……手元にあった譜面台を使いました。

Untitled

固定には、いろいろ考えましたが、簡単にマスキングテープを使用しました。マスキングテープというくらいなので、剥がした時にあんまり汚くならないことを期待しました。実際、特に汚れは残りませんでした。

ちなみにどうでも良い話ですが使用した譜面台(プログラマ私物)はこれです。

ウィットナー 譜面台 961D  WITTNER MUSIC STAND 961D

ウィットナー 譜面台 961D WITTNER MUSIC STAND 961D

小学校の頃から使っていた譜面台は、2年ほど前に無くしてしまったので、2代目です。すごい良いのでお勧めです(もっと良いものがあったら教えて下さい)。ちょっと重たいのですが、十分コンパクトですし、10年以上使ってもネジが甘くなったりしませんし、丈夫です。軽いものとは剛性感が全然違うので、折りたたみの譜面台を選ぶときはこれを買えば良いと思います。焦って譜めくりするときにグラグラすると、とてもイラッと来ます。また、iPhoneの固定なんかをするときには、変な姿勢で使うことにもなりかねませんが、無駄な安定感が安心につながります。無理やり元の話に戻って来ました。

動画撮影で注意すること

空き容量がなくなると、動画の撮影が止まります(当たり前)。iPhone 4sの場合、40分撮影して2〜3GBになります。容量が無くならないよう、注意しましょう。

簡単に言うと、4人中4人目の30分ほど経過したところで、容量がなくなって止まりました。(iPad2も!)まあ実際のところ、動画を見ることはほとんどありませんが(見てません)、撮れてると思ってるものが撮れてないと、がっかりですし、本当に必要になった時に困ることでしょう。

謝金の支払い

謝礼は交通費込みで一人5000円を用意しました。謝金の支払いには「当日手渡しで領収書を書いてもらう」という方法がありますが、社内的な都合で「請求書を書いてもらい後日振込み」となりました。請求書を適当に書きましょう。名目にちょっと迷いましたが、いろいろググッた結果「被験者謝金」としました。文句を言われなかったので、それで良かったのでしょう。

振込先は銀行口座を書いてもらいましたが、私は常に財布にキャッシュカードを入れてる人なので想像してなかったのですが、キャッシュカードを持ち歩かない人もかなりいるようなので、事前に振込先を聞いておくとスムーズなようです。

質問されても答えない強い心

ユーザビリティテストは、こちらから操作についてアドバイスしないのが原則です。聞かれたら「どう思いますか?」と答えるのが常套手段ですが、実際にテストしているとなかなか難しいようです(私は聞かれる立場ではなかったのでわからない)。特に難しいのが「操作が完了したことの確認」で、すぐに答えてしまっていたのがちょっと見ていて気になりました。『これで良いんですか?』と聞かれた時に「はい」と答える前に「どう思いますか?」と聞き返すほうがいいのではないかと思います。

逆に、明らかにテストしたいところとは別のところでテスタが迷っているらしき行動も観察されました。私は一度「必要だったらリンクをたどって別のページを見てもokですよ」的な発言をしました。

このあたりの線引きは難しいところだと思うのですが、うまくテストする側で調整しておく必要がありますね。

まとめ

初めてのユーザビリティテストはこんな感じでした。いろいろスムーズに行かなかったこともありましたが、全体的に得られたものがとても大きかったと認識しています。ぜひ、一度やってみてください。

あと、気分を出すために偽札を作りましたが、特にテスタの人が喜んでくれた様子はなかったので、ちょっとがっかりしました。(ちなみに、Wikipediaにある千円札の画像はプリンタで印刷できないので、やってみると面白いと思います。ユーリオンとか言うテクノロジらしいです。)