デジタル化社会が進む現代において、プロダクトデザインの重要性は増しています。その中で特に注目すべき分野がSaaS（Software as a Service）であり、ここではユーザーエクスペリエンス（UX）の最適化が重要な要素となります。
そんな中、UXを最大化するための重要な要素として挙げられるのが「一貫性」です。しかし、「一貫性とは何か？」、「なぜ一貫性は重要なのか？」についてはしっかりと理解していない人も多いのが現状です。この記事では、一貫性の意味とその重要性について掘り下げ、具体的な事例を交えて解説します。
目次
一貫性の本質
一貫性とは、ある製品やサービスの各部分が、共通のルールやパターンに基づいて機能することを指します。これには
- 視覚的な一貫性（色、形状、サイズ、配置など）
- 機能的な一貫性（同じ動作や操作が同じ結果を引き起こすこと）
- 内部的一貫性（製品やサービス全体での一貫性）
- 外部的一貫性（普段使っている業務ツールとの一貫性）
などが含まれます。普段業務をしている中でも、一貫性というワードが出てきますが、何の一貫性なのかが相手と認識が合っていない中進むケースもあるのかなと思います。
とはいえ、これらの一貫性を保つことにより、ユーザーは製品やサービスの全体像をこれまでのユーザーの学習や体験により、より直感的に理解することが可能となり、結果的に認知的な負担が軽減されます。
それぞれの一貫性について少し深掘りしてみましょう。
視覚的な一貫性（色、形状、サイズ、配置など）
視覚的一貫性は、製品内での各種デザイン要素（色、形状、サイズ、配置など）が統一されている状態を指します。この一貫性があると、ユーザーは製品内での移動や操作がスムーズになり、迷いにくくなります。視覚的一貫性は、ブランドイメージの強化にも寄与し、ユーザーが製品に対する信頼感を持つ基盤を作ります。
イメージしやすいのは、ボタンの色や形状がアプリケーション全体で統一されている状態や、アイコンのスタイルやサイズが一貫しているなどでしょうか。
デザインシステムを作る際によく出てくる一貫性はこの視覚的一貫性が多い印象です。
（考察）色の管理方法
色の場合、名前の付け方が色々な形があるので、それぞれユースケースによって異なるとは思いますが、よくあるのは
- ユーザーのアクション、カラーへの役割ベースでカラー名をつける（ex. Action, Status, Error, line, Placeholder etc…）
- カラー名をそのままつける（ex. Gray-100, Gray-80, Red-100 etc…）
などがあるかなと思います。それぞれメリット・デメリットがあるのですが、個人的には後者の方が後々使いやすい印象です。
役割ベースの場合は、機能と配色の一貫性を保つことができます。ただ、一方で、複数の役割が同じ色になった場合、色の管理コストがかかってしまうというデメリットがあります。
カラー名をそのままつける場合は、色の管理コストがかかりづらい一方で、機能と配色の一貫性がどうしてもズレてしまう×デザイナーが増えると意思疎通が難しい（徹底的に教育をしないと…）といったデメリットがある印象です。
（うまく管理されている方のお話を聞いてみたい）
機能的な一貫性（同じ動作や操作が同じ結果を引き起こすこと）
機能的な一貫性とは、製品内で同じアクション（クリック、スワイプなど）が常に同じ結果や反応を引き起こすことを意味します。この一貫性が保たれることで、ユーザーは製品の各部分において予測可能な反応を期待できます。これが、ユーザーが製品を効率よく、かつ安心して使用するための重要な要素です。
よく忘れがちなのは、Tooltip表現やHover表現、Disable表現でしょうか。開発との関係もあるので、難しいのは承知ですが、同一のインタラクション表現にすることができれば、ユーザーの学習コスト・認知コストも軽減させることができます。
参考URL：https://www.nngroup.com/articles/consistency-and-standards/
内部的一貫性（製品やサービス全体での一貫性）
内部的一貫性は、製品やサービス全体でのデザインや機能、インタラクションが統一されている状態を指します。これにより、ユーザーは製品全体で一貫した体験を得ることができ、新しい機能やページに遭遇しても違和感を感じにくくなります。内部的一貫性は、製品の使いやすさとユーザー満足度を高めるために不可欠です。
機能的一貫性と重複する部分が一定あるかなと思いつつ、「機能的な一貫性」の方はコンポーネントそれぞれの挙動だとすると、内部的一貫性は、それぞれのアクションフロー（ex. 新規作成後、保存を押すと、ユーザーフィードバックがかえってくる）などをイメージするといいでしょうか。
Aの時は、Feedbackを出して、Bの時はFeedbackは出さないといった場合があると、ユーザーは「ちゃんと保存されたのかな？」と不安になる可能性があります。それらを一定同じフローにすることで、混乱をなくすことができるわけですね。
※フローもそうですが、ユーザーが現在どのようなステータス・モード（ex. 編集中、閲覧中etc…）なのかは明確にしてあげたほうが学習コストが上がらなそうですね。
外部的一貫性（普段使っている業務ツールとの一貫性）
話には出てこない「外部的一貫性」というものもあるかなと思っています。
外部的一貫性は、製品が他の業務ツールやプラットフォームと整合性を持つことを指します。これは、ユーザーが他のツールで培ったスキルや知識を新しい製品にも適用できるようにするために重要です。
ユーザーの生活圏・環境を考えてみると、自分たちが設計したサービスのみを使うことは基本なく、すでになんらかの他のツールを使っていて、その上で自分たちのサービスを使うケースが多いわけです。
そう考えると、すでにAというものを押すとBが出てくるといった認知はユーザー側にはすでにされている状態のため、その挙動と大きく異なるものが提供されてしまうと学習コストがとてもかかってしまいます。
使い始めの学習コストを上げないという意味でも、想定されるユーザーが普段どんなツールを使っていて、そのツールではどういったインタラクションをしているのかを設計時に想定することは大切かなと思います。
※material design, Human Design Guidelines などOS側が提供されているデザインガイドラインを読むべき理由は、上記の外部的一貫性との整合性を取るために学習すべきということだと自分は考えています。
一貫性の力: 具体的な事例から学ぶ
具体的な事例を通じて一貫性の重要性を探ります。
Salesforce： CRMソフトウェアのリーダーであるSalesforceは、一貫したUIデザインを通じて卓越したユーザーエクスペリエンスを提供しています。特に注目すべきは「Lightning Design System」で、これによって一貫性を保つためのデザインガイドラインとコンポーネントのライブラリを提供しています。参考リンク
Slack： チーム間のコミュニケーションを円滑にするSlackでは、全てのチームが一貫したインターフェースを通じてコミュニケーションを取ることができます。これにより、ユーザーは新しいチャネルや機能に慣れるのに時間を費やすことなく、効率的にコミュニケーションを進めることができます。参考リンク
Airbnb： 旅行者と宿泊施設を繋ぐAirbnbもまた、一貫性を重視したデザインを採用しています。予測可能で一貫性のあるインターフェースを通じて、ユーザーはストレスなく操作を行うことができます。参考リンク
これらの事例からも明らかなように、一貫性はユーザーが製品やサービスを理解し、使い続けるための鍵となります。プロダクトデザイナーとして、優れたユーザーエクスペリエンスを提供し、ユーザーに製品を信頼してもらうために、一貫性を保つことは極めて重要な課題となります。
最後に
一貫性は、ユーザーエクスペリエンス(UX)を向上させるための基本的な要素であり、ユーザーの直感的な操作、効率的な学習、そして製品に対する信頼性の向上という、重要な三つの要素に対して深い影響を与えます。Salesforce、Slack、Airbnbといった成功したSaaS企業が示すように、一貫性の保持はその成功に不可欠な要素であると言えます。
SaaSのアプリケーション設計に関わる人々にとって、一貫性の重要性を理解し、それを製品設計に取り入れることは非常に大切です。ユーザーが迅速に慣れ、短期間で理解し、そして長期間にわたって信頼できる製品を設計するためには、各要素が一貫した方法で動作するようにすることが重要です。
しかし、一貫性を追求するだけが全てではありません。ユーザーのニーズや環境は変化しますし、新たな技術の出現により、それまでの「一貫性」が必ずしも適切でなくなることもあります。そのため、一貫性を保つための取り組みは柔軟さとともに進められるべきです。
結局のところ、一貫性は「ユーザー中心」の設計思考の一部であり、ユーザーが製品を使い続け、満足するための手段です。そして、それはSaaS製品の成功へと直結するのです。
