【2017年流行りそう!】画面サイズにフィットしたレイアウトのサイトまとめ9選

藤田


【2017年流行りそう!】画面サイズにフィットしたレイアウトのサイトまとめ9選

こんにちはデザイナーの藤田です。

今年最初のブログは、去年からじわじわ流行しだして、2017年WEBデザインのトレンドとなりそうな、スクリーンサイズにフィットさせたレイアウトのサイトをまとめてみました。

1. Garden Eight

1参考:https://garden-eight.com/

社名を「LETTERS」から「Garden Eight」とあらため活動を再開しましたね! サイトの初見のインパクトが「LETTERS」時代よりパワーアップした印象を受けました。「オシャレ」さと「クレイジー」さのバランス感に脱帽です。

2. gymnast colon (ジムナストコロン)

3参考:http://www.kabu-kitamura.com/colon/

「人は夜中に30回寝返りをするから良い枕を使いましょう」というメッセージを極限までにおしゃれにして伝えております。どうやったら、こんなアイディアが出てくるのか教えてほしいです。ちなみに、このサイトを制作したスタジオ ディテイルズさんのサイトもフィット型のレイアウトを採用しています。

3. Resn

2参考:http://resn.co.nz/

ニュージーランドのクリエイティブエージェンシーのサイトですが、こちらのサイトもなかなかパンチが効いております。自社サイトならではの実験的な試みがとても素敵です。

4. MONO AIR

4参考:http://www.tombow.com/sp/monoair/

フィット型のレイアウトを採用しているサイトは「クール」めな印象のものが多いですが、こちらのサイトは「親近感」のあるトーンでデザインされております。

「ターゲットユーザー」を考慮しつつも「新しい見せ方」をうまく取り入れております。

5. 選ぶ『理由』のある野菜 村上農園のブロッコリー スプラウト

5参考:http://www.murakamifarm.com/sprout/

村上農園さんのサイトはどれも、とても素敵ですね。タイトルの出現アニメーションがとてもきもちいサイトになってます。

6. 欧州品質を証明せよ。FALKEN SURVIVAL PROJECT

6参考:http://www.falken.co.jp/survival-project/

スピード感満点のオープニングアニメーションやページ遷移時のローディングアニメーションがとても素敵です。そして、背景に使用している動画のクヲリティーがとても高い!

7. smart surprise サプライズいろいろ smart forfour!

7参考:http://www.smart-j.com/special/

ページ構成が斬新でとてもおしゃれなサイトです。スクロールをすると、縦に横に縦横無尽に遷移します。

8. wrk – French Creative Web Studio

8参考:http://waaark.com/

気持ちの悪いアニメーションを気持ちよく作っております。※よくわからない表現ですみません。デザインや色使いもとても参考になります。

どれも素敵なサイトばかりでしたね! それではまた!

藤田
この記事を書いた人
藤田

デザイナー

関連記事