![見出し画像](https://assets.st-note.com/production/uploads/images/66276448/rectangle_large_type_2_a2b7aa2f91e373324ed8e02243592954.png?width=1200)
【まとめ】CSSNiteセミナー「認知プロセスモデルから学ぶUIの使いやすさの評価方法」
以前、CSSNiteにて、UIの設計・評価・分析において役立つ「行動・認知プロセスモデル」の概念の解説および評価についてのセミナー(まぼろしの松田直樹さんによる)を受講したので
自分用のメモとして参考になった内容をまとめます。
使いやすさとは何か?
「使いやすくする」というよりは、まず「普通に使える」を目標に作るのが良いそうです。そのためには、ユーザーの認知負荷を下げることが必要。
使いやすさの定義
①物理的側面=さわりやすい
②認知的側面=理解しやすい
優れたUIは第一接面を意識しない
ユーザーにとっての第一接面(例:ボタン)と第二接面(例:できること)の関係性は1:1が望ましいのだそうです。
使いにくい=「思ってたんと違う」となること
そうならないためには、以下を大事にすること
👆統一する
👆予測できる
👆判断できる
ユーザーが使いにくいところはどこかチェックする時のチェックポイント
①行為の詳細化
→こうすればこうなる、が想定できるか?
②ゴールの形成
→ゴールはユーザー視点になっているか?
例)
「部屋を明るくしたい」と言った際のユーザーの目的を考える
⭕️本を読みたい
❌照明をつけたい…機能目線になっている
③結果の比較
→システムの反応を知覚・解釈・評価できるか?
例)
❌ボタンを押した結果がONなのかOFFなのかわからない
⭕️ONとOFFがわかるように明確に色を変えるなど
ペルソナ設定が大切
なぜペルソナが大切か
👆そのペルソナによって理解できるUIが変わる
👆ペルソナによって自己都合で作るのが避けられる
ペルソナ設定の際、ペルソナがよく使っているアプリなども細かく設定すると良い。例えば、GMailを普段使っているユーザーにとっては「アーカイブ」機能がメールを見えない場所に移動する機能だとわかるが、GMailを使っていない人にはわからないなど、人によって理解できるUIは変わってくるため。
ヒューマンエラーのための3つのモデル
人によってエラーが起こるポイントが異なる。大きく3つのモデルケースがあり、①②③それぞれに合った設計をすることが必要になる。
①ナレッジベース
すでに持っている知識を元に行動する人
【⚠️起こりうるエラー】
既存の知識が通用しなかったエラーが起こる
【💡解決策】
オンボーディングやチュートリアルなどの設置が必要
②ルールベース
規則や手順を知っている人
【⚠️起こりうるエラー】
既存の知識が通用しなかったエラーが起こる
【💡解決策】
マニュアル・ヘルプなどが必要
③スキルベース
十分な経験がある人
【⚠️起こりうるエラー】
スリップ…慣れによるエラー
ラプス…元の目標から逸脱してしまうエラー
【💡解決策】
事故・エラー防止策
OOUI(オブジェクト指向UI)を使うと、認知がしやすい
オブジェクト指向についてのわかりやすい記事(上野さんの記事)
https://www.sociomedia.co.jp/10241
オブジェクト指向
…主語が先
↕️
タスク指向
…述語が先
【オブジェクト指向の例】
一覧(コレクション)からファイル(オブジェクト)を選び、操作(アクション)を選ぶ
その他、印象に残ったこと
表記ゆれがなぜダメか?
ユーザーが、表記ゆれした単語を同じものと認識するのに時間がかかってしまうため
フォントはなるべく統一する
フォントの不統一は文字パターン認知の負荷を高めてしまうため
まとめ
UI/UXデザイナーを目指す上で、とても参考になる内容でした。
「誰のためのデザイン?」や「融けるデザイン」等の書籍を読めばおそらくわかる内容ではありますが、本だとなんとなく小難しい内容を、わかりやすく・要点をかいつまんで説明いただけました。より理解が深まって実践的なインプットができたかなと思います。
特に、ペルソナ設定は本当に大事なんだなと実感したので、UIを作る際もチェックする際も「誰が使うか」を意識して、その人になりきって使いやすさを検証していきたいと思いました!
この記事が気に入ったらサポートをしてみませんか?