ビデオで刺激的に！パララックスとvideoタグが融合されたWebデザイン

流行ってますねー。パララックスと、HTML5のvideoタグ。ついに日本のWebサイトでも観る機会が多くなって来ました。

このサイトはNew Balanceの日本のサイト。シューズブランドってけっこうWebデザインに力を入れますが、これは話題の技術をうまく取り入れている良い例ではないでしょうか。

Webデザイン３つの良いとこ : 3 Good Point!

す、すごい！HTML5のビデオタグが、速さをつけることですごく刺激的に見える。そして全てはコンセプトに添っていて、あくまで靴が主役だったり、、コンセプトをプロダクトとうまく組み合わせているWebデザイン。

ページにアクセスしたら表示されるこの文字だけのストーリー。コンセプトを力いっぱい表現しようとする姿勢が良い。

で、こんな文字が続く理由って他にもあるんじゃないかなぁ。例えば、一番始めのページローディングでは、この文字のストーリーを読み込ませて、これを読んでいる時に、ビデオとかを読み込ませているとか。

実際どうなってるかちょっとわかりませんが、そういった工夫も出来るWebデザインだなーと思いました。

コンセプトを伝えるのって難しいけど、こうやってサイト全体を用いた文字だけでも、魅せ方次第で単調ではなくなるんですね！

読み込まれて、これ！バンドのビデオが流れます。

そして中段では、原宿の街並みを歩く視線でダイナミックに仕上げています。

Flash！と思わせるレベルの出来ですが、HTMLで組まれています。これを観ると、確かにちょっと慌ただしい印象を受けますが、かなり印象的に残ったのは確か。

やっぱり映像は伝わるものが大きいですね。これから絶対に増えていくビデオを用いたWebデザイン、私もしっかり取り入れていかなきゃなぁと思いました。

他にもパララックスや、メインコンテンツの大きな魅せ方なども、とても綺麗です！勉強になりました。

今日参考にさせて頂いたサイト

Twitter/FacebookではWebデザインにまつわることから、Web制作に関することを日々配信しています。ぜひフォローしてください！