WEB製作者に見てほしい!デザインにすてきな「動き」を使用しているサイト5選

WEB制作のクオリティでかなりの部分を締めるのが「ページデザイン」だとおもいますが、ただキレイなだけじゃなく「動き」を取り入れて面白さを追加すると倍々でドンとクオリティが上がります。

WEBサイトやデザインに関わらず、物をつくるスキルを上げるためには「良いものを見て学ぶ」のが一番。ということでデザインにすてきな「動き」を使用しているサイトを5つご紹介します。

すてきな「動き」を使用しているサイト

 

サイトのコンテンツにマッチしたフォントと、大きめの写真が印象的なサイト。
とくに見るべきは「職人・作品」メニューのページスクロール。
海外のサイトではよく見るけど日本ではあまり見かけない、使いドコロのむずかしいページスクロールをキレイに使ってます。

 

パララックスって意外に見せ方が難しいんですが、これはかなり上手につかってます。主張しすぎてないので目線がつい商品を見ちゃいますね。
よく見ると背景もパララックスになっていて、とってもイケてます。

 

スライダーがすんばらしいのは見ての通りなんですが、これは有料のSLIDER REVOLUTIONというプラグイン。
ほほーって関心したのはFeatureBoxにカーソルをもってくるとビュイーンとエリアが広がる動き。この場所でつかうのはアリだね!と参考になりました。

 

文字で説明するのが難しいので実際にサイトを見てほしいんですけど、スクロールするとコンテンツブロックが画面内にほんのちょっと寄ってくる動きがCOOL!
すごく細かいことかもしれないけど、こういうところが大事だよね。

 

イラストが操り人形風に動いて、かなり目を引きます。個人的に大好きです。
この動きはなにかのライブラリでやってるのかと思いきやjquery.animateで手書きしてました。頭が下がります。

 

5つのサイトを紹介してみましたがいかがでしたでしょうか。
これだけの完成度のものを作るのは中々骨が折れる気がしますが、ちょっとした動きでもかなり印象が変わってくるので、これからサイトをつくる人は挑戦してみてはいかがでしょうか。