WEB作成メモBLOG

背景全面に動画を使っているおしゃれな日本のサイト

HTML・CSS, IT関連ニュース, WEB制作の小技や機能 | 2014.03.05

ホームページデザインの新しい手法は、流行りだすと雨後の筍のように続々と似たようなサイトが現れることが多いですが、日本のサイトでは、まだちらほらとしか見かけない「背景全面に動画を使ったサイト」を集めてみました。

LUXオンナを遊べ!

http://www.lux.co.jp/2014/index.html

まるでテレビCMを見ているかのような、華やかさのあるホームページとなっています。
プロのモデルさんやスタイリストなど動画事態は、映像のプロが作成したものかと思いますので、そのようなプロモーション用の動画を持っている企業などでないと、同じような効果を出すのは難しそうですが、どの様な動画を使うと効果的であるという点などはとても参考になります。
モデルさんがクルクルと回る際のスムーズな動きや大胆なカメラアングルなどは、FLASHやJQueryでは出せない表現方法で、ホームページとしてこれらを見ることはとても新鮮です。

20140305_1
シャルキュトリーお取り寄せ

http://petitaccueil.com/

こちらは、食品の通販サイトです。動画の役割と写真の役割が明確になっており、全体として非常に効果的に商品についての情報が伝えられているように思います。
まず、上部の動画で雰囲気が伝わってきます。商品の写真ズバリではなく、商品(食材)のある風景である食事のシーンなど、その場の音やにおいが感じられる温かみのある映像によって、リアルな雰囲気が表現されています。食事中の歓談する声や、ナイフやフォークがお皿当たって立てる音が聞こえてきそうな映像です。
そして、商品写真は、白背景で十分に余白をとって、しっかりと詳細が伝わるような写真ではっきりと表現されています。
ホームページで物を売る際には、商品情報をただ伝えるだけではなく、商品を購入した後にどうなる?という体験が想像できるようにすることが大切です。
形や色や大きさという情報だけではなく、これを購入したら、こんなに楽しいですよ。おいしいですよ。便利ですよ。等々という感覚的な部分です。
これは、文字と写真だけの情報の場合、想像力をうまく掻き立てるような工夫が必要ですが、動画を使えば、雰囲気や感覚そのものずばりをよりストレートに表現できるのです。
このサイトの動画の使い方は多くのサイトにおいてとても参考になるかと思います。

20140305_3
海遊館

http://kaiyukan.com/newkaiyukan/

海や空の広さや大きな動物などを表現する場合は、こちらのサイトのように、背景全面に動画を使用することで、迫力を演出することができます。写真でも構図を工夫することで迫力の演出はできますが、やはり動画ならではの部分があります。
背景全面に動画や写真があるため、ナビゲーションなどのホームページの操作上必要な部品は、左右のエリアにコンパクトに配置するスタイルとなっています。透過を使って、なじむようなデザインをベースとし、サイト全体のまとまりを作っています。
ホームページというものは、もはや、写真と文字の情報を見る(読む)だけのものではなく、クリックして操作するエンターテイメントに使づいているのかもしれません。

20140305_2
カッコイイとかおしゃれという面だけでなく、動画は、今までは伝わりにくかったより細かなニュアンスや情報を伝えられる可能性を秘めていると思います。
スマホの普及で、動画撮影のハードルは格段と下がっていますし、ブロードバンド化によって、重たい動画ファイルにもある程度は耐えられる環境は整っています。
ホームページのメインビジュアルのFLASH動画を入れる事が流行ったように、背景全体に動画を埋め込むこの手法を取り入れたホームページは、これから増えてくるかもしれませんね。

【PR】使わなくなったパソコンはありませんか?パソコン無料回収

関連する記事

カラーミーショップはリアルな店舗を持っていなくても、ネットを通じて商品を販売する楽しみを多くの人に実感してもらえるショッピングカートです。これまでに23万を超えるユーザー様からお申込みをいただいております。
カラーミーショップなら誰かに(大手に)頼らなくても、あなた好みのネットショップを作れます。あなたがセレクトした商品や作った商品の魅力を伝え、それを欲しいと思ってくれる人にお届けしてみませんか。
30日間、無料でお試しいただけるので、初心者の方やネットショップ作成サービスで悩んでいる方も、安心してご利用いただけます。
ロリポップ!レンタルサーバー!はあなたの「やってみたい!」を応援します!
ロリポップ!なら、ホームページ、ブログ、ネットショップ…
これらが今すぐ、そして簡単にできちゃう!
マニュアルやライブチャットを完備しているので、ホームページ初心者でも安心。
これだけついてるのに月額100円(税抜)~ととってもお得。
もちろん無料のお試し期間も10日間あるので安心ですね。

▼ロリポップ!レンタルサーバーはこちら
▼インストール不要の画像作成ツール▼
画像作成ツールボタンメーカープロ

カテゴリー

アーカイブ


リンク

アフラット
ページのトップへ戻る