見出し画像

[読書メモ]UXデザインの法則-最高のプロダクトとサービスを支える心理学

ヤコブの法則/Jakob's Law
すでにあるメンタルモデルを活かせば、ユーザーは新たなメンタルモデルの学習なしにタスクに集中でき、ユーザー体験の質が高まる。
変更時の違和感を最小限に留めるためには、慣れ親しんだバージョンを使い続けられる移行期間を設けよう。

フィッツの法則/Fitts's Law
タッチターゲットにはユーザーが正確に押せるために十分に大きさが必要
タッチターゲット同士は十分な感覚が空いていなければいけない
タッチターゲットはインターフェース内で、ユーザーが簡単に到達できる場所に置かれていなkればいけない。
例えば、テキストラベル要素とインプット要素のタッチターゲットの領域

ヒックの法則/Hick's Law
応答に時間がかかって意思決定が遅くなっているときは、選択肢を最小限にまで減らせそう
タスクが複雑なら、小さなステップに分解して認知負荷を減らそう
ユーザーが情報量に圧倒されないように、おすすめの選択肢を目立たせよう
段階的なオンボーディングを採用し、新規ユーザーの認知負荷を最小限にしよう
単純化によって抽象的になりすぎないよう注意しよう

良い例として、Google検索。検索を実行した後にだけ、タイプ別に結果をフィルタリングする機能が提供されている。ユーザーは出だしでの意思決定で一杯一杯にならず、その時その時のタスクに集中し続けられるように。っ

情報の整理について、ユーザーの期待を見極める有効な手法の一つはカードソーティング。
また、注意すべきなのは、単純化しすぎること。抽象化しすぎてもはやどんなアクションが実行できるのか、次何をすればいいのか、どこにどんな情報があるのかわからんくなってしまう。例えばアイコンのみのデザイン。

ミラーの法則/Millar’s Law
コンテンツを小さなチャンク(塊)に分けることで、ユーザーがその情報を扱い、理解し記憶しやすくできる
短期記憶の容量は、個々人が持っている知識や状況、文脈によって大きく幅があることを覚えておこう。
情報のチャック化最も単純な例は、電話番号の書式。
整形された(チャック化された)電話番号は読むのも覚えるのもはるかに簡単。
4408675309
(440)867-5309
情報量の多いニュースサイトやECサイトでは、チャック化したことによって見やすくしている。情報グルーピングし、背景や枠線などでまとめられているものの、互いに近接していることで視覚的にチャック化されている。
ミラーの発見の中心は、制約のある短期記憶を最大限有効利用するために、情報の断片をいかに意味のあるチャンクに整理するということである。あ

ポステルの法則/Postel’s Law
出力は厳密に、入力に寛容に。
ユーザーにどれだけの情報を求めるかについては厳密であるべき。入力すべき項目が多ければ多いほど、ユーザーは認知エネルギーと労力をより多く消費することになり、結果、意思決定の質が落ち(決断疲れ)、フォームをかんずいできる可能性が減ってしまう。絶対に必要なものだけを求め、メールアドレスやパスワードなどシステムが「既に持っている情報は求めないことでフォームに記入する手間を最小限に抑えよう。
デザインプロセスにもポステルの法則が見られる。効果的なデザインシステムを作り上げるためには、入力に対して寛容でなければならない。デザイン、コンテンツ、コードから戦略、意見、批判に至るまでのあらゆるものが、システムづくりに関与する多様なチームからs出てくるからだ。対照的に、デザインシステムのアウトプットは保s注的である。全てが明確で目的を持っていなければならない。

https://www.carbondesignsystem.com/guidelines/accessibility/color

https://www.lightningdesignsystem.com/

https://polaris.shopify.com/design/colors#section-principles

ピークエンドの法則/Peak-End Rule
経験についての評価は、全体の総和や平均ではなく、ピーク時と終了時にどう感じたかで決まる。
エンドユーザーを喜ばせるためには、プロダクトが最も役たつ瞬間、最も価値がある瞬間、或いは最も楽しい瞬間を見定めてデザインしよう。
人はポジティブな経験より、ネガティブな経験をより鮮明に思い出すことが心に刻んでおこう。
事例
Mailchimp。
メールキャンペーン作成のプロセスが非常にストレスの多いものだが、Mailchimpは全体のトーンを明るく安心感のあるものにしつつユーザーを誘導する。例えば書き上げたメールの送信ボタンを押そうとする瞬間では、感情がピークに達するこの瞬間は、メールキャンペーン作成に費やした全ての作業の蓄積と失敗への恐れが重なる瞬間。シンプルな確認モーダルに止まらない体験をMailchimpが提供している。

送信された後の画面には、high fiveというユーモアなフレーズを使ったり、ユーザーがどのような画面で見られるかを確認したり、共有したりする後続アクションを用意しています。これらの詳細は、達成感を強化し、エクスペリエンスを向上させ、このサービスを使用する人々にポジティブなメンタルスナップショットを作成します。

配車会社のUberは、待機がビジネスモデルの避けられない部分であることを認識し、待機時間に関連する3つの概念、つまりアイドル状態の回避、運用の透明性、目標の勾配効果に焦点を当てることで、この問題点を軽減しようとしました。⁵UberExpressPOOL顧客(図4)には、情報を提供するだけでなく、娯楽(怠惰嫌悪)を維持するのに役立つアニメーションが表示されます。このアプリは、到着予定時刻と到着時刻の計算方法に関する情報を提供します(運用の透明性)。プロセスの各ステップを明確に説明しているため、お客様は、乗車するという目標(目標勾配効果)に向かって継続的に進歩していると感じることができます。Uberは、人々の時間と待機の認識に焦点を当てることで、リクエスト後のキャンセル率を減らし、サービスの使用中に簡単に否定的な感情のピークになり得るものを回避することができました。


ジャーニマップを使って感情のピークを特定

レンズ
例えば、Janeはライドシェアサービスアプリを利用して、10分以内に正確な場所に到着することを期待しているライド(シナリオ)を注文しています(期待)
インサイト
ライドの注文後に車両の位置に関するリアルタイムの情報を提供することで、大気の問題点(機会)を減らすことができます。この機能は、製品チームによってい設計及び開発される必要があり、乗車後の評価(メトリック)に従って監視できます。

フォンレスとルフ効果/ Von dRestorff Effect

似たものが並んでいると、その中で他とは異なるものが記憶に残りやすい。
重要な情報やアクションを視覚的に目立たせよう。
視覚的な要素を強調する際に、互いに競合したり、目立ちすぎて広告だと勘違いされたりしないように抑制をかけよう。
コントラストを伝えるのを色だけに頼ると、色覚障害者やロービジョンを排除することにつながる。
(あまり多くの項目がj強調されている場合、人々は重要な情報や変化に気づきにくくなってしまう。気が散ってしまう、自動的に「ノイズ」を遮断してしまう。

テスラーの法則/Tesler’s Law
どんなシステムにも、それ以上減らすことのできない複雑さがある。複雑性保存の法則ともいう。
どんなプロセスも、その核となる部分にはデザインの工夫を持ってしても取り除くことのできない複雑性を抱えている。この複雑性による負荷を負うのは、システムかユーザーかだ。
事例
メール入力(差出人を自動的に入力し、過去のメールに基づいて宛先をサジェストすることで複雑性を軽減する。メール本文作成時、文脈に応じて文章をサジェスト)
ECサイトやネット決済サービス

ドハティのしきい値/Doherty Threshold
応答が0.4秒以内の時、kコンピューターとユーザーの双方が最も生産的になる。
システムのパフォーマンス(応答時間)は優れたユーザー体験を届ける上で欠かせない。。プロダクトやサービスの最初の画面表示にかかる時間をいかに減らすか、ユーザー入力への反応とそれに対するフィードバックをいかに早く返すか、後続ページをいかに早く読み込むか、システムの応答時間は全体的なユーザー体験の鍵となる。一度遅延が1秒超えるとユーザーがタスク以外のことを考え始め、生産性の低下につながる。結果としてタスクを続けるための認知的な負荷が高まり、全体としてユーザー体験が損なわれてしまう。
テクニック
Facebookスケルトンスクリーン(ゴーストビュー/ゴーストオーバーレイ)
ページを読み込み始めるとすぐにプレースホルダーブロックをコンテンツの表示領域に表示する。実際の文章や画像がう読み込まれるとすぐにそのブロックと入れ替わる。


Mediumブラーアップ
最初に極小サイズの画像を読み込んでおき、より大きな画像が読み込まれたらそれを置き換えていく。解像度の低い画像を拡大する際に、あからさまなピクセレーションとノイズを防ぐため、ガウスぼかしを適用する。高解像度画像を読み込むとすぐに低解像度画像の背後に配置し、低解像度画像をフェードアウトさせて高解像度画像を再上面に表示。

アニメーション活用
パーセンテージ表示で進捗を表すインジケーター。進捗表示の正確さに関係なく、単純にプログレスバーを表示するだけでユーザーはより辛抱強く待つようになる。
安心感を覚える
待たせている間も興味を失わずに見続けてもらえる
プログレスバーの動きを意識すると、待っているということを忘れ、体験の待ち時間が減る

楽観的にUI( optimistic UI)
処理が完了して初めてフィードバックを返すのではなく、処理が進んでいる最中にアクションが成功したという楽観的なフィードバックを提示する。
instagram写真にコメントすると、アップロード完了する前にコメントが画面に表示される。アクション実際に成功しなかった場合にのみ事後的にエラーを表示する。


デザイナーには力と責任が伴う
テクノロジーは人々の生活に重大な影響を及ぼす力を持っている。だからこそ、その影響を確実にポジティブなものにすることが極めて重要だ。ユーザーの目標達成とwell-beingに寄り添って、支援するプロダクトや体験を生み出すことは私たちの責任である
・happy pathを超えて考えること(極端なケースを思考の中心に据えることで、デフォルトでは救えないケースを考慮し、プロダクトやサービスのresilienceをより確実なものとする)
・より多様性のあるチームを構築すること(同質的な思考の落とし穴を避ける)
・自分たちが生み出したプロダクトや経験が人々の生活にどのような影響を与えているかについての質的なフィードバックを得るためにユーザーとの対話
によって
自分たちの仕事に説明責任を持つことができる

この記事が気に入ったらサポートをしてみませんか?