紙の資料に動画のQRコードを貼り付ける方法を紹介します！

弊社では不動産のパンフレットだけでなく簡単な紙の資料も制作します。紙媒体のデザインを作成していると、クライアント様からQRコードを用いて資料に動画を埋め込みたいという要望を頂くことがあります。

弊社にはカメラマンもいますので動画制作を行うこともよくありますが、作成した動画をQRコード化して紙の資料に埋め込むという作業をたまに行います。

動画を紙の資料にQRコードとして埋め込む方法を皆さんに紹介したいと思います。また動画を埋め込む際に気をつけることも合わせて紹介します。

動画をwebサイトやYouTubeに載せる

今回使用する動画を、指定のwebサイトもしくはYouTubeにアップします。

webサイトに動画を載せる場合は、HTMLコードを用いて行うことができます。YouTubeにアップした動画をwebサイトに載せるには、HTMLコードを取得する必要があります。

YouTubeの画面から「共有」→「埋め込む」→「コピー」でコードを取得することができます。

取得したコードをwebサイトの任意の場所に貼り付けると、サイト上のYouTube動画が反映されます。

サイズ変更は取得したコードの「width」「height」で調整することができます。

QRコードを取得するにはURLが必要なのでwebサイトのURLをコピーしておいてください。

もしwebサイトの用意がないのであれば、YouTubeのアカウントを作成して動画をアップしてください。

YouTubeの場合、動画ごとにURLが存在しているので、コピーしておいてください。

URLをQRコード化する

先程コピーしたURLをQRコード化します。URLをQRコード化するには、QRのススメというwebツールがあるので、そちらを使用してください。

使い方は簡単です。URLを貼り付けるだけで自動でQRコードを生成してくれます。しかも無料です。

QRコードのドット部分の色や背景色も変更できます。JPEGやPNG形式でダウンロードすることも可能です。

QRコードを資料に貼り付ける

ダウンロードしたQRコードを資料に貼り付けます。

QRコードはPNGでダウンロードすることをお勧めします。JPEGだと画像の背景に色がついてしまいますが、PNG形式であれば背景が透明になるため、資料の背景色に馴染むようになります。

PNG形式でダウンロードしたQRコード画像を、Illustratorを用いで資料の任意の場所に貼り付けてください。

これでQRコードを資料に貼ることができました！

動画をQRコード化する際の注意点

動画をQRコード化する際に気をつけることをいくつか紹介します。

YouTubeのURLを載せるとおすすめ動画が表示されて綺麗に見えなくなる

先程YouTube動画のURLをQRコード化させる方法も紹介しましたが、YouTubeだと動画の下におすすめ動画のアイキャッチ画像が表示されるため、見た目がよくないことがあります。

YouTubeの特性上動画の下におすすめが出てしまうため、これをどうにかする必要があります。

もし可能であれば、動画用のwebサイトを作成することをおすすめします。

簡単なwebサイトであればすぐに作成することができるので、サイト上に動画を配置するやり方を行った方が綺麗になります。

下記リンクは、弊社が作成した紙の資料のQRコードから表示されるサイトになります。

事例サイト

このようにサイトに動画を載せることで、カッコ悪くなる要素を妨げることができます。簡単でシンプルなサイトで構いませんので、webサイトを作成することをおすすめします。

動画の音量初期設定は0にする

動画の音量は0に設定することをおすすめします。QRコードからサイトを開いていきなり音が流れたらびっくりしてしまうからです。

YouTube動画をそのままサイトに埋め込んだ場合、音量はユーザーの音量設定に依存します。

しかしAPIを使用することでYouTube動画の再生時は音量を0にすることができます。

再生開始時は音量0ですが、その後ユーザーの方で音量調節を行うことができます。

YouTube動画の音量0設定に関しては、下記の記事でまとめているのでご覧ください。

上記記事には音量設定以外にも自動再生設定などありますので、合わせて設定してみてください。

QRコード経由で動画を見せる場合、動画サイトは資料のデザインに沿って作成することを意識してください。

最後に

以上が紙の資料に動画のQRコードを貼る方法と気をつけるべき内容の紹介でした。

動画は貼り付けて終わりではありません。ユーザーが不快に思わないか、webデザインは資料と一致しているかなどを考慮するのがプロのデザイナーです。

ぜひ細部までこだわって作成してください！

弊社では他にもデザインやコーディングに関する記事を作成しております。もし興味がありましたら合わせて読んでみてください。

おすすめの記事