2017/5/26更新

UIデザインに関する10のガイドライン

Interaction Design Foundation

Interaction Design Foundationはグローバルにデザインレベルの向上を目指す、デンマーク発の非営利団体です。

この記事はInteraction Design Foundationからの翻訳転載です。配信元または著者の許可を得て配信しています。

User Interface Design Guidelines: 10 Rules of Thumb

Jakob Nielsen氏とRolf Molich氏による10のユーザーインターフェースガイドラインに従い、ユーザーのニーズと期待に見合ったデザイン方法を学びましょう。これらのヒューリスティックスは、AppleやGoogle、Adobeのように大成功した企業の多くの製品に反映されています。このような企業のデザインチームが、これらのルールをデザインプロセスにどのように適応しているかは、公開されているユーザーインターフェイスのガイドラインから見てとることができます。

この記事では、ユーザビリティ（Usability）、ユーティリティ（Utility）、デザイラビリティ（Desirability）を改善するための10のルールを紹介します。

理解するべきユーザビリティとデザイラビリティの違い

ユーザーインターフェイスデザインガイドライン

著名なWebユーザビリティコンサルタントでありNielsen Norman Groupの共同経営者であるJakob Nielsen氏と、優れたユーザビリティ専門家であるRolf Molich氏は、1990年代にユーザーインターフェイスデザインガイドラインに関する10のルールを作成しました。

Nielsen氏とMolich氏のヒューリスティックスと、Ben Shneiderman氏の「８つのゴールデンルール」には、多くの重複点があることに注意してください。また、この10のルールは、Shneiderman氏の初版から４年後の８つのゴールデンルールでも参照されています。

システムステータスの可視性。システムは、常にユーザーに対してシステムの状態を知らせる必要があります。
システムと現実世界の一致。デザイナーは、ターゲットユーザーがどのような人であるかを考慮し、現実世界で使う言語と概念をシステムに反映するように努力する必要があります。論理的に情報を提供し、ユーザーの現実世界での経験に基づく期待に応えることによって、ユーザーの認知的負荷を軽減し、システムを使いやすくします。
ユーザーコントロールと自由。前の操作のやり直しや取り消しなどを含む、後戻りできる機能をユーザーに提供します。
一貫性と標準化。グラフィック要素や用語などのインターフェースは、類似したプラットフォームと統一する必要があります。たとえば、１つのカテゴリまたは概念を表すアイコンは、別の画面でも同じ概念を表すべきです。
エラー防止。できる限りいつでも、潜在的なエラーが最小限に抑えられるようにシステムを設計してください。ユーザーは、専門知識を要するような問題と解決方法に関わりたくありません。エラーを引き起こす可能性のあるアクションを排除するか目立たせることで、エラーを防止することができます。
回想より認識。ユーザーがインターフェースを操作している間、ディスプレイにタスクに関連する情報を表示することによって、認知的負荷を最小限に抑えることができます。人間の注意力は限られており、私たちは１回の短期記憶で約５項目しか記憶することができません。このような短期記憶の限界があるため、デザイナーはダイアログの各部分で、ユーザーに記憶を回想させるのではなく、認識させなければなりません。常に、何かを認識することは、回想することより簡単です。認識は、膨大な記憶に到達する手がかりを与え、関連する情報を浮かび上がらせます。たとえば、選択肢がある質問は、短文回答より簡単です。答えを記憶から呼び出すのではなく、認識するだけだからです。
柔軟性と効率性。製品に慣れてくるにつれ、より素早く操作を可能にし、インタラクションを軽減する必要性が高まります。これは、インタラクションの省略やファンクションキー、隠しコマンド、マクロ機能によって実現できます。ユーザーが必要に応じてインターフェイスをカスタマイズまたは調整して、頻繁に行う操作をより便利にできるようにしましょう。
魅力的でシンプルなデザイン。混乱を最小限に抑えてください。不必要な情報は、ユーザーの注意力を散漫にさせ、記憶から関連情報を検索する過程を妨げる可能性があります。そのため、画面表示は進行中のタスクに必要なコンポーネントだけに減らしましょう。また、他のコンテンツに誘導するわかりやすい手段を提供する必要があります。
エラーの認識、診断、回復の支援。デザイナーは、ユーザーが技術用語を理解できないと想定し、エラーメッセージは常に平易な言語に言い換える必要があります。
ヘルプとドキュメント。理想的には、ユーザーがテキストを読まなくてもシステムを操作できるようにしましょう。ただし、問題の種類によっては、テキストが必要な場合があります。ユーザーがヘルプを必要とするときは、操作中のタスクに内容を絞り、ユーザーが直面している問題の解決に向けて必要なステップをテキストにして、わかりやすい場所に配置します。

数十億ドル規模のテクノロジー企業であるGoogleは、上記のヒューリスティックスを反映したデザインを生み出している企業です。 2012年にGoogle検索のヘッドデザイナーであったJon Wiley氏はかつてこのように述べています。

「私がデザインを考え、素晴らしいユーザー体験を作ろうとするとき、ユーザビリティ、ユーティリティ、デザイラビリティの３つの点を考慮します。」

Nielsen氏とMolich氏による10のユーザーインターフェイスガイドラインは、これらのユーザー体験の３つをきちんとカバーしています。つまり、次のガイドラインに従えば、ユーザー体験を向上させることができるのです。

ケーススタディ：Adobeのインターフェイス

北米のコンピュータソフトウェアの大企業であるAdobe Systemsは、Nielsen氏とMolich氏による10のユーザーインターフェイスガイドラインを反映したデザインが、どのように企業を成功に導くかを示す素晴らしい例です。もっとも人気のある製品の１つである画像編集ソフトAdobe Photoshopは、これらのガイドラインを反映し、ユーザーインターフェイスの優れたデザインの特性を示しています。　

Adobe Photoshopがどのようにこれらのガイドラインを反映しているか詳しく見てみましょう。この10のルールを取り入れれば、デザインのユーザビリティ、ユーティリティ、デザイラビリティを向上させることができるでしょう。

１. システムステータスの可視性

Photoshopは、ユーザーの操作が何をもたらすか視覚的に示し、プログラムで何が起っているのか、できるだけ頻繁にユーザーに知らせます。たとえば、レイヤーパレットでレイヤーを動かすと、レイヤーが物理的にドラッグされるのを見ることができます。