コンプレクション・リダクションをかたどる5つの特徴

これから私たちがコンプレクション・リダクションを採用するのに、注意すべき点は果たしてどんなところなのでしょうか。
マイケル・ホートン氏は、コンプレクション・リダクションを採用する上で以下のガイドラインを参考するようにアドバイスしています。

1. 採用している色彩を減らす

色彩を取り除きましょう。
差し色として1色くらいは残してもいいですが、多用しないようにするのがポイントです(Facebookなら紺色・twitterなら水色など、ブランドアイデンティティを示すカラーが好まれているようです)。
色彩は主役ではないので、できるだけコンテンツの色が映えるようにしましょう。

2. 見出しを大胆に表示する

見出しをより大きく、より太く、より黒くしましょう。
最初にできることは、今すでにデザインしているフォントのサイズを20〜30ピクセル大きくして、重量感を持たせます。

3. UIはシンプルにデザインする

UIアイコンは、シンプルで、より繊細に、そしてパッとみてすぐに識別できるようにしましょう。
アイコンでも色を多用してはいけません。
アイコンは順に、ホーム・検索・プライマリーアクション、セカンダリーアクション、プロフィールの順で並べます。

4. 余白をたっぷりと取る

ホワイトスペースを、現在のデザインの2倍、3倍、可能であれば4倍にしましょう。
余白に関しては、多くても多すぎることはありません。

5. アプリアイコンは存在感を出す

アプリのアイコンはビビッドで明るい色にしましょう。
どうしても色を使ったカラフルなものにしたいのであれば、アイコンにその情熱を注ぎ込みましょう。
アイコンにこそ、個性を醸し出し、ブランドを確立する力があるのです。

なぜ今、コンプレクション・リダクションなのか?

why.png

一見すると、このようなモノクロの操作画面は個性が欠如しているようにも見えます。
しかし、UIデザイナーがこの淡白なスタイルを好もうが好むまいが、確実にコンプレクション・リダクションを採用するアプリは増え続けていきます。

それではなぜ、シリコンバレーの名だたる企業は次々とコンプレクション・リダクションを採用しているのでしょうか。
ここでは、そうしたコンプレクション・リダクションを採用する必然的な理由について、考えてみましょう。

1. デザインよりも機能性やサービスによる体験を重視

UIUXか、という議論に意味があるかは分かりませんが、コンプレクション・リダクションの考え方では、よりUX(ユーザー体験)重視にシフトしています。
これは、ユーザーアプリを操作するのは、デザインが優れているからではなく、アプリによって体験できる機能やサービスが優れているからである」という考え方が根底にあるからです。

2. 個別よりも全体の最適化

次々と新しいアプリがローンチされては存在感のあるアプリがそれらの機能を取り入れていく現在の流れの中では、個々のUI操作を触りながら使い方を学習していくのはユーザーにとってストレスになります。
従来の「個性的な」アプリでは、わざわざオンボーディングページを作ってユーザーを教育していく必要があったのです。

しかし、コンプレクション・リダクショナルなデザインをした場合、結果的に一目でわかるようなユニバーサルなUIデザインとなります。
その結果、アプリケーションを切り替えても同じ操作感で利用できるようになります。
デザインによる「個性」ではなく、操作性による「全体性」を重視した結果、多くのアプリでデザインが似通ってしまいますが、これはUX/UIデザイナーにとってはむしろ「意図した結果」なのです。

参考:
サービス・アプリのユーザー定着率UP!ファンを増やすための仕組み「ユーザーオンボーディング」とは?

3. OSとのシームレス体験

全体性の重視とも重なりますが、「スマートフォン」というデバイス自体が「ポータル化」、つまり入り口として検索したり天気を見たり音楽を聞いたりする汎用的なデバイスとなってきているので、色彩効果を極力抑えて、OS上でシームレスな体験を提供する動きがあります。
「マテリアルデザイン」がAndroid OSの全体性に統合されたデザインだとするならば、「コンプレクション・リダクション」を採用したデザインはiOS寄りのデザインだと言うことができます(正確に言えば、iOSがCRを採用する動きに舵を切った、ということです)。

design.png

Apple Musicをはじめとして、iOS自体がコンプレクション・リダクションを推進するような動きをしており、そのことはiOS Human Interface GuidelinesというAppleのiOSにおけるガイドラインにもあらわれています。

例えば「Color」(配色)の項目では、次のようなガイドラインが上がっています。

アプリ全体のインタラクティビティを示すメインカラーを選んでみよう:
「メモ」アプリでは、インタラクティブ要素は黄色で着色されています。「カレンダー」アプリでは、赤色を使っています。インタラクティビティを示す重要な要素を決めるのであれば、ほかの色はその色と競合してはいけません。

他にも…

color.png

インタラクティブ要素に使う色と非インタラクティブ要素の色は同じ色にしないでください:
もしインタラクティブ要素と非インタラクティブ要素が同じ色であれば、ユーザーはどこをタップすればいいのかわからなくなります。

といった具合です。

iOSのデザインガイドラインは、コンプレクション・リダクションの詳細をさらに事細かに規定しているようにも思えます。
iOSの標準アプリケーション自体がCR寄りになってきていることも、他のアプリがCRを採用する理由の一つとなっています。