Q

203 フラットデザインとはなんですか?

フラットデザインが流行っていると聞きました。 フラットデザインの定義や、メリット・デメリット、注意点などを教えてください。

A

光彩や陰影などの立体感を廃した平面的なデザインを指します。

Appleの最新OS、iOS7で「フラットデザイン」が採用されたと話題になっています。 「フラットデザイン」に明確な定義はないようですが、一般的に立体的なデザイン手法(光彩や陰影、映り込みをつける)を廃したデザインを指します。 聞くは一時203-1聞くは一時203-2聞くは一時203-3 これまでの立体的なデザイン?????????????????? ?iOS7のフラットデザイン ここ数年、デザインの世界では光彩や陰影などを駆使した立体感のあるデザインが流行していました。 思い起こせば2001年。 Windowsが98からXPになった時に、デスクトップ画面などが立体的になり「おおっ!近未来的」と感動したものです(私だけ?)。 聞くは一時203-4聞くは一時203-5聞くは一時203-6 Windowsクラシック表示????????????????????????????? Windows7のデフォルト表示 その後、ありとあらゆるOS、Webサイト、各種UIもそれに追随する形となり、デジタルを飛び出して紙媒体でも立体的な表現がもてはやされるようになりました。 映像の3D化もあり、世のビジュアルは飛び出してばかり。 ちょっと飽きてきた・・・なんとなく、そんな雰囲気もあったのでしょう。 2012年、Windows8がこれまでの立体的デザインを廃したデザイン<=フラットデザイン>を基本UIに採用して話題となりました。当初は賛否両論だった フラットデザインですが、今年に入って、iOS7、YahooJapan、GooglePlayもフラットデザインに移行し、本格的なデザインの流行となりました。 「2013年からはフラットデザイン」と言っても過言ではありません。 聞くは一時203-7 ↑画像はMicrosoftホームページより 立体的なデザインに比べ、フラットデザインは画像の作りこみに時間がかからず、読み込み容量も少なくて済みます。 その一方、装飾を削ぎ落としたシンプルさゆえに、 ・色やサイズ、レイアウトのセンス ・ボタンやフォームなどの配置、UIの知識 ・フォント選び、文字の見せ方 などがとても大切になってきます。 ともすれば、のっぺりとした単調なデザインになってしまいますし、 日本語には向かないとの声もあります。 デザイナーの真価が問われる、ごまかしの効かないデザインですね。 Web上では早くも アイコン集 ・50 Flat Icons Set, Best for Web and App UI Design WordPressのテーマ集 ・40+ Cool Examples of Flat Web Design UI実例集 ・Showcase of Beautiful Flat UI Design カラーパレット(Windows8風) ・Flat UI Colors などが紹介されています。 Webデザイナーの方からは「CSS3でゴリゴリの立体デザインを組んだのに・・・」という悲鳴が聞こえてきそうですが、この流行は続き、しばらくの間スタンダードになりそうな気がします。 まずは、上記のようなサイトで色々チェックしてみて、ご自身でもフラットデザインに挑戦してみてはいかがでしょうか?

この質問に関連した業種の
求人を見ることができます。

求人一覧はこちら

仕事×学びのご相談はこちら

「ちょっと話が聞いてみたい」も大歓迎!