Webサイトの効果的な演出としての使い方

Webサイトの効果的な演出としての使い方

　プロダクト等を魅力的に見せるために動画をインターフェースやWebサイトの演出に使っていく方法として、ユニクロのWebサイトから2つ紹介します。

　1つ目は、メリノウールセーターコレクション「COLOR IS COMFORT（http://www.uniqlo.com/merino/）」です。

　こちらのCM映像のロングバージョンがWebサイト内の全画面で流れているのですが、音楽と映像の絶妙なバランスがとても気持ちよく、それだけでもずっと見続けることができる良い映像になっています。想像の域を超えることはできませんが、Webをかなり理解した人がこの映像をディレクションしたではないかと思うほどWebサイトにマッチした映像になっています。

　そして、驚くべきところがもう1つあります。さまざまな色のセーターが並んでいる映像が流れているのですが、映像内のセーターをクリックするとクリックした色の商品一覧画面にリンクします。動く映像の裏側でそれに合わせてクリックポイントも移動させるという高度なテクニックもこのWebサイトの魅力を高める1つの要因になっています。

　2つ目は、ユニクロ×東京ガールズコレクションのスペシャルサイト「ユニクロ×TGC　10 COLORS（http://www.uniqlo.com/jp/campaign/onepiece/tgc.html）」です。

　コラボ商品である10色のワンピースを紹介しているWebサイトになりますが、使われている映像は、モデルの山田優さんが10色のワンピースを着こなしているシーンが次から次へとファッションショーのように展開されています。音楽も10色のイメージごとに違う展開をするのですが、それが1曲のようにすごくリズム良く流れていきます。

　この映像はモーショングラフィックという手法を使っていて、ファッションショー的な演出で写真やイラストなどの素材をアニメーションさせています。こちらの場合は、スチール写真の素材から動画を作ることができるため、Web制作ではよくあることですが、限られた素材を有効活用する良い方法だと思います。

そのほかの効果的な使い方

　ここまで、3つに分けていろいろな事例を紹介しましたが、動画の使い方はこのほかにもさまざまなものがあり、Webサイトを盛り上げてくれています。

　Webサイトのコンテンツとして、ゲームは一般的になっています。今では、ゲームも動画や3DCGを使った表現でその面白さや臨場感をアップしています。その一例として「THE COKE ZERO GAME（http://www.cokezerogame.com/）」は、車に乗って川を超えるという単純なゲームなのですが、炎が吹いたり、ジャンプシーンがあったりと一度は挑戦してみる価値があるほど大げさに演出されたゲームになっています。

　任天堂がゲームソフト「Wario Land: Shake it!（http://jp.youtube.com/experiencewii）」のビデオをYouTubeに公開しています。ただのゲームの紹介ビデオかと思っているとYOUTUBEが大変なことになっています。今後、リッチバナーにも応用できそうな動画の活用方法です。

　また、バイラルムービーの好例として、「Samsung Omnia (i900) Unboxing（http://jp.youtube.com/watch?v=QQlzX7EyIwU）」があります。Samsungの携帯電話を買って、自宅で箱を開けるシーン。このわくわくドキドキのイベント。非常によくわかります。

　このようにWebサイトに動画を使う方法はいろいろあります。狙いを明確にして、アイデアと作りこみがその良さや伝わる印象、効果を大きく左右します。

　次回は、企画・制作プロセスやその現場について紹介します。

　なお、本稿の執筆にあたって、以下を参考にしました。

「Ad Innovator」（http://adinnovator.typepad.com/ad_innovator/viral/index.html）（アクセス：2008/08）