ユーザインタフェース 第10回
プロトタイプ
ユーザビリティ調査における
プロトタイプの役割
• プロトタイプ: ひな形
– ユーザーに試しに使ってもらう ために作る
• ソフトウェア工学でのプロトタイプとの違い
– ソフトウェア工学
• 試作品
• 製品を完成させる過程の中間成果物
– ユーザビリティ調査
• 試用品
• 設計者が試行錯誤するためのテスト材料
• 携帯電話であってもWebサイトであっても、本格的に開発が
始まってから根本的な問題が見つかったのでは、手遅れ
なんのためのプロトタイプ?
• 実際のUIを使った際の問題点の明確化手法
• UIを介したインタラクションのなかで生じるユーザ
の 戸惑いや理解できない点 を明らかに
– 画面上で迷った
– 操作後のフィードバックの意味がわから なかった
• 動くUIを正直につくると時間とコストがかかる。
– できるだけ早い段階 でプロトタイプを使った検証を行う
という方針と相反
– 時間をかけて動くプロトタイプをつくったのでは、仮説検
証の 反復回数も減ってしまう
• では、どうする?
ローファイとハイファイ
• 忠実度 (fidelity)
– どれだけ実物そっくりに作られているか
– ローファイ(low fidelity) 大雑把に作られている
– ハイファイ(high fidelity) 本物そっくり
• すべての部分をハイファイに作るのは 愚か
• どこをどれだけ忠実につくるか
– ハイファイにするべきは
• テストの目的に直接関係する 部分
• テストする機能を完全に シミュレート できること
– あとはローファイでよい
• プロトタイプの作成
– 目的のため、必要最小限のインタフェースに絞る
Tプロトタイプ
• 通常、製品の機能は階層的に表現される
• 水平プロトタイプ(浅いプロトタイプ)
– すべての機能を、特定の階層だけ作る。
• 垂直プロトタイプ(深いプロトタイプ)
– 特定の機能だけを、すべての階層で作る。
• Tプロトタイプ
– 双方を融合
オズの魔法使い法
• Jeff Kelleyが命名した手法
• UIにおけるインタラクションを、プログラミング
で実現するとコストが高い
• 裏に隠れた人間が操作して、いかにもコン
ピュータが行っているように見せる方法
– 映画『オズの魔法使』のクライマックスでオズの
大王が登場して、人々が恐れおののく
– 主人公ドロシー・ゲイツが部屋の隅にあるカーテ
ンを開けると、実は、貧相な老人が装置を操って
いた
プロトタイプの作成の例
ー Webサイトの場合 ー
• オーサリングツール(Authoring Tool)
– プログラムを書かないでソフトウェアや作品を作るた
めのアプリケーションソフトウェア
– Webの場合は以下が3大メジャー製品
• Adobe Dreamweaver
• Microsoft Expression Web
• ホームページビルダ(IBM→2011年よりジャストシステムへ)
• もっと手軽な方法: 紙を使う paper prototype
– ソフトウェアに習熟していないメンバでも参加可能
– Photoshopで作った見た目が立派なものより、一見大
雑把なプロトタイプの方が、ユーザが気軽に 問題点
を指摘する傾向がある
オズの魔法使い法に基づく
paper prototype
• ユーザがボタンを押すと、新しい画面が現れる
最近はpaper prototypeでなく、MS PowerPoint を使う
プロトタイプの作るうえでのポイント
ー Webサイトを例に -
• ダミーページ をつける
– すべてのリンクやボタンがクリックできるようにユー
ザが失敗できるようにする
• ユーザの判断に影響する部分は ハイファイ に
– 画面遷移
– 画面要素の 相対的位置関係
– リンクやボタンのラベルやテキスト
– エラーメッセージ の内容
– アイコンのデザイン
手を抜いてよいところ
• コンテンツ はダミーでよい
• ユーザを うまく騙す
– ダイヤログボックスの表示
• ダイヤログボックスを重ねて表示した画面に切り替え
る
– 確認用メールの送信
• そのタイミングで人間がメールを送信する
– オズの魔法使い法 の活用
• プロジェクト参加者全員で作ることが重要
– ひとりで作ると、テストで悪い結果が出た時に、作
成者の力量のせいにされることがある
カードソート法
• ほとんどの製品は 階層型メニュー を採用
– コピー機、携帯電話、DVDレコーダ
• 製品を使用する際の 階層 を設計する手法
• 超ローテク手法
– 情報を書き込んだ紙のカードを ユーザに分類して
もらう
– 設計チームの果てしない議論に終止符を打つ
• 『クローズド』 と 『オープン』 の2種類の方法
クローズド・カードソート
• 見出しのある カードソート
• カテゴリ名がある程度決まっている ときに実施
• カテゴリ名の有効性を検証し、コンテンツをどのカテ
ゴリに割り振ればよいか検討するために実施
– カードをユーザに渡してカテゴリ名の下に置いても
らう。
– ユーザが そのカテゴリに分類した理由 を話しな
がら作業をしてもらう
• 効用
– 意味不明のカテゴリ名をユーザは指摘してくれる
– 想定と異なる配置が起こ れば、ユーザがカテゴリ
名の意味を誤解していることがあきらかになる
カードの動き、ユーザの違い
• カテゴリ名の完成度が高ければ、大半のカードはす
ぐに行き先が決まる
• 最後まで決まらない
– 現在のカテゴリはすべての階層構造を表していない
• いったん配置されたカテゴリから他のカテゴリに移動
させたりするカードもある
– カテゴリが互いに独立でない
• 複数のユーザにカードを分類してもらってその結果を
集計
– 同じカテゴリに配置される カード
– 複数のカテゴリに分散する カード
があきらかになる
オープン・カードソート
• 見出しのないカードソート
• カテゴリ名が決まっていないまったく白紙の状態
で、ユーザにカードを自由に分類してもらう
• 適切な情報構造に関する ヒント を見つけ出すこ
とが目的
– ユーザによってグループ分けとそのラベリングの結果
はまちまち
• 定量的方法
• 定性的方法
クラスター分析(次スライドで説明)
名寄せ分析
– ユーザが付けたラベルで同じような意味を持つラベル
を1つにまとめる
– 分析者の主観に依存してしまう
クラスタ分析
• 距離が近い サンプルを順番に結合して、クラ
スタ(房)を形成する多変量解析手法
クラスタ内の重心を
とってクラスタリング
– 距離にはいろいろな表現法
花子 太郎 一郎 次郎
卵
苺
茸
花子
1
0
0
太郎
0
1
1
一郎
0
1
0
一郎
1.41
1
-
1.41
次郎
1
0
0
次郎
0
1.41
1.41
-
花子
-
1.73
1.41
0
太郎
1.73
-
1
1.73
花 次 太 一
子 郎 郎 郎
2点間の距離が最小の
ものを同じクラスタへ
• データの階層構造を示す 樹形図 が作成される
• 統計解析ソフトが必要
デルファイ・カードソート
• カードソートと デルファイ法 の組み合わせ
– オープンカードソートの欠点を補う
– デルファイ法
• 専門家に対して意見の収集とフィードバックを繰り返すことで、将来
予測を行う調査手法
手順
1. まず 原型(シード) を作る
2. ユーザーに順番に任意の変更を加えてもらう
3. 結果がおおよそ収束するまで続ける
• シードのためソートにかかる時間はオープンより短い
– オープンでは個々のユーザの結果は多様
– デルファイでは極端な変更ではなく 調整 にとどまる
ダウンロード

ユーザインタフェース 第7回