思わず真似したくなる!目的別に見るフルスクリーン動画サイトまとめ

写真拡大 (全9枚)

なぜ、フルスクリーン動画のサイトが増えてきているのか?

読者の皆さんの中でも最近フルスクリーンの動画サイトをよく見かけるように感じている方もいるのではないでしょうか。では、なぜフルスクリーンの動画サイトが増えてきているのでしょうか。

それはプロモーションにおいて、静止画や一般的な埋め込み動画だけのサイトとは異なる効果が望めるからだと思われます。一体、 どのような効果があるのか。実例と共に見ていきましょう。

サイトの第一印象が強くなる

今やWEBサイトの数は星の数ほど存在しますが、ユーザーはそのデザインをある種「定型的」テンプレートのように記憶しています。

このような定型的なサイトの場合、「ファーストビュー」に多少の変化を与えたとしても、他サイトとの差別化をはかりづらく、ユーザーに強く印象を残すことは難しいでしょう。

しかし、サイトの全面が動画であることで、定型的なサイトとは異なった、大胆な第一印象を与えることができます。

アーティストであるBeyonce'のサイトは非常に良い例で、背景は短い動画のループだけであるにも関わらず、Beyonce'の魅力的な唇やシルエットを展開し、クールなテイストの動画に仕上げています。Beyonce'のアーティストとしてのイメージを印象づけ、一瞬にしてWEBサイトの雰囲気に惹きこまれます。

◆Beyonce' | The Official Beyonce' Site
http://www.beyonce.com/



AXE EFFECT(アックスエフェクト)のサイトでは、サイトに訪れた途端、突然「記者会見」が始まり、「宇宙飛行士」を募集していると驚きの告知が。
キャンペーン自体も非常にインパクトのあるものですが、突然展開される記者会見に、「これから何が始まるのだろう」と、ついつい見続けてしまいます。

◆AXE - 男性用フレグランスボディスプレーアックス
http://www.axeeffect.jp/index.html

このように、最初に見る画面全体に動きをつけることによって、訪問者に強い第一印象を与えるだけでなく、続きを見たいと思わせることで、サイトに惹きこんでいくことができます。

サイトの離脱率が下がる

ただ再生されるだけでなく、動画に「インタラクティブ性」を加えることで、ユーザーも参加しながら楽しめるコンテンツを創造することもできます。
インタラクティブ性を取り込んでいる良い例は、航空会社「Virgin America(ヴァージン・アメリカ)」社のサイトで、”動画そのものがコンテンツ”となっている点が、斬新です。

◆Experience Virgin America
http://experiencevirginamerica.com/

▼例)ドラック&ドロップで動画を操作し、弓矢をひくことができます。

ユーザーがコンテンツに働きかけることで動画が進んでいくため、自然とサイトを回遊してしまうこのサイト。もちろん、インタラクティブ性だけでなく、動画の合間に自社の強みもきちんと訴求しています。

▼フライト中に楽しめる内容を紹介

受動的に見るだけの動画では、内容次第で飽きてしまうものもありますが、このようにユーザーに能動的な働きを求める動画では、ユーザーはコンテンツに参加しながら楽しむことができるため、サイトから離脱しづらくなるでしょう。

コンテンツの幅が増える

動画では「音」や「動き」が加わることで、静止画だけでは表現しきれなかった今までにはないコンテンツを作り出すこともできます。
Web漫画「新抗体物語」は、普通のアニメでもなく、マンガでもなく、マンガ動画という新しいスタイルに挑戦しています。

◆Web漫画「新抗体物語」スペシャルサイト
http://www.shin-koutai.jp/

マンガにドアの音や、足音、ナレーションが入ることで、臨場感を出すことができ、ナレーションが入るため、文字を読む必要もありません。
アニメをつくるよりも低コストでできる事もポイントです。これも動画を利用した新しいコンテンツの形と言えるでしょう。

サイト回遊率が上がる

動きをつけることができる「動画」ならではの仕掛けとして、動きを楽しんでいるうちにサイトを回遊させることも可能です。

スポーツシューズメーカーのNew Balance(ニューバランス)のサイトではその効果を存分に引き出しています。
パララックス効果と動画の組み合わせによりスクロールしながら次々と進むコンテンツ。流れが一方方向なため、スクロールをしているうちに、自然とサイトを回遊しています。

◆一瞬で、つながれ。|New Balance Japan
http://www.newbalance.co.jp/tsunagare/#/chainreaction

一見、音楽のプロモーションサイトのように思わせるこのサイト。スクロールをしていくうちに「スニーカー」に焦点があてられたり、コーディネートが出てきたりと次々と移り変わるコンテンツに目が離せません。

フルスクリーンの動画サイト構築時の注意

ただし、フルスクリーンの動画サイトを構築する際には注意する点もあります。
スマートフォンやタブレット端末ではどう見えるのかといった配慮や、低速度の環境での閲覧も考慮し、別途「HTMLバージョン」のサイトなどを用意しておくことはユーザビリティを考える上でとても、大切なことです。

動画を制作する際にも、最終的にWEBサイトに組み込むことを考え、サイト上の文字と被らないように注意したり、サイトの完成形のレイアウトを考慮して制作したり、どのような解像度のディスプレイにも対応できるように大きめの解像度で制作しておく等の注意が必要になります。

また、あまりにも高画質にしてしまうことで、読み込みに時間がかかりユーザーをイライラさせるほど待たせてしまっては元も子もありません。
平均的な通信速度で見れるかどうかをテストし、「どれくらい待てばいいのか」分かるように、ローディング時間を表示するといった配慮をすることが大切になってきます。

▼Virgine americaのローディング画面

また、SEOとしての効果は、普通のテキストベースのサイトよりはどうしても落ちてしまうと思われるので、動画でのSEO対策した上で、WEB×動画の表現力を活かし、話題になることで様々なパブリシティに取り上げられるよう工夫し、認知させることも大切です。

動画はあくまで”コンテンツ”

ここまでいくつか「フルスクリーンの動画サイト」を見てきましたが、何より大切なのは、動画の中身です。
少し前にパララックス効果を利用したサイトが乱立したように、ただやみくもに、フルスクリーンの動画にして興味をひくだけでは、同様なサイトが増えてきた時にはすぐにユーザーに飽きられてしまいます。何のためにフルスクリーン動画を使うのか、そして、動画を見た後に、「ユーザーにとってもらいたいアクション」や「ユーザーにどう感じて欲しいか」を熟考したうえで活用することが大切です。

大変インパクトがある「フルスクリーンの動画サイト」。動画ならではの価値や効果を活かし、サイトとうまく融合させることで、きっとこれまでのWEBサイトでは得られない効果を発揮してくれるでしょう。