ブログ

トレンド?それとも、時代遅れ?今さら聞けない、「フラットデザイン」について

あいこん

 

 

こんにちは! Yukiです。

 

とうとうリオオリンピックが終わってしまいましたね!

ここ最近、「あの種目はどうなったかな」と朝起きる度に

ワクワクしながらテレビをつけるのが日課になっていたのですが、

それができなくなると思うと少しさみしいです(泣)

 

そんな私が今回お送りするのは「フラットデザイン」についてです。

フラットデザインといえば、2012年にWindows8が

基本UI(※)に採用したことで話題となり急速に広まりました。

今では、さまざまな企業がウェブサイトだけでなく

ポスターや名刺などあらゆる場面でフラットデザインを採用しています。

 

※UI(ユーザーインターフェイス)…ユーザーと接触する部分のことで、サイトであればデスクトップやボタン、フォントなどを指します。

 

Windows8デスクトップ画面

windows8トップ画

 

さらに最近では、2016年4月にGoogle Playアプリのアイコンが一新。グラデーションがなくなりフラットになりました。

 

Google Playアイコン

Google Playアイコン

参考「Google Playアプリのアイコンがフラットデザインに変わります」
http://blog.dryfeed.me/android/google-play-icon-flat

 

 

一体、このフラットデザインとは具体的にどのようなデザインなのでしょうか。

「少し前に流行ったのは知ってるけど、実はよく知らない!」

「もしかして、今はもう時代遅れ・・・?」

そんなみなさん、必見です!

 

 

フラットデザインとは

 

影やグラデーションなどの効果をつけた立体感や質感が感じられる

「リッチデザイン」に対して、「フラットデザイン」は

平面的で余分な装飾をそぎ落とし

伝わりやすさを重視したシンプルかつ大胆なスタイルです。

 

スマートフォンやタブレット端末が普及し、

今まで見ていたPCの大きな画面よりも小さい画面で見る機会が増え

見やすいデザイン・押しやすいボタンが求められるようになってきました。

そこで注目されたのがフラットデザインです。

余計な装飾がないため、テキストは読みやすく、写真はより大きく使用されることで

見やすさが向上しました。また、見やすいだけでなく

[ PC → スマホ] など異なる画面サイズのデバイスに展開する場合も

柔軟なアレンジ、配置が可能です。

ビー・クスサイト

参考「ビー・クス リクルートサイト」http://recruit.viex.co.jp/

 

 

 

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

 

反対に、シンプルであるが故にデメリットもあります。

●デザインにこだわりすぎて見る(使う)側にとって不親切になりがち

→例:ウェブサイトでボタンがどこにあるか分かりづらい

●「楽しそうな感じ」「盛り上がっている感じ」の演出に欠ける

● 根本的なデザイン力が求められる(ややもすると、ダサっぽくなる)

といった点が挙げられます。

 

 

フラットデザインのコツ

 

弊社デザイナーでフラットデザインが得意なオビちゃんに、

フラットデザインのコツを聞いてみました!

フラットデザインでお伝えします(笑)

フラットデザインとは

 

専門用語がいくつか出てきたので、解説しますね。

▽「タイポグラフィ」とは、デザインにおける文字の書体や、文章のレイアウトのことです。

フラットデザインでは、フォントだけでなく、文字の大きさ、文字間、行間、

全体のバランスなど、隅々まで注意を払う必要があります。

▽「グリッドレイアウト」とは、画面やページを縦横に格子状に分割し、

ブロックを組み合わせるようにコンテンツを配置していく手法。

すっきりとした見やすいレイアウトになるため、

フラットデザイン作成時にはグリッドレイアウトが適しています。

 

コツをつかめば誰にでもできるフラットデザインだからこそ

愛を込めて大胆にデザインすること

細部までこだわりをもったデザインすること

を大切にしていると、オビちゃんは言います。

 

 

フラットデザインの活用例

 

フラットデザインを採用しているウェブサイトを2つご紹介します。

 

1つ目は、フェイスマスクを扱うグライド・エンタープライズの「LuLuLun(ルルルン)」。

まっ白い背景に青とピンクのパステルカラーが映える、女心をくすぐるデザインです。

すっきりとしていて清潔感があり、かつ洗練されたイメージを与えます。

 

ルルルン

参考:http://lululun.com/

 

2つ目は、大塚製薬の「カロリーメイト公式サイト」。

みなさんお馴染み、体に必要な栄養素を短時間で手軽にとれる栄養補助食品のサイトです。

シンプルに、かつ大胆にパッケージデザインを取り入れています。

 

カロリーメイト

参考:http://www.otsuka.co.jp/cmt/index.php

 

 

まとめ(フラットデザインの今後について)

 

最近では、フラットデザインに影などの効果をわずかに加えて

少しだけ奥行きを出す「フラットデザイン2.0」または

「ほぼフラット」と呼ばれるようなデザインが増えているようです。

数年後には全く新しいトレンドがきているかもしれませんが、

フラットデザインを採用している企業はまだまだ多く、グーグルやヤフーなどが

ロゴやアイコンをフラットデザインに続々と変更していることからも、

しばらくの間は引き続き注目していく必要がありそうです!

 

フラットデザインには長所・短所それぞれありますが

上手く取り入れることでお客さまにとってより見やすく、より使いやすい広告に、

企業側にとっては伝えたいコンテンツやメッセージをより強調して伝えることができます。

ここで今一度、お客さまの視点に立って自社の広告を見直し、

フラットデザインを活用してみるのもいいかもしれません。

 

 

 

 

ViEX RECRUIT 2018