ユーザインタフェース 第１ ０回 プロトタイプ. ユーザビリティ調査における プロトタイプの役割 プロトタイプ： ひな形 – ユーザーに試しに使ってもらう ために作る ソフトウェア工学でのプロトタイプとの違い – ソフトウェア工学 試作品 製品を完成させる過程の中間成果物 – ユーザビリティ調査 試用品.

Presentation on theme: "ユーザインタフェース 第１ ０回 プロトタイプ. ユーザビリティ調査における プロトタイプの役割 プロトタイプ： ひな形 – ユーザーに試しに使ってもらう ために作る ソフトウェア工学でのプロトタイプとの違い – ソフトウェア工学 試作品 製品を完成させる過程の中間成果物 – ユーザビリティ調査 試用品."— Presentation transcript:

1 ユーザインタフェース 第１ ０回 プロトタイプ

2 ユーザビリティ調査における プロトタイプの役割 プロトタイプ： ひな形 – ユーザーに試しに使ってもらう ために作る ソフトウェア工学でのプロトタイプとの違い – ソフトウェア工学 試作品 製品を完成させる過程の中間成果物 – ユーザビリティ調査 試用品 設計者が試行錯誤するためのテスト材料 携帯電話であっても Web サイトであっても、本格的に 開発が始まってから根本的な問題が見つかったのでは、 手遅れ

3 なんのためのプロトタイプ？ 実際の UI を使った際の問題点の明確化手法 UI を介したインタラクションのなかで生じる ユーザの 戸惑いや理解できない点 を明らか に – 画面上で迷った – 操作後のフィードバックの意味がわから なかった 動く UI を正直につくると時間とコストがかかる。 – できるだけ早い段階 でプロトタイプを使った検証 を行うという方針と相反 – 時間をかけて動くプロトタイプをつくったのでは、 仮説検証の 反復回数も減ってしまう では、どうする？

4 ローファイとハイファイ 忠実度 (fidelity) – どれだけ実物そっくりに作られているか – ローファイ (low fidelity) 大雑把に作られている – ハイファイ (high fidelity) 本物そっくり すべての部分をハイファイに作るのは 愚か どこをどれだけ忠実につくるか – ハイファイにするべきは テストの目的に直接関係する 部分 テストする機能を完全に シミュレート できること – あとはローファイでよい プロトタイプの作成 – 目的のため、必要最小限のインタフェースに絞る

5 Ｔプロトタイプ 通常、製品の機能は階層的に表現される 水平プロトタイプ（浅いプロトタイプ） – すべての機能を、特定の階層だけ作る。 垂直プロトタイプ（深いプロトタイプ） – 特定の機能だけを、すべての階層で作る。 Ｔプロトタイプ – 双方を融合

6 オズの魔法使い法 Jeff Kelley が命名した手法 UI におけるインタラクションを、プログ ラミングで実現するとコストが高い 裏に隠れた人間が操作して、いかにもコ ンピュータが行っているように見せる方 法 – 映画『オズの魔法使』のクライマックスでオ ズの大王が登場して、人々が恐れおののく – 主人公ドロシー・ゲイツが部屋の隅にある カーテンを開けると、実は、貧相な老人が装 置を操っていた

7 プロトタイプの作成の例 ー Web サイトの場合 ー オーサリングツール (Authoring Tool) – プログラムを書かないでソフトウェアや作品を作 るためのアプリケーションソフトウェア – Web の場合は以下が 3 大メジャー製品 Adobe Dreamweaver Microsoft Expression Web ホームページビルダ（ IBM→2011 年よりジャストシステ ムへ） もっと手軽な方法： 紙を使う paper prototype – ソフトウェアに習熟していないメンバでも参加可 能 – Photoshop で作った見た目が立派なものより、一 見大雑把なプロトタイプの方が、ユーザが気軽に 問題点を指摘する傾向がある

8 オズの魔法使い法に基づく paper prototype ユーザがボタンを押すと、新しい画面が現れる 最近は paper prototype でなく、 MS PowerPoint を使 う

9 プロトタイプの作るうえでのポイ ント ー Ｗｅｂサイトを例に － ダミーページ をつける – すべてのリンクやボタンがクリックできるよう にユーザが失敗できるようにする ユーザの判断に影響する部分は ハイファイ に – 画面遷移 – 画面要素の 相対的位置関係 – リンクやボタンのラベルやテキスト – エラーメッセージ の内容 – アイコンのデザイン

10 手を抜いてよいところ コンテンツ はダミーでよい ユーザを うまく騙す – ダイヤログボックスの表示 ダイヤログボックスを重ねて表示した画面に切り 替える – 確認用メールの送信 そのタイミングで人間がメールを送信する – オズの魔法使い法 の活用 プロジェクト参加者全員で作ることが重 要 – ひとりで作ると、テストで悪い結果が出た時 に、作成者の力量のせいにされることがある

11 カードソート法 ほとんどの製品は 階層型メニュー を採 用 – コピー機、携帯電話、 DVD レコーダ 製品を使用する際の 階層 を設計する手 法 超ローテク手法 – 情報を書き込んだ紙のカードを ユーザに分類 して もらう – 設計チームの果てしない議論に終止符を打つ 『クローズド』 と 『オープン』 の 2 種 類の方法

12 クローズド・カードソート 見出しのある カードソート カテゴリ名がある程度決まっている ときに実施 カテゴリ名の有効性を検証し、コンテンツをどの カテゴリに割り振ればよいか検討するために実施 – カードをユーザに渡してカテゴリ名の下に置 いてもらう。 – ユーザが そのカテゴリに分類した理由 を 話しながら作業をしてもらう 効用 – 意味不明のカテゴリ名をユーザは指摘してく れる – 想定と異なる配置が起こ れば、ユーザがカ テゴリ名の意味を誤解していることがあきら かになる

13 カードの動き、ユーザの違い カテゴリ名の完成度が高ければ、大半のカードは すぐに行き先が決まる 最後まで決まらない – 現在のカテゴリはすべての階層構造を表していない いったん配置されたカテゴリから他のカテゴリに 移動させたりするカードもある – カテゴリが互いに独立でない 複数のユーザにカードを分類してもらってその結 果を集計 – 同じカテゴリに配置される カード – 複数のカテゴリに分散する カード があきらかになる

14 オープン・カードソート 見出しのないカードソート カテゴリ名が決まっていないまったく白紙の 状態で、ユーザにカードを自由に分類しても らう 適切な情報構造に関する ヒント を見つけ 出すことが目的 – ユーザによってグループ分けとそのラベリングの 結果はまちまち 定量的方法クラスター分析（次スライドで 説明） 定性的方法名寄せ分析 – ユーザが付けたラベルで同じような意味を持つラ ベルを 1 つにまとめる – 分析者の主観に依存してしまう

15 クラスタ分析 距離が近い サンプルを順番に結合して、 クラスタ（房）を形成する多変量解析手法 – 距離にはいろいろな表現法 データの階層構造を示す 樹形図 が作成され る 統計解析ソフトが必要 卵苺茸 花子 100 太郎 011 一郎 010 次郎 100 花子花子 太郎太郎 一郎一郎 次郎次郎 クラスタ内の重心を とってクラスタリング 花子太郎一郎次郎 花子 -1.731.410 太郎 1.73-1 一郎 1.411- 次郎 01.41 - 2 点間の距離が最小の ものを同じクラスタ へ

16 デルファイ・カードソート カードソートと デルファイ法 の組み合わせ – オープンカードソートの欠点を補う – デルファイ法 専門家に対して意見の収集とフィードバックを繰り返すことで、 将来予測を行う調査手法 手順 1. まず 原型（シード） を作る 2. ユーザーに順番に任意の変更を加えてもらう 3. 結果がおおよそ収束するまで続ける シードのためソートにかかる時間はオープンより 短い – オープンでは個々のユーザの結果は多様 – デルファイでは極端な変更ではなく 調整 にとどま る