MENU

フラットデザインとは

目次

フラットデザインとは

画面上に表示されるボタンやイラストなどの要素を平面的な見た目にデザインすることです。
10年近く前までモダンな手法であった「リッチデザイン」とは対極にある言葉になります。

リッチデザイン(スキューモーフィズム)
アイコンに陰影をつけ立体的に見せ、ディテールに奥行きを見せたデザインのこと。

フラットデザイン台頭の歴史

身近なものでは、2013年に発売されたiPhoneのiOS7や、Windows8から大胆なフラットデザインが採用され、当時は「わかりづらい」「見にくい」などといった論争も巻き起こりました。それまでは写実的であったり立体的なデザインが好まれていましたが、食傷気味であったユーザーには突如現れたフラットデザインは歓迎されました。

フラットデザインの台頭は、もはや流行ではなく時代に合わせたものであったとも考えられます。

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

フラットデザインは基本的に2色で構成されていてコントラストがはっきりしています。配色パターンが適用しやすく、制作者としてもレイアウトしやすいため作業効率に繋がります。画像が少ないため、レスポンシブなUI設計がしやすくなり、マルチデバイス対応に有利になります。

また、陰影をつけたデザインはスマホのサイズにすると潰れて見えるため、見た目が良くないという欠点の解消になります。フラットデザインは無駄な装飾が無いため、シンプルで洗練された印象を与えるとも言われています。

逆に、フラットデザインは平面的であり陰影をつけないため、「ボタンかどうかがわかりにくい」という点が挙げられます。全体的に平坦になるため、直感的な操作がしづらくUXの低下を招く恐れもあります。
さらにシンプルが故に、デザインが酷似してくることもあります。今では世界中のアイコンやレイアウトが同じようなデザインになっていることは否めないでしょう。

しかし、それだけ汎用的で飽きのこない優れたデザインとも言えます。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

肩書:Webプログラマー兼Webライター
名前:ゆいちゃん
経歴:ライド株式会社ではコーポレートエンジニアとしてWebサイトの開発・保守・運用を行う。
   ホテルマン、総合商社で勤務していた経験から顧客との対話は大切にしている。
   IT系と育児系の情報収集が得意。
保有資格:ITパスポート
使用言語:HTML/CSS, PHP
好きな言葉:Done is better than perfect.

目次