フラットデザインについておさらい

投稿者:Webマーケティング部

2013/06/07 16:01

この記事は約4分で読むことができます。

最近、「レスポンシブデザイン」や「ビッグデータ」「コンテンツマーケティング」など、様々な言葉を聞きますが、今日はその中でも「フラットデザイン」について、ご紹介したいと思います。

いまさら聞けない!フラットデザインについて

企業のweb担当者様や、webに強い興味、関心をお持ちの方は、すでにご存じかもしれませんが、改めてフラットデザインについておさらいをしてみましょう。

フラットデザインとは、定義として明確なものはありませんが、目安として以下のようなものが挙げられます。

  1. 立体的、リアリティ、高級感のあるデザインではなく、装飾や影など一切のものを省き、文字通り「平面」なデザイン

代表的なフラットデザインにwindows8があります。

フラットデザインは「リッチデザイン」とは対義語にあたります。
※リッチデザイン:質感や細部までのこだわり、奥行き感などにこだわったデザイン

装飾などを一切省き、平面なデザインということなので、もちろんデザイン性が低下する、ということも容易に想像できます。

しかし、フラットデザインはパーツ単位で考えるのではなく、全体的なバランス(色味や配置など)で美しさをとらえるものになります。

フラットデザインが加速した理由

それは「タッチパネル、タブレットの普及」が挙げられます。

パソコンだけでなく、例えばスマートフォンやタブレット、iPhone、iPadなど、解像度の違うデバイスに対応するために、サイトを制作するうえでスケーラビリティ(システムの規模に合わせて柔軟に対応できる度合い)が強く求められるようになったためです。

今後もデバイスのさらなる普及とともに、フラットデザインも拡大していくのではないかと思います。

自社のサイトを今すぐリニューアルしてフラットデザインに!・・・、ちょっと待った!!

今までの話の流れからすると、自社のサイトをフラットデザインにしなきゃ、したほうがいいんじゃないか、とお考えになる方もいらっしゃるかもしれません。フラットデザインには上記のような特徴があり、普及していく可能性がありますが、だからと言ってフラットデザインにリニューアル、という考えには直結させないほうがいいでしょう。
フラットデザインには以下のようなメリット、デメリットがあります。

フラットデザインのメリット

  1. 視覚情報を最小限にすることで、シンプルで整然とした明瞭なユーザーインターフェースになる
  2. 比較的短時間、簡単に制作できる
  3. ポップな印象、カラフルな印象になる
  4. グリッドデザインを採用した場合、ボタン同士の区別がつきやすく、幅を広くとれるため、操作しやすい

一方でデメリットとなりうるのは以下の点になります。

  1. 抽象的なデザインになるため、表現性に欠ける。伝わりにくくなることも
  2. 見出しやボタン、ラベルなどの区別がつきにくくなる
  3. ボタンの面積に対し、余白が重要になる(漢字、カタカナ、ひらがな、アルファベットなど、様々な表記をするため、バランスをとるのが難しい)

フラットデザインはもちろん今後も普及の可能性は大いにありますが、だからと言って、Webサイトをリニューアルするから、新規サイトを立ちあげるからフラットデザインに、というのではなく、1つの選択肢としておくのがよいのではないでしょうか。

  1. 自社のサイトはどのようなネット環境(デバイス)のユーザーに閲覧されやすいだろうか
  2. サイトのテイストをどうしたいか(高級感、シックなテイストであればリッチデザイン)
  3. 自社、商材をサイト上で表現するにはフラットデザインでも可能か、リッチデザインでないと難しいか
  4. 見出し、ラベルの区別も含め、見やすさ、読みやすさはどうか
  5. 直観的な操作性を重視するか(「これはボタンだ」というように直観的な操作を促せるのはリッチデザイン)

など、サイトに対しての役割や目的、ターゲットを明確にしたうえで、最適なデザインを選択することがベストだと思います。

【編集担当:山田 尚志】

Webサイト制作