Image may be NSFW.
Clik here to view.
フラットデザインという言葉が登場してからある程度経過し、CSSアニメーションを加えたり、SVGファイルを活用したりと、デザインスタイルも少しずつ変化しているようです。今回は最新のフラットスタイルを見ていきましょう。
海外デザインブログGraphic Design Junctionで、フラットスタイルを採用した最近のWebサイトデザインをまとめたエントリー「32 New Examples Flat Websites Designs」が公開されていたので、今回はこちらをベースに、その他にチェックしておきたいサイトデザインをまとめてご紹介します。
詳細は以下から。
配色が素敵！フラットスタイル採用のWebデザイン24個まとめ
使われている色はどれもカラフルで、余白スペースをたっぷり採用したミニマルスタイル。太字フォントとの相性もよい、配色の参考にしたいサイトデザイン。
Image may be NSFW.
Clik here to view.
画面いっぱいに表示されたイメージスライダーがインパクトたっぷりで、スクロールするとグリッドごとにコンテンツをすっきりレイアウトされています。
Image may be NSFW.
Clik here to view.
旅をテーマにしたメディアサイトで、イメージ写真とフォントをうまく組み合わせた好サンプルとして。
Image may be NSFW.
Clik here to view.
ニューヨーク、ブルックリンにあるレストランで、太字タイポグラフィーとイメージ写真の組み合わせが、シンプルでコンテンツに注目できます。
Image may be NSFW.
Clik here to view.
アリゾナ州にあるマーブル・キャニオン国立公園の公式ウェブサイト。自然をテーマにした、アース色の配色が素敵です。
Image may be NSFW.
Clik here to view.
Image may be NSFW.
Clik here to view.
スクロールすることで、折りたたまれた照明ランプが立ち上がりコンテンツが開始される、アニメーション豊かな楽しいコンテンツ。
Image may be NSFW.
Clik here to view.
トップ部分に味わいのある写真を用い、コンテンツをレンガ状に並べた、思わずクリックしたくなる仕掛けが満載です。
Image may be NSFW.
Clik here to view.
ベクターイラストレーションが素敵なヘッダーデザインに、iPadをうまく利用した特設ページでの魅せ方は参考メモとして。
Image may be NSFW.
Clik here to view.
イメージ写真に半透明カラーフィルムを重ねたようなエフェクトは、よりスローガンやヘッドライン用テキストを強調します。
Image may be NSFW.
Clik here to view.
ビデオ動画コンテンツをサイトに導入するときに参考にしたいサイト。左固定ナビゲーションにすることで、スムーズにコンテンツを移動できました。
Image may be NSFW.
Clik here to view.
スクロールすると二人の人物がスルスルと出現するユニークな仕掛けが、。兄弟でウェブデザイン制作会社をされているそうです、それにしても似ています。
Image may be NSFW.
Clik here to view.
アニメーション作成を得意としたMuseアプリの良さを最大限に生かした、ダイナミックなコンテンツ展開を楽しむサイト。
Image may be NSFW.
Clik here to view.
淡いパステル系の青色で全体を統一することで、初めて訪れたユーザーにもフレンドリーな雰囲気を演出しています。
Image may be NSFW.
Clik here to view.
カリフォルニアを拠点にしたアイグラス・ウェアのオフィシャルサイト。オレンジ色をアクセントに、すっきりとしたグリッドレイアウトが展開されます。
Image may be NSFW.
Clik here to view.
使用されているカラーリングがどれもビビッドで、素敵なヘアサロンのWebサイトデザイン。極太フォントがうまくマッチしています。
Image may be NSFW.
Clik here to view.
イタリア、ローマにあるワイン・レストランで、ゴールドと黒で描かれた手書きスケッチが、全体のブランドイメージ、雰囲気を引き立てています。
Image may be NSFW.
Clik here to view.
オーストラリアにある大学のホームページで、Off-Canvasレイアウトでアニメーション表示される登録フォームはユニークですね。
Image may be NSFW.
Clik here to view.
子供向け手作り靴の販売を行っているサイトで、制作風景を撮影したビデオ動画がトップページに使われ、よりブランドに親近感を与えてくれます。
Image may be NSFW.
Clik here to view.
ユニークで落ち着いた配色が素敵なサイトで、コンテンツごとに背景色を変更することで、よりユーザーの注目を集めることもできます。
Image may be NSFW.
Clik here to view.
アパレルブランド向けサイト制作の参考にしたい、タイポグラフィーとイメージ写真を中心とした、ミニマルなレイアウトが魅力的。
Image may be NSFW.
Clik here to view.
カスタムジュエリーの販売を行っている、レスポンシブ対応サイト。アニメーションを活用したメッセージ＆スローガン表示は、ブランドイメージをばっちり表現しています。
Image may be NSFW.
Clik here to view.
サムネイル@ : ekr8 – Kennispunt voor duuzaam energieverbruik
参照元リンク : Flat Websites Design – 32 New Examples | Web Design | Graphic Design Junction