開発コストを削減「ラボ開発」って?
開発コストを削減「ラボ開発」って?
2013.05.20

絶対おさえておきたいフラットデザインのまとめ

榊原

フラットデザインで使える素材集

制作に役立つ素材集をどうぞ!

PSDのUIキット

サイトプラットフォームのセット

  • Flatstrap

    Flatstrap
    Twitter Bootstrapをフラットデザイン化したフレームワークです。

  • BootMetro

    BootMetro
    Windows8 Metroスタイル風UIのCSSとJSがセットになっています。

  • Metro UI CSS

    Metro UI CSS
    こちらもWindows8 Metroスタイル風UIのcssセットです。

  • Flat UI

    Flat UI
    フラットUIのcssフレームワークです。

最後にご紹介した「Flat UI」の中身はこんな感じです。
Flat UIの中身
ちゃんとSassでも開発できるようになっていますし、便利なリンク集も入っています。

まとめ

フラットデザインはシンプルで余計なものがないデザインですが、ただ単に簡素にするのではなく、
一瞬で「理解できる」「心を掴む」「目を奪う」仕掛けを創り出す
インパクトを与える
デザインです。

メッセージ・製品・ブランドなどを強調したい時に有効利用できるデザイン手段として、知っておいて損はないと思います。

おまけ

日本ではまだあまりフラットデザインの例が見られませんが、実は昨年から既に「白と黒だけで、しかもインパクトのあるフラットデザイン」のサイトがあったのです。
LIGブログを見ている人であれば、多分ピンときてしまったと思います。

 

 

一瞬で「理解できる」「心を掴む」「目を奪う」仕掛けを創り出す

インパクトを与える

 

 

 

 

 

 

 

 

段田商会!

フラットデザインな段田商会

EC会の反逆児は、末恐ろしい。。。

U Y A
K A