2013年9月3日火曜日

拒否反応が強いフラットデザインを何故デザイナーは受け入れ始めたのか

極力デコレーションせず、色、タイポグラフィ、アイコンなどでメリハリをつけて、シンプルに情報を纏めていくフラットデザイン。近頃リリースされるサイト、アプリはジャンルを問わずフラットな要素を取り入れており、ただのトレンドではない力強さを感じます。

フラットデザインがUIとして世間に認知されはじめたのが、Microsoftから2011年に発表された「MetroUI」です。いままでのデザインの流れにはない斬新なデザインでした。発表当時、操作しづらい、理解しづらいといった不満の声が大きかったように思います。

それがいまや、2013年秋には、Appleも追従する形でios7はフラットデザインを取り入れ、あれだけ質感にこだわっていたアイコンは奥行きの無いシンプルなアイコンに変更されていました。

フラットデザインという拒否反応の強かったスタイルを、何故デザイナーたちは受け入れ始めたのか。理由を考えたところ、4つのポイントが浮かんできました。

(1) ブラウザ間で差がでても破綻しにくい

 

古いブラウザでは再現されないCSSでの角丸設定も、フラットデザインは細かいディティールに拘らないスタイルなので、一部角丸にならない程度ではデザインそのものは破綻しません。ブラウザの制約に縛られにくいため、先進的な実装に取り組みやすい点が挙げられます。

(2)ウェブならではの伸縮するレイアウトに強い

 

文字を画像化せず、パターンやベタで情報をゾーニングするため、ウインドウが伸縮しても、要素の大きさを拡大縮小、エリアの位置を変えるなどして簡単に対応することができます。いわゆるレスポンシブな考え方と親和性が高いです。パソコン、スマートフォン、タブレットなど解像度の異なるデバイスに柔軟に対応することができます。

(3)そもそも狭い画面サイズでは余計な装飾が使いづらい

 

スマートフォンでウェブサイトを見るユーザーは小さい画面のなかで情報を効率よく取得しなければなりません。そのなかに余計な装飾を入れることはユーザーにストレスを与えてしまいます。

(4) 実世界のメタファーに頼る必要がなくなってきた


ユーザーがウェブUIに慣れはじめたという点が大きいです。
数多くのウェブサイトが制作されていくなかで、ナビゲーションの位置、ページ遷移にセオリーが生まれていき、ユーザーと作り手の間で共通認識が形成されました。実世界のメタファーをデザインに落とし込まなくても、ユーザーはシンプルなUIで十分操作可能だという判断になりつつあるのではないでしょうか。


他にもあるかなーと思いますが、とりあえず以上。
ちなみにフラットデザインは万能とは思っていません。今度はフラットデザインの弱点なんかを考察できればと思います。