背景動画を使用しているサイトは、ここ数年で日本でも沢山増えてきました。
動画素材の販売サイト、音楽サイト、飲食店、シンプルなサイトほど、視覚的にユーザーにイメージを与えることができるのが背景動画の利点ともいえるでしょう。
今回は、音楽系のサンプルサイトを元に、Wixでの背景動画の設定方法をご紹介します。
設定方法は簡単です。
Wixエディタのアイコンメニューから、ページ背景を選択します。
ウインドウが表示されるので、上部にある(動画)を選択します。
次に背景動画に設定するファイルを選択します。
Wixフリー素材から選択するか、マイビデオに自身アップロードした動画ファイルから選択できます。
自身で動画をアップロードする際には、avi, .mpeg, .mpg, .mpe, .mp4, .mkv, .webm, .mov, .ogv, .vob, .m4v, .3gp, .divx, .xvid.の拡張子の動画ファイルが使用できます。
またWixの推奨としては、50MB （約20分程の動画ファイル）推奨解像度：1920 x 1080 ピクセルと公言されています。
Wixでサポートされているメディアファイルの詳細はこちらから確認することができます。
自身で動画ファイルをアップロードして使用する際は、著作権に適応した範囲で使うように気を付けましょう。
ちなみにwixフリー素材は著作権フリーなので大丈夫です。
この記事では試しに上の画像の動画を選択しました。
テキストの色などがたまたまいい感じに動画に合っていました。
次に背景動画の設定項目を見てみましょう。
先ほどと同じように、Wixエディタのページ背景のアイコンから、「設定」を選択します。
別ウインドウに「パターン」「色を重ねて表示」「再生速度」「リピート再生」といった項目が表示されます。
まず、パターンの説明をすると、これは動画にフィルター効果を与えるような設定のものになります。
画像では分かりづらいですが、例えば左上から二番目のパターンを選択した場合、網目状のフィルター効果によって、全体的にテキストがくっきり見えるようになり、背景動画のコントラストが低くなって、締まった印象になります。
複数のパターンがあるので、ご自身で試されてください。
次に「色を重ねて表示」の項目です。
これは言葉の通り、オンにすることで背景動画にオーバーレイ効果を与えることができます。
上記の画像は極端な例ですが、このように色を重ねることができます。
私がこの設定を使う時の場合は、背景動画のコントラストが高かったりした場合、黒色と色を重ねることで、動画のコントラストを下げる時に使用しています。
次に「再生速度」の項目です。
これは動画の再生速度を設定することができます。
動画のスピードが早過ぎる場合や遅い場合に、調節することが可能です。
最後は「リピート再生」ですが、これは動画の再生が終わったら繰り返すか繰り返さないかの設定になります。
基本的にはリピートで大丈夫かと思いますが、動画の再生時間が長い場合は、サイトに負荷が掛かるので、どうしても再生時間をカットできない時などに、一回のみ再生させる設定にしておきましょう。
以上がWixでの背景動画の活用方法になります。
他にも背景動画を使用する際などのデザインのコツなどがありますが、今回は使い方のみになります。
機会があれば背景動画を使用したサイトのデザイン方法もご紹介したいと思います。
Comments