ブラウザのアドレスバーで検索できるブラウザがほとんどになってきたので、最近ではGoogleのトップページを見かけるのは少なくなったのではないでしょうか。
Googleのトップページといえば、大きなロゴに検索窓と2つのボタン(「検索」と「I’m feeling luckey」)が真ん中に表示されているだけの、シンプルなホームページです。

デザインの大きな潮流の中に、ミニマルデザインと呼ばれる、余計なものを可能な限り排除して必要最小限の要素だけでシンプルにデザインしよう、という考え方があります。
Webデザインの歴史においては諸説ありますが、古くはフラットデザインが広まっていった2011年頃には余計な要素を排除していく動きがあったと考えられています。

しかし、こうしたシンプルなデザインには、ある課題があります。
ミニマルにすればするほど、ユーザビリティ(機能性や使い勝手)は悪化していくのではないか、というものです。

文字に青色の下線が入っているであればテキストリンクだと分かったり、ボタンに3D効果が施されていればクリックできるとわかったりと、これまで踏襲されたきた装飾ルールのおかげでユーザーは経験上どのようなアクションができるのかが理解できました。

ところが、デザイントレンドが移り変わり、装飾が極力排除された今、ユーザー体験が大きく変わりました。
見慣れた装飾を完全になくしてしまったら、ユーザーを戸惑わせる可能性があります。

今回は、*「ミニマルデザインとユーザビリティは両立するのか？」*という問いについて考えてみましょう。

シンプルゆえにユーザビリティがなくなっている？

「ミニマルデザインとユーザビリティは両立するのか？」を考えるのであれば、少なくともフラットデザインの登場にまで遡る必要があるでしょう。
エビデンスベースドなUXリサーチやコンサルティングを行なっているNielsen Normanグループは、特にフラットデザインのユーザビリティに対して当初から懐疑的な意見を投げかけていました。

例えば、Windows 8で採用された「Metro」スタイルのUIは、ミニマリズムの極みとも呼べるべきシンプルさです。
それまで一般的だった、わずかに浮き上がって見えるフラットスタイルのボタンとは違って、どれがクリックできるのかを示す擬似的な視覚上の要素は一切排除されています。

確かにこのMetroスタイルは、過去のグレーなウィンドウのUIと比べれば洗練されているように見えます。
また、タイポグラフィもシンプルで、色鮮やかなタイルは非常に新鮮に感じられすらします。

windows8.jpg
Source: tekrevue.com

しかし、この新しいスタイルは、従来のGUIと異なった見た目にすることによって、シンプルさと引き換えにユーザビリティを犠牲にしています。
例えば、右側に表示されているナビゲーションバーを開くと、いくつものテキストやアイコンが並びますが、果たしてどれがクリックできるのでしょうか。

どれもフラットで、「Change PC settings」(パソコンの設定を変更する)という文字ですら、ただのラベルのように見えてしまいます。
Nielsen Normanの調査によれば、こうしたラベルはクリックされにくかったことが明らかになっています。

iOSから見るミニマルデザインとユーザビリティの両立

しかし、iOSも同じように、極端にシンプルなアイコンやラベルを用いていながらも、WindowsのMetroスタイルほど大きな批判は受けていません。
むしろ、参考にさえされてきた節すらあります。

iOS 6までは、Appleは非常にスキューモーフィックなデザインを施していました。
*「スキューモーフィズム」(skeumorphism)*とは、実際に現実世界にある物質に模したデザインのことで、現在でもMacOSのアイコンにその名残があります。
しかし、iOS 7以降、極端にフラットでミニマルなデザインに変わったので、アップデート当時は非常に話題になりました。

ios11.jpg
Source: cultofmac.com

iOSの中でも、特にコントロールセンターはiOSのミニマルさを見る上で参考になります。
コントロールセンターでは、アイコンだけでむしろラベルのないボタンすらありますが、それでもユーザーは「そのボタンが何を意味するのか」がアイコンを見て分かるので、ユーザビリティの低下には繋がらないと考えられます。

また、iOS 11ではコントロールセンターのデザインも変わりますが、一見するとMetroデザインにも似ているようにすら感じます。
ただし、メトロデザインでは、そもそもそれはボタンだったのか、という疑問が湧き出ますが、iOSでは「それがタップ可能なオブジェクトである」ことが理解できる点において、ユーザビリティに優れていると言えます。

さらに、iOS11からはDockに入れるアプリのラベルが消えています。
「よく使うアプリであればユーザーはアイコンを見てそれが何のアプリなのか予測することができる」という想定のもと、ラベルを消したのでしょう。
ユーザー視点で、シンプルにしながらも使い勝手を追求するのが大切なことが、この事例からよくわかります。

情報密度の問題

screen.jpeg
Source: cultofmac.com

それでは、MetroスタイルのUIには、どういう問題がはらんでいたのでしょうか。
その問題を考える際のキーワードのひとつが、*「情報密度」(information density)*というものです。

情報密度というのは、ある特定の文字量や画面に対して含まれている、人間が識別できる情報量のことです。

ミニマルなデザインでは、余計な情報を大きく省こうとする動きがあるので、情報密度は極端に下がってしまいがちです。
とりわけ、MetroスタイルのUIでは、アイコンとキャプションラベルがあるだけで、それが結果的に「必要以上に」情報密度が低くなってしまったので、ボタンだとすら気づかない、という状況が起こってしまいました。

実際、かなり大きな10.6インチのタブレットでWindows 8を動かしている場合にも、その大きさを生かして並べるような情報量にはなっていません。

iOSのデザインとMetroスタイルのデザインの違いは一見するとごくわずかではありますが、ボタンであるか、クリックできるかを認識できるかどうかだけで、圧倒的に伝える情報量が変わってきます。

Metroスタイルは、「圧倒的に情報密度を減らして」結果的にハイパーシンプルとも呼べるデザインになりましたが、その超低情報密度なデザインが裏目に出てしまったとも言えます。

まとめ

ミニマルになるとユーザビリティが低下する、という意見がありますが、iOSとMetroデザインの具体例を見てもお分かりのように、紙一重の部分で、ユーザビリティが低下する閾値いきち(臨界点)のようなものがあります。

この部分に関しては、どちらかといえば定性的で測定しにくいものではありますので、ユーザビリティテストを繰り返すなどして、シンプルなデザインであっても本当にユーザビリティが低下しているのかどうかを確認する必要があるでしょう。

*「Less is more」(より少ないほうが、より多い)*というのは、ミニマルデザインが好きなデザイナーの大好きな言葉です。
装飾が多すぎると確かに目立たなくなるので、無駄を削ぎ落としたほうが効果的だという考え方ですが、削ぎ落としすぎると裏目に出てしまうので、注意してデザインするように心がけましょう。