なんちゃってウェブ系エンジニアの備忘録

某IT企業で働くなんちゃってウェブ系エンジニアが技術やデザインなど役に立ちそうなものなどを備忘録として載せていきます

フラットデザインって

最近、巷で聞くようになりました「フラットデザイン」
そもそもフラットデザインって何?

フラットデザインとは

主にコンピュータシステムのユーザーインターフェース(UI)において、装飾性をできるだけ抑えたシンプルで平面的なデザインの総称である。
フラットデザインとは 「フラットUIデザイン」 (flat design): - IT用語辞典バイナリ


最近、Microsoftがフラットデザインを取り入れたWindows 8およびWindows PhoneやiPhoneiPadiPod touch向けOS「iOS 7」にも採用されていますね。

f:id:owen11:20131130171611j:plain

Twitterも新しいサイトデザインとして、フラットデザインを取り入れているという噂
も聞きます。

なぜ、フラットデザインがこんだけ流行っているかというとやはり「シンプルさ」が
挙げられます。

  • デザインや配色が少なく、ロード(読み込み速度)が早い
  • パッと見ても分かるような これはXXであるとか直感的に操作しやすい
  • 様々なデバイス(PC、スマートフォン、タブレットなど)でも使える。要するにレスポンシブとの相性が良いこと。
  • シンプルなデザインのため、コンテンツにより集中することができる

その一方・・・

  • 色やサイズ、レイアウトのセンス
  • ボタンやフォームなどの配置、UIの知識
  • フォント選び、文字の見せ方

などなどデザイナーのセンスが非常に大切になってきます。

海外のサイトではいくつかのフラットデザインを取り入れておりますが、日本ではあまり少ないような気がしています。日本語でフラットデザインを取り入れるのは意外と難しかったりとするんです。

どっかの社長から「フラットデザインが流行っているんだから、うちのサイトも取り入れよう」、サイトをリニューアルするから「これを幾にフラットデザインにしよう」、「フラットデザインするならいつやるか? 今でしょ!」と流行に乗っかりそうですが、単純にフラットデザインすればいいというわけではありません。

フラットデザインはユーザビリティを低下させるとか、日本語で実装するとダサくなるとか、解りやすさが欠落するとか、落とし穴があったりとするんです。

大事なのは、「流行ってるから取り入れる」じゃなくて「必要性があるなら取り入れる」ということでしょうか。

フラットデザイン・リッチデザインにこだわらず、Webコンテンツの内容やユーザー層に合わせて、またはそれぞれのメリット・デメリットに注目し、一番適しているWebデザインを決めていくということですかね。

ついでにこのブログもフラットデザインにしたいですねw