UXデザイン原則 – ユーザーが喜ぶための法則

組織が製品を作る際に考慮しなければならない重要な UXデザイン原則 が数多くあります。これらのUX原則は、ユーザーをすべての意思決定の中心に据えるデザイン思考プロセスを補完するものです。

この記事では、企業がより良い製品を作るために利用できる16の UXデザイン原則を紹介します。

UXPinの高度なプロトタイピングとテスト機能によりデザインチームはユーザビリティの問題を最小限に抑え、より良いユーザー体験を生み出すことができます。14日間の無料トライアルに今すぐお申し込みください。

16の UXデザイン原則

その1：ユーザーにフォーカスする

ユーザーに焦点を当てるのは当たり前のように思えるかもしれませんが、多くのデザイナーはユーザーを十分に理解することなく、個人的な好みや偏見に基づいて意思決定を行っています。またユーザーの問題を解決したり、製品に大きな付加価値を与えたりするとは限らないデザインや技術的なイノベーションに、デザイナーは振り回されてしまいます。

最良のデザイン決定はユーザーを理解し、そのニーズを満たすことから生まれます。なぜかというと、人間のための製品のデザインだからです。

経験豊富なUX専門家の多くは、人間ではなくユーザーに焦点を当てることはデザイナーが人間を相手にしていることを忘れてしまうという断絶を生むと考えています。

この言葉を人間中心設計と言い換えることで、UXチームはデザインや技術的な問題を解決することから、”人”を助けることへ考えをシフトすることができます。デザイン思考の原則に基づいてフレームワークを構築することで、常にユーザーを中心に据えることができます。

共感-対象の”人”（エンドユーザー）を知る
問題を定義する
アイデアを生み出す
プロトタイプ
テストとイテレーション

人間中心設計についての詳細はこちらをご覧ください。

その2：一貫性を保つ

デザインの一貫性は良いユーザー体験を提供するための重要な要素です。一貫性のないユーザー体験は製品の一部を使いこなせなかったり、機能のリリースやアップデートのたびに使い方を学び直さなければならないことを意味します。

デザイナーの目標は矛盾を気にすることなくユーザーのニーズを満たす製品を作り、最終的には信頼と愛用者を獲得することです。

デザインシステムを構築することで、デザイナー、プロダクトチーム、開発者が常に同じ要素、タイポグラフィ、色、コンポーネント、アセットなどを使用し、一貫性を養うことができます。

デザインシステムをお持ちでない方はゼロからデザインシステムを構築するための7つのステップをご覧ください。

その3：わかりやすい

ユーザーが簡単に理解できるコンテンツや体験を提供すること。デザイナーは、人は常に最も簡単なルートを探すものだと認識しなければなりません。この競争の激しいテクノロジーの世界であなたが使いやすいものを提供しなければ、他の誰かが使ってしまうでしょう。

製品にオンボーディングが必要な場合は、ステップバイステップでわかりやすいドキュメントを作成してください。

UXPinのドキュメントはその例です。まず手順を分類し、探しているものを簡単に見つけることができます。次に、小見出し、ステップ・バイ・ステップの説明、説明ビデオなどでコンテンツを整理し、情報をフォローして消化しやすいようにしています。

その4：ユーザーに考えさせない

情報設計者でありユーザーエクスペリエンスのプロフェッショナルであるスティーブ・クルーグは、著書『Don’t Make Me Think』の中で、「ユーザーとしては、物事がクリックできるかどうかについて、1ミリ秒も考える必要があってはならない」と述べています。

UXデザイナーはプロダクト、アプリ、Webデザインのデザインスタンダードに従わなければなりません。例えば、ユーザーが予想しないような場所にナビゲーションを隠さないこと。またボタン、CTA、リンクなどがわかりやすく配置され、ユーザーを目的地に導くようにしましょう。

創造性や革新性は、競合他社が思いつかないような問題を解決することで得られるものであり、ユーザーが基本的な基準やプロセスを学び直さなければならないような体験を作り出すことではありません。

人間の心理や認知負荷がUXデザインにどのように関係しているかは、すべてのデザイナーが学ばなければならないことです。認知的負荷を最小限に抑えた製品設計を行うことで、より良いユーザー体験とブランドへの信頼が生まれます。

その5：点・線・面-視覚的な文法を理解する

1900年代初頭にバウハウスで定義されたデザインの基本は、「点」「線」「面」の3つの要素で構成されています。

その7：シンプルな言葉が一番

デザイナーは、人々が理解できないような専門用語や社内でのみ使う用語の使用は避けましょう。複雑な言葉を使ってしまうことで、顧客を失うことにもつながってしまいます。

読みやすさは、たとえ高学歴のユーザーであっても認知的負荷に大きな影響を与えます。これは、ポイント4の「ユーザーに考えさせない」でも同じです。

広く使われているライティングサポートツール「Grammarly」によると、書かれたコンテンツには（アメリカでは）13歳位の言葉を使うべきだとしています。

その8：オーディエンスへの共感を持つ

共感は、人間中心のデザインの核心です。デザイナーは理解を超えて、ユーザーとより深いレベルでつながることができます。デザイナーはユーザーやその苦労、環境に共感するために共感を用います。

エンパシーマップとはUXリサーチツールのひとつで、ユーザーが何を求めているのかを明らかにすることで、デザイナーが共感を得るためのツールです。

見る
聞く
考える
感じる

エンパシーマップは初期のリサーチやユーザビリティテストの際に、さまざまな感情や気持ちを確認するために使用します。ユーザーをより深く理解することで、彼らが言葉にしないような問題を発見することができます。

その9：フィードバック

マイクロインタラクションやアニメーションを使ってユーザーとコミュニケーションをとり、ユーザーの行動に対するフィードバックやコンテキストを提供します。

例えばアクションの処理に時間が必要な場合は、スローバーやローディングアイコンを使ってユーザーに待つように伝えます。エラーメッセージは、ユーザーが問題を修正するのに役立つようなものにしましょう。

ブランドメッセージに沿った一貫したフィードバックを使用することで、常にポジティブなユーザーエクスペリエンスを提供することができます。

その10：ビジネスバリューを忘れてはいけない

デザイナーは、ユーザーとブランドという2つの要素を満たさなければなりません。製品を成功させるためにはユーザーに焦点を当てることが重要ですが、デザイナーは、デザインがビジネス価値を生み出すことも保証しなければなりません。

ビジネスバリューと人間中心のデザインはしばしば重なり合います。例えば、よりスムーズでスピーディなEコマースのチェックアウトでの体験は、ユーザー・エクスペリエンス（ユーザー中心）を向上させると同時に、コンバージョン率（ビジネス価値）を高めます。

ユーザーの問題を解決しようとするときは常にビジネス価値を同時に生み出す機会を探しましょう。

ポーランドのエージェンシー、HERODOTのEwelina Łuszczek氏は、ビジネス価値に対するデザイナーの義務を簡潔な一文にまとめています。

「優れたUXデザイナーはユーザーの目標とビジネスの目標をリンクさせて、ユーザーと会社の両方が利益を得られるように管理します。」

2014年のINFRAGISTICSの調査「The Business Value of User Experience」から4つの素晴らしい例を紹介します。

Bank of America

デザイナーのアクション：登録プロセスのユーザーセンターの再設計
結果：登録数が45％増加

Anthropologie (衣料品会社)

デザイナーの行動チェックアウトプロセスのUX再設計
結果：売上が24％アップ

GFK (コンサルティング会社)

デザイナーの行動：購入ボタンの再設計
結果：売上高が5億ドル増加

United Airlines (航空会社)

デザイナーの行動：ユーザーリサーチ
結果：オンラインチケット販売が200％増加

UXデザインによるビジネス価値の創出についての詳細は、INFRAGISTICSの12ページにわたる調査結果をこちらでご覧いただけます。

その11：ユーザーテスト

その6の「まず問題を特定する」と同様に、ユーザーテストはデザイナーが経験的な推測をするのではなく、実際のユーザーの問題を理解するために非常に重要です。ユーザビリティテストは、UXチームに以下のような貴重なフィードバックとユーザーインサイトを提供します。

ユーザーの問題を解決するためのデザインコンセプトの検証
修正すべきユーザビリティ上の問題の発見
改善の機会を発見する
ユーザーについてより深く知る
ビジネスバリューの機会を特定する

チームは、コンセプトの立案から最終的なデザインの引き渡しまで、常に解決すべき問題を探し、その解決策を検証するためにテストを行う必要があります。テストについて詳しくはこちらをご覧ください。ユーザビリティ・テストとは何か、どのように実行するか。

その12：視覚的な階層化

視覚的な階層は、製品や画面のレイアウトを整理するのに役立ちます。ユーザーは重要な要素を識別し、必要なものを素早く探し出すことができます。

デザイナーは色、コントラスト、スケール、グループ化などの明確なバリエーションを用いて、視覚的な階層を作ります。

このブログ記事のようにライターがヘッダータグを使って記事の内容を構成し、整理することも視覚的な階層化の好例です。

Nielsen Norman Groupのこちらの記事も合わせてご覧ください。：Visual Hierarchy in UX: Definition

その13：アクセシビリティ

アクセシビリティは、障害のあるユーザーが製品を利用できるようにするための重要な設計上の考慮事項です。また、Google社が「次の10億人のユーザー」と呼ぶ人々（初めてテクノロジーを利用する人々）についても、アクセシビリティを考慮する必要があります。アクセシビリティに関する主な検討事項は以下の通りです。

スクリーン・リーダーがコンテンツや指示を解釈できるようにする
読みやすさを損なわないような色やコントラストにする
すべてのユーザーがリンクやナビゲーションを理解できるよう、アイコンとテキストを組み合わせて使用すること
読みやすいフォントと文字サイズを使用する
UXデザイナーは、デザインツールがアクセシビリティチェック機能を備えていないため、これらの配慮を忘れがちです。

UXPinでは、「一人、ひとりに合わせたデジタル体験を提供したい」という思いがあります。そこで、デザインエディタにアクセシビリティ機能を組み込みました。

14日間の無料トライアルに登録して、UXPinでよりインクルーシブな製品作りを始めましょう!

その14：ユーザーがコントロールできるようにする

可能な限りユーザーが自分の考えを変えたり、送信した情報を編集したりすることが簡単にできるようにしましょう。例えば、チェックアウトフローのすべての画面に戻るボタンを用意することで、ユーザーはエラーを修正したり、変更を加えたりすることができます。

また意図的であるかどうかに関わらず、ユーザーに誤解を与えないようにしてください。

多くの企業ではユーザーが定期購入をキャンセルできないように設定でオプションを隠したり、サポートに連絡するように仕向けたりしています（サポートでは通常、定期購入を継続するためのインセンティブを提供しようとします）。

ユーザーが考えを変えたり情報を編集したりする手段を制限することはブランドへの不信感を生み、お客様に他の解決策を探させることになります。

その15：デザインハンドオフ

デザインの受け渡しは社内のプロセスですが、デザインの受け渡しがうまくいかないと不必要な遅延や技術的なエラーが発生し、ユーザーに悪影響を及ぼします。

UXチーム、プロダクトデザイナー、開発者が協力してプロセスとプロトコルを開発し、デザインハンドオフを最小限のエラーでスムーズに行う必要があります。 UXPin Mergeは、デザインと開発の間のギャップを埋めるのに役立ちます。

まず第一に、Mergeはデザイナーがコンポーネントをリポジトリと同期させることができるので（GitまたはStorybookの統合を介して）、デザインチームは完全に機能する高忠実度プロトタイプを構築することができます。

また、UXPinのSpec Modeは、開発者がデザインの詳細情報を得るための簡単なハンドオフプロセスを提供します。

プロパティの検査：サイズ、グリッド、カラー、タイポグラフィなど、要素やコンポーネントのCSSを取得できます。
距離の測定：要素にカーソルを合わせると、要素とキャンバスの端の間の距離が表示されます。
スタイルガイド：製品のデザインシステムの概要と、必要に応じてアセットをダウンロードするオプションを表示します。

UXPin Mergeのパワーと、React用のGit統合や他の人気フロントエンドライブラリ用のStorybookなど、お好みのテクノロジーを接続する方法をご紹介します。

その16：再評価と修正

UXデザインの素晴らしい点の1つは、製品やユーザーエクスペリエンスを継続的に改善できるよう、常に進化し続けていることです。新しい製品やリリースを開始するとデータを分析し、デザインを見直す作業が始まります。

何千人、何百万人もの人々が製品を使用したとき、製品のパフォーマンスはどうなるのか？
ユーザーは意図したとおりに製品を使っているのか？
ユーザーは、ユーザー体験を向上させるための近道を使っているか？
ヒートマップはユーザーの行動について何を教えてくれるのか？
サインアップやチェックアウトの際、ユーザーはどこで脱落するのか？

製品のパフォーマンスを分析する際、チームは常にユーザー・エクスペリエンスを向上させる方法を模索するとともに、ビジネス価値を高めるための道筋を探るべきです。

まとめ

今回ご紹介した16の UXデザイン原則はワークフローを改善し、ユーザーにとってより良い製品体験を生み出すために活用していただけると幸いです。これは決して網羅的なリストではありませんので、常にプロセスを改善する方法を模索することをお勧めします。

UXPinは、企業の健全な UXデザイン原則を育むためのコラボレーションデザインツールです。UXPinはデザイナー、製品チーム、開発者の間のギャップをうまく埋め、UXデザインプロセスのあらゆる側面を改善することができる唯一のデザインツールです。

UXPinで新しいデザインの世界を探求するために、14日間の無料トライアルを始めてみませんか？