ニールセンのユーザビリティ10原則を理解して、UIデザイン・UXデザイン・Webデザインに活かそう！

本記事は、デザインにおいて非常に重要な要素である「ユーザビリティ」について、その第一人者であるヤコブ・ニールセンが提唱する「ユーザビリティ10原則」について解説します。Webデザイナー / UIデザイナーは、これらの原則を理解し、WebデザインやUIデザインに活かすことで、ユーザー満足度を向上させることができます。ぜひ最後までチェックしてみてください。

ユーザビリティとは

そもそも「ユーザビリティ」の定義とは何なのでしょうか。

ユーザビリティとは、製品やサービスがユーザーにとってどれだけ使いやすく、効率的で、効果的であるかを測る指標のことをさします。ウェブサイト、ソフトウェア、アプリケーションなどのデザインに関連して使用されます。ユーザビリティは、ユーザーエクスペリエンス（UX）デザインの中心的な概念であり、ユーザーが特定の目的を達成する際の容易さや満足度に重点を置いています。

ユーザビリティは以下の5つの主要な要素で構成されています。

学習しやすさ（Learnability）

初めてのユーザーがシステムを迅速に理解し、簡単に操作できることを指します。

効率（Efficiency）

ユーザーがシステムを理解し、タスクを迅速に進められる様にすることを指します。システムがユーザーの生産性を向上させることが重要です。

記憶容易性（Memorability）

ユーザーがシステムを一度使用した後、後で再び使用する際にどれだけ簡単に操作を思い出せるかを指します。これは特に、頻繁に利用しないシステムにとって重要な要素です。

エラー（Errors）

ユーザーがシステムを使用している間にエラーを起こす頻度や程度、そしてエラーから回復するのにかかる時間。ユーザビリティの高いシステムでは、エラーが少なく、回復が容易であることが求められます。

満足度（Satisfaction）

ユーザーがシステムを使用している間の主観的な満足感。システムが使いやすく、効果的であり、ユーザーがタスクを達成する過程でストレスや苛立ちを感じないことが重要です。

ヤコブ・ニールセンについて

ヤコブ・ニールセン（Jakob Nielsen）は、デンマーク出身の著名なウェブユーザビリティの専門家です。ヒューマン・コンピュータ・インタラクション（HCI）の分野で広く知られています。
コンピュータ科学の学位を持ち、専門分野はウェブデザイン、ユーザビリティテスト、ユーザエクスペリエンス（UX）デザインです。

1990年代初頭から、ニールセンはウェブユーザビリティに関する多くの著作や調査を行っており、彼のアイデアと指導はウェブデザイン業界に大きな影響を与えてきました。特に「ユーザビリティの10の法則」（”Ten Usability Heuristics”）として知られる一連の基本原則を提唱しました。

では、ユーザビリティ10原則の詳細を見ていきましょう。文中には「システム」という言葉が用いられています。この「システム」という言葉は、機能というよりも、ユーザーが操作しているデバイスや見ているデザインなどとして捉えるとより理解しやすいかもしれません。

ユーザビリティ10原則

1. システムの状態を可視化する (Visibility of system status)

ユーザーが現在どのような状態に自身があるかを分かりやすく伝えることが重要です。これには、ローディングインジケーターや進行状況の表示などが含まれます。今何が起こっているのか、今どの様な状態なのかを明確に伝えることで、ユーザーに対して不安感を払拭し、安心感を与えることができます。また自身がどんな操作をしたのかや、次に操作すべきアクションにを示唆することができるでしょう。

2. 現実世界とシステムとを一致させる (Match between system and the real world)

ユーザーが操作するシステムは、ユーザーが理解しやすい言語やデザインで示されることが望ましいです。用語やアイコン、操作方法などは抽象的な表現になることがありますが、これを現実世界で良く用いられている表現に結びつけることが重要です。例えばWebサイトやアプリなどで使われるボタンの形状は、角が丸かったり、場合によって立体感があったりします。現実世界にあるボタンと近い形状にすることでユーザーは押せると認識し、ボタンとしての機能を果たすことができます。

3. ユーザーに操作の主導権と自由度を与える (User control and freedom)

ユーザーが誤った操作をした際に、容易に元の状態に戻せるようにすることが重要です。アンドゥ機能、キャンセルボタン、前のページに戻るボタンなどを適切に配置し、ユーザーが自由に操作できる環境を提供しましょう。UX / UIの設計を行う際に、カスタマージャーニーに基づいた画面設計を行うことがありますが、ユーザーは必ずしもストーリー通りに遷移しないことがあります。この様な場合でもユーザーに画面遷移や操作を自由に行えるようなUI設計を行うことが望ましいです。様々な寄り道をしながらも、良いサービス設計であればユーザーは内容を理解し、先へと進んでくれることでしょう。

4. 一貫性と標準化を保持する (Consistency and standards)

システム内で繰り返し使用されるデザインパーツ・コンポーネントや、文言表記については、一貫性のあるデザインや用語を使用することで、ユーザーは迷わず操作ができるようになります。近年では、この概念はデザインシステムとして体系化されてきています。また、業界として標準となっている様なレイアウト・デザインに沿ってデザインすることで、ユーザーが他のシステムで培った知識や経験 (ヒューリスティック) を活用できるようになります。

5. エラーを予防する (Error prevention)

デザインや操作の工夫によって、ユーザーがエラーを起こす可能性を事前に防いだり、最小限に抑えることが重要です。たとえば、入力フォームにおいて、記入例を示したり、入力直後にJSなどで内容のチェックを表示させたり、確認ページの設置、必須項目をわかりやすく掲載する、といったことで、誤った操作や入力を事前に防ぐことができます。

6. 記憶しなくても、見て理解できるデザインにする (Recognition rather than recall)

ユーザーがUIやシステムを操作する際に、深く考えなくても直感的に操作ができる様にすることが重要です。情報をシンプルにし、適切なレイアウトやグルーピング、階層構造を考慮してUIデザインをすることで、ユーザーが迷わずに情報を探すことができます。また、不要な情報や選択肢を削ぎ落としたデザインにすることで、ユーザーが目的に集中できるようにしましょう。

7. 柔軟性と効率性を持たせる (Flexibility and efficiency of use)

システムは、初心者から上級者まで、幅広いユーザーが使いやすいように設計されるべきのものです。初心者ユーザーには、操作ガイダンスやヘルプの機能を充実させる一方で、上級者ユーザーにはショートカットやカスタマイズ機能も用意しましょう。これにより、異なるスキルレベルのユーザーが同じシステムを効果的に利用できることが理想です。

8. 最小限で美しいデザインを施す (Aesthetic and minimalist design)

極力、ユーザーインターフェイスに必要ない情報を配置しないようにしましょう。例えば、文言表記にすると冗長になってしまうケースでは、ピクトグラムやカラーで分類されたアイコンを用いることで表現するこができます。アクティブな状態は緑で表記するなどのアイデアがあるでしょう。

9. ユーザーによるエラー認識、診断、回復をサポートする (Help users recognize, diagnose, and recover from errors)

エラーが発生した場合、その原因と対処方法を明確に伝えることが重要です。例えば入力フォームが続く様な画面の場合は、エラーメッセージを表示させるとともに、エラーが起きた箇所へスムーズに画面遷移や画面スクロールができる様な工夫があると便利でしょう。

10. システムのヘルプとマニュアルを用意する (Help and documentation)

ユーザーが必要な情報やサポートに容易にアクセスできるようにすることが重要です。オンラインヘルプ、FAQ、チュートリアル、使い方ガイドなどを充実させ、ユーザーが自分で解決策を見つけられるようにしましょう。また、ヘルプ情報は簡潔かつ具体的で、検索しやすい形式で提供することが望ましいです。

Webデザイナー・UIデザイナー・UXデザイナーが意識すべきこと

上記で述べた原則をWebデザイン、UIデザイン、UXデザインのプロセスに取り入れることで、ユーザーの満足度や利便性が向上し、より使いやすいシステムを構築できます。

Webデザイナー、UIデザイナー、UXデザイナーとして、これらの原則を常に意識し、ユーザーの視点に立ったデザインを心がけましょう。これにより、ユーザーエクスペリエンスが大きく向上し、成功への道が拓けるでしょう。

• 経験者デザイナー向け専門転職エージェント BRIK JOB ｜ クリエイター支援メディアが始めた業界特化型の転職支援サービス

BRIK JOB｜キャリアカウンセリング｜カンタン1分で転職相談｜経験者デザイナー・ディレクター・エンジニア向け転職エージェントで年収アップを

デジタル・デザイン・広告業界の専門転職エージェントBRIKでは、どんな仕事ができるのか、どの様にスキルを成長させられるのか、などから待遇や条件面までクリエイターの求める全てをサポートします。費用はもちろん無料。まずはカンタン1分で無料の転職相談を！