先週の記事であるが、
フラットデザインについてメモも兼ねて投稿。
「Yahoo! JAPAN」トップページ、平面的なデザインへ変更、週明け6月17日から
ロゴからは陰影がなくなり、各アイコンもグラデーションや角丸の枠を取り払った、さっぱりとした平面的なデザインとなっている。
スマートデバイスやPCでの見やすさ、使いやすさの向上が目的だという。
確かに、かなりクリーンな印象になった。
で、フラットデザインについて色々と調べてみると
下記、@ITの記事に詳しく記載がされていたのでメモ。
フラットデザインとは、簡単にいうと、グラデーションを利用しない非常にのっぺりとしたデザインのことだ。
(中略)
では、Webでフラットデザインを実現するにはどうすればいいか。実際にやってみよう。いくつかのポイントを押えて取り組めば、難しいことではない。
1.vividな色を利用する
2.アイコンを使わない
3.グラデーションは使わない
4.影を付けない
5.背景画像を使う
まぁ簡単に書いてありますが、
「シンプル」と「しょぼい」は紙一重だと思うので、
本質的なデザイン力が問われる事となりそうです。
で、フラットデザインのCSSフレームワークとか素材が
増えていくだろうな~と思ったら、すでに結構存在していた。
今年流行りのフラットなデザイン制作に役立つCSSフレームワークやPSD素材
いま会社でちょっとしたWebアプリを作成しており、
せっかくなのでフラットデザインのCSSフレームワークを色々と試してみたいと思う。