インターネット上では静的なウェブサイトは過去のものとなりつつあり、目を引く動画背景が人気を集めています。動画背景は、適切 に使用すれば、訪問者の注意を惹き、ウェブサイトのトーンやムードを決定する役目を果たします。また、コンバージョン率改善にも寄与します。Forbesによれば、ランディングページに動画を追加するとコンバージョン率が80%も増加します。
このような効果を耳にすると、試してみたくなるでしょう。このブログでは、ウェブサイトのトップページで使用する背景動画の選び方に加え、作成のヒントとコツをご紹介します。
背景動画とは？
動画背景の例。
ウェブサイトのホームページ用の背景動画を作る方法。
背景動画とは？
背景動画とは、その名の通り、ウェブサイトの背景で再生される動画のことです。ブランドのアイデンティティやストーリーを訪問者に伝えるのに最適なツールであるため、ウェブサイトのトップページに配置されることが多くなります。背景動画の目的は、チュートリアル動画や製品デモとは異なり、情報ではなく外観や雰囲気をアピールすることにあります。長さは通常、最大で30秒程度と短く、音声はほとんど使わず、テキストもほぼ含まれな いのが一般的です。
動画背景の例
背景映像の作成の際のヒントになるよう、背景映像をうまく活用しているウェブサイトの例を集めました。
Media Boom
デジタルマーケティング代理店Media Boomでは、会社の概要が分かる背景動画をホームページに掲載しています。映像を白黒にすることで、重ねられたテキストが埋もれず、なおかつ読みやすくなっています。会社のさまざまな側面を動画で表現することで、訪問者は「当社について」タブを閲覧するだけでなく、より深く会社とつながることができます。無音の動画で、クライアントとスタッフ、ワークスペースやオフィス、サービスの構築や表示に使用されている技術が紹介されています。
Venem 1.0
オーストラリアのファッションレーベルVenem 1.0は、さまざまなトーンと形式で背景動画を表示しています。新着情報のプレビューを動画で表示することで、訪問者の興味を引き、CTAのクリックにつなげることができます。クリエイティブで魅力的な背景動画です。
The Cliffs
不動産企業The Cliffsでは、クラシックなアプローチの背景動画で7つのプライベートでラグジュアリーな居住コミュニティのストーリーを、周辺の野生動物、農業やアウトドアアクティビティと併せて紹介しており、簡単なテキストを加えることで、背景動画に深みを与えています。ウェブサイトでは純粋に商品を紹介していますが、動画では、視覚的に印象に残る体験を提供しています。
Project Skin MD
Project Skin MDの背景動画はまったく新しいレベルの作品で、動画全体にストーリー性をもたせたものです。冒頭のシーンでは、顧客がクリニックを訪れ、フロントで受付をし、その後、設備での体験を伝えるストーリーが始まります。施設、スタッフ、スキンケア療法、レーザー、販売している商品、満足度の高い顧客サービスなど、動画の中ですべてが紹介されています。ここでもテキストは最小限に抑えられており、動画に重ねて同じスローガンを表示しています。
ウェブサイトのホームページ用の背景動画を作る方法
ウェブサイトの作成や電子商取引に関する専門知識がなくても、サイトオーナーは簡単に動画の背景をサイトへ追加することができます。高度な編集技術や高価なカメラ機材は必要ありません。
使いやすい無料動画エディターClipchampには、プロフェッショナルなストック映像が満載の充実したストックライブラリも揃っています。これを最大限に活用できるよう、ウェブサイトのホームページ用の背景動画を作成する方法をステップ別のチュートリアルでご紹介します。
ステップ 1. Clipchampのアカウント作成
既存のClipchampアカウントにログインするか、無料でサインアップします。
ステップ2．新しいプロジェクトの作成
左側のサイドバーにある「動画を作成」ボタンを選択します。5つの異なる動画形式から選択し、プロジェクトに最適な形式を選択します。ウェブサイトのホームページや背景動画としてアップロードするには、ワイドスクリーンの16:9の比率のご使用を推奨します。
ステップ 3. 自分で作成した動画やストック映像を追加
左側のサイドバーにある「ストック」ボタンを選択し、ストック映像のオプションをスクロールします。動画の右上隅にある「＋追加」ボタンをクリックして映像をライブラリに追加します。選択したクリップはメディアライブラリに自動的にアップロードされます。自分で作成した映像を使用する場合は、左ツールバーの「メディアを追加」ボタンをクリックしてコンピューターから動画ファイルをインポートします。
ステップ 4. タイムラインに映像を追加して編集
タイムラインに動画をドラッグ&ドロップします。各クリップをお好みの順番に配置します。間違ってクリップをドロップしてしまっても、心配はありません。クリップは何度でも動かせます。続いて、スニッピングツールを使うか、クリップの緑のサイドバーをドラッグして、クリップの長さを調整します。カラーバランスを変えたり、フィルターをかけたり、そのままにしておくこともできます。ウェブサイトで文字を目立たせるために、クリップの露出を下げたり、色を白黒にすることをお勧めします。
ステップ 5. 必要に応じてモーションタイトルを追加
ここでテキストを追加していきますが、もちろん追加しなくても結構です。左サイドバーの「テキスト」をクリックし、お好みのタイトルを選びます。タイトルをタイムラインの特定のクリップの上にドラッグ&ドロップします。テキストの長さは、緑のサイドバーを左右にドラッグして変更することができます。適切な場所にテキストを配置したら、カスタマイズし、サイズ、色や位置を変更します。
ステップ 6. プロジェクトをエクスポート
エディターの右上隅にある「エクスポート」ボタンをクリックします。ここでは、ダウンロードするプロジェクトの解像度の設定を選択できます。ウェブサイトにアップロードするには、アップロード時間を短縮できるよう1080pで「ファイルサイズを圧縮」を選択することをお勧めします。最後に、「続行」ボタンをクリックして、動画がエクスポートされるのをお待ちください。完了すると、ご利用中のコンピューターに動画を保存したり、ソーシャルメディアに直接動画を共有したりできます。
参考情報
他のチュートリアル動画やブログもチェックして、素敵 な動画を作るためのヒントを見つけましょう。
