『Laws of UX』(2020年)は、ユーザーエクスペリエンス(UX)、特にWebやアプリデザインに関心のあるすべての人にとっての実用的なガイドブックです。優れたプロダクトデザインを支える基本的なルールを解説し、それらのルールが人間の心理学とどのように結びついているかを示します。
この本から得られるもの：優れたWebデザインを支える心理学を知る
良いWebサイトとは何でしょうか？「見れば分かる」ものだと思うかもしれません。しかし、優れたWebデザインには多くの要素が考慮されています。中でも重要なのが、人間の心理学や行動科学の関連原則です。
本要約では、ジョン・ヤブロンスキ著『Laws of UX』をもとに、デザイナーが効果的でユーザーフレンドリーなWebデザインを生み出すために従う2つのルールや原則を各セクションで簡潔に説明します。合計10の原則を扱い、最後のセクションでは、特定のデザイン要素が今後検討すべき倫理的ジレンマをどのように提起しているかを説明します。
ヤコブの法則とフィッツの法則
まずは、ユーザーフレンドリーな体験を生み出すための2つの基本原則、ヤコブの法則とフィッツの法則から始めましょう。
ヤコブの法則とは、ユーザーはオンライン上の時間の大半を馴染みのあるWebサイトで過ごしており、新しいサイトにも同様の機能を期待するというものです。ドアに取っ手があることを期待したり、照明のスイッチが入口のそばにあることを期待したりするのと同じように、ユーザーは過去の経験に基づいて特定のデザインの慣習を期待します。
この原則は、デザイナーが慣習に従うことを促します。そうすることで、ユーザーはインターフェースに苦戦することなく、コンテンツやメッセージ、プロダクトに集中できるのです。つまり、精神的な負担を最小限に抑えることが本質です。デザイナーはナビゲーションや検索バーなどの一般的なパターンを利用することで、ユーザーが一から学び直すことなくタスクをこなせるようにします。
これはイノベーションが否定されるという意味ではありません。しかし、変更が必要な場合は、ユーザーのニーズや文脈に合わせるべきです。新しいデザインをユーザーと一緒にテストすることで、ユーザーが変更を理解し適応できることを確認できます。
一方、フィッツの法則は、画面上の要素とのインタラクションのしやすさを掘り下げます。重要な要素は2つあります。要素までの距離と要素のサイズです。簡単に言えば、デザイナーは、使用する入力デバイスに関係なく(マウスを使うデスクトップ画面でも、親指や指を使うタッチスクリーンでも)、インタラクティブな要素を簡単にタップまたはクリックできるようにしなければなりません。
フィッツの法則を効果的に適用するには、まずボタンなどのインタラクティブな要素を容易に選択できる十分な大きさにします。次に、誤ったタップやクリックを防ぐために、要素間に十分なスペースを設けます。そして、ユーザーがスムーズにアクセスできる位置にインタラクティブな要素を配置します。
LinkedInがiOSアプリで「承認」ボタンと「拒否」ボタンを互いに近づけすぎて配置した過ちを繰り返してはいけません。このような問題は、特に画面スペースが限られているモバイルデバイスではユーザー体験を妨げます。
ヒックの法則とミラーの法則
Webデザインの世界では、ヒックの法則とミラーの法則が、効果的なデジタル体験を生み出すための貴重な指針となります。
ヒックの法則は、デザインにおけるシンプルさの重要性を強調する原則です。ユーザーに提示する選択肢や複雑さが増えるほど、意思決定に時間がかかるというものです。つまり、デザイナーとしての主な仕事は、情報を整理し、ユーザーを不要な選択肢や手順で圧倒しないように道のりをシンプルにすることです。
テレビのリモコンの進化を考えてみましょう。テレビに機能が追加されるにつれて、リモコンは過度に複雑になり、操作にかなりの精神的労力が必要になりました。それに対応して、必要最低限のボタンを備えた「祖父母向け」リモコンが登場しました。そして今日では、スマートテレビのリモコンは非常に簡素化されたコントロールになっています。
同様に、Google検索やSlackなどのデジタルプラットフォームもヒックの法則に沿った原則を実装しています。Google検索は、ユーザーが検索を開始した後にのみさまざまな検索結果フィルターを表示し、最初から圧倒されないようにしています。一方、Slackはユーザーに機能を段階的に紹介し、メッセージングから始めて、ユーザーがインターフェースに慣れてきたら徐々に他のオプションを表示します。
アイコンもシンプル化の手段の一つです。視覚的に魅力的でスペースを節約できますが、アイコンの意味は世界中のユーザーによって異なる可能性があることを覚えておくことが重要です。そのため、特にナビゲーション要素については、アイコンとテキストラベルを組み合わせて使用することが、明確さと使いやすさを向上させるベストプラクティスです。
ヒックの法則を実装する際には、抽象化しすぎるほど単純化しすぎないように注意してください。目標は、シンプルさと機能性のバランスを取ることです。
次にミラーの法則に移りましょう。これは、人は一度に作業記憶に保持できる項目が通常7つ程度であるというものです。この原則は「チャンキング」と呼ばれる概念を通じてUXデザインに影響を与えてきました。
チャンキングとは、情報をより管理しやすく理解しやすい形にグループ化することです。電話番号の形式を考えてみてください。10桁または11桁の連続した数字を思い出すのは、3桁または4桁のチャンクに分けて覚えるよりもはるかに難しいものです。
Webデザインでは、チャンキングはユーザーの理解と記憶保持を高める上で重要な役割を果たします。見出し、小見出し、余白、書式設定などの要素がチャンキングに寄与し、コンテンツをより消化しやすく整理されたものにします。特にWebサイトの商品一覧では、画像、タイトル、価格、詳細がグループ化されていると効果的です。例えばNikeは、サイドバーで関連フィルターをグループ化することで、ユーザーのナビゲーションとフィルタリングを簡素化しています。
ミラーの法則の例外はナビゲーションバーです。ナビゲーションバーには7つ以上の項目を含めることができます。ユーザーは何も覚える必要がなく、すべての選択肢がそこに表示されており、それに従って移動できるからです。
ポステルの法則とピーク・エンドの法則
次に、効果的なデザインのもう2つの重要な原則、ポステルの法則とピーク・エンドの法則に進みましょう。
ポステルの法則は、自分が行うことは控えめに、他人から受け入れることは寛大にする必要があるというものです。これは、ユーザーが多様で、時に一貫性がなく、感情に左右されることが多いという理解に基づいています。したがって、デザインはこの多様性に対応できるよう、信頼性が高くアクセシブルであるべきです。
例えば、AppleのFace IDは、追加の入力を必要とせずにユーザーの顔を認識することで認証を簡素化します。もう一つの例は、イーサン・マルコットが先駆者となったレスポンシブWebデザインです。この機能により、Webサイトは異なるデバイス、画面サイズ、閲覧環境にコンテンツを適応させることができます。
デザイナーは、タッチ、ジェスチャー、音声など、さまざまな形式のユーザー入力を予測し、それらを受け入れるインターフェースを作るべきです。また、言語によって異なるテキストの展開なども考慮し、デザインが機能的で読みやすいままであることを確認する必要があります。この原則を受け入れることで、デザイナーは回復力があり適応性の高いプロダクトとサービスを生み出します。
一方、ピーク・エンドの法則は、人が体験をすべての瞬間の合計ではなく、感情的なピークと終わりに基づいて記憶するということを探求します。この認知バイアスは、ユーザーがプロダクトやサービスとのやり取りをどのように認識し思い出すかに影響します。
例えば、Mailchimpは、一括メールキャンペーンで「送信」を押すことの感情的な意味を理解しています。そのため、作業を完了しようとするまさにその瞬間に、ユーモアとアニメーションを使って不安を和らげます。Uberは、配車を待つフラストレーションを、透明性とエンターテイメントを提供することで軽減します。マップ上でドライバーが近づいてくるのを見ることで、待ち時間がゲームのような体験に変わり、経験の記憶にポジティブな印象を残します。
できる限りユーザーの立場に立ち、体験における感情的なピークとエンドポイントをマッピングしてください。そうすることで、最も重要な瞬間に楽しい瞬間をデザインすることに集中できます。
美的ユーザビリティ効果とフォン・レストルフ効果
次は？美的ユーザビリティ効果とフォン・レストルフ効果です。複雑そうに聞こえる名前に惑わされないでください。これらの原則はとても分かりやすいものです。
美的ユーザビリティ効果は、美しさとユーザビリティの関係を示しています。研究により、人は魅力的なデザインの方がより良く機能すると信じる傾向があることが明らかになったことから生まれました。つまり、美的に優れたデザインはポジティブな感情を引き起こすだけでなく、認知能力やユーザビリティの認識も高めるのです。
Appleの製品は、そのエレガントなシンプルさでこの概念を体現しています。しかし、バランスを取ることが重要です。過度に美しいデザインは、実際にはユーザビリティの問題を覆い隠してしまう可能性があります。
次に、フォン・レストルフ効果に移りましょう。これは、人間が違いに気づく生来の能力を認識するものです。デザインにおいては、情報過多を避けながらユーザーの注意を効果的に導くことを意味します。色、形、サイズ、位置、動きなどの要素を活用して、重要なコンテンツやアクションを強調できます。
例えば、重要なアクションボタンに独特のビジュアルスタイルを使用することで、ユーザーが確実にそれに気づき、正しく選択できるようになります。ただし、過度なコントラストはユーザーを圧倒し、重要な要素の効果を低下させる可能性があるため、慎重に行いましょう。また、視覚的特性をコントラストに使用する際は、色覚に障害のあるユーザーや動きに敏感なユーザーのニーズも考慮することを忘れないでください。
まとめると、視覚的に魅力的なデザインはユーザビリティを高めることができますが、機能性を覆い隠すべきではありません。そして、視覚的なコントラストを通じて重要な要素を差別化することは効果的ですが、ユーザーを圧倒しないように適度さが求められます。
テスラーの法則とドハティのしきい値
最後の2つの原則、テスラーの法則とドハティのしきい値は、効率的でユーザーフレンドリーなインターフェースを作る上でさらに貴重な洞察を提供します。
テスラーの法則は、複雑さ保存の法則とも呼ばれます。それは、あらゆるシステムには削減できない複雑さの要素があるというものです。ここでの目的では、これは基本的な問いに答えます：ユーザーの負担となる複雑さはどの程度で、デザイナーや開発者が処理すべき複雑さはどの程度なのか？
もちろん答えは、この負担をできるだけユーザーから遠ざけることです。Gmailのようなメールクライアントは、送信者のアドレスを自動入力し、数文字入力すると受信者のアドレスの候補を表示することで、メール作成プロセスを簡素化しています。ショッピングサービスも、情報を保存しワンクリック購入を可能にすることで、可能な限り摩擦のないものにしようとしています。
一方、ドハティのしきい値は、ユーザー体験におけるパフォーマンスの重要な役割を強調します。コンピュータシステムとユーザーのやり取りで応答時間が400ミリ秒未満の場合、生産性は大幅に向上し、フラストレーションは最小限に抑えられます。
ただし、パフォーマンスは単なる技術的な関心事ではありません。優れたユーザー体験の基本的な側面です。知覚される速度を向上させるには、スケルトンスクリーンやプログレッシブ画像読み込みなどのテクニックを使用します。例えばFacebookは、コンテンツが最終的に表示される領域に空のシェード付きブロックを表示するスケルトンスクリーンを使用しています。
これらのテクニックは、読み込み時間がより速いという錯覚を作り出し、待ち時間の知覚を減らします。これにより、ユーザーは満足し、エンゲージメントが高まります。
倫理的なデザインを目指して
前のセクションで見てきたように、人間の行動に関する理論と原則は、テクノロジーの設計方法に大きな役割を果たしています。これらの実践の結果として、テクノロジーは意図的にも非意図的にも人間の行動を形作ることができます。
研究によると、スマートフォンがそこにあるだけで認知能力が低下する可能性があります。一方、ソーシャルメディアの使用は若年成人のうつ病や孤独感の増加と関連しています。この知識を踏まえると、ユーザーフレンドリーで倫理的なインターフェースを作ることはデザイナーの責任です。
ユーザーに悪影響を及ぼしてきたいくつかのデザイン要素を見てみましょう。
第一に、間欠的変動報酬は、人々から中毒的な反応を引き出すよく知られた方法です。最も一般的な例は、スロットマシンの前に一日中座っていることをいとわないギャンブラーです。同様に、アプリは通知、フィード、更新メカニズムを使用してユーザーを引きつけ続けます。
次に、無限ループ(自動再生動画や無限スクロールなど)は、意思決定のポイントを取り除くことでユーザーを夢中にさせ続けることを目的としています。
第三に、ソーシャルメディアのいいねやコメントは、社会的承認と帰属意識への私たちの欲求に訴えかけます。
そして、ダークパターンと呼ばれる欺瞞的なデザイン手法もあります。これはインターネットの至る所で見られます。例えば、一部のショッピングサイトには、常に在庫が少ないと表示される商品があることに気づいたかもしれません。しかし、実際には売り切れることはありません。小売業者は、機会が失われる危険性があると人々が感じると購入する可能性が高くなることを知っているため、この欺瞞的な戦略を使用します。
デザイナーはこれらの倫理的懸念に取り組む上で重要な役割を果たします。企業の目標と人間の目標を一致させることは、あなたの責務です！ユーザーの時間と幸福を尊重する、時間をかけた意図的なデザインこそが今後の方向性です。チームを多様化することも、盲点を見つけ、包括的なデザインを確保するために不可欠です。
心理的原則を日常のデザインに統合する必要があることは間違いありません。これには、チーム内での対話の文化を育み、人間の体験を置き換えるのではなく向上させることに沿ったデザイン原則を確立することが含まれます。このプロセスに従うことで、ユーザー中心で倫理的なデジタル体験を生み出すことができます。
最後のまとめ
ユーザーフレンドリーなWebデザインは、人間の行動を理解し、人々の限界や好みを考慮した原則を適用することに依存しています。これらの原則の多くは、使いやすさとアクセシビリティに帰着します。
具体的には、ユーザーのニーズを予測し、新しい方法を学ぶ必要のない親しみやすいデザインを作ることを含みます。また、異なる画面サイズ、情報入力手段、言語を考慮することも意味します。最後に、これらの原則は、情報を効率的に整理し、あまりにも多くの対照的な要素でユーザーを混乱させず、人間の体験を損なうのではなく向上させるためにデザインを使用することを促進します。
