動画で学ぶ
3STEPで作成
MILによるインタラクティブ編集は、①動画登録、②タグ付け、③公開、の3STEPで完了します。
インタラクティブ編集に専門的な知識は一切必要なく、「誰でも・素早く・簡単に」行うことができます。
今回は、インタラクティブ動画完成までの3STEPを一つずつ解説していきますので、チュートリアル動画と併せてご覧ください。
STEP1:動画登録
チュートリアル動画
インタラクティブ編集は、インタラクティブ化する動画素材をMIL上にアップロードすることから始まります。
プロジェクトを作成する
MIL上に動画を登録するには、まず「プロジェクト」を作成する必要があります。
プロジェクトには、「通常プロジェクト」と、「ストーリープロジェクト」の2種類あります。
ストーリー分岐機能を使用する場合には「ストーリープロジェクト」、それ以外の場合は「通常プロジェクト」を選択してください。
動画を登録する
作成したプロジェクト内で、動画を登録しましょう。登録可能な動画は「通常動画」と「360°動画」の2種類あります。
動画はmp4ファイル、YouTubeリンク、Vimeoリンクのいずれかを用いてアップロードすることができます。
一つの動画の最大尺数はプランによって異なりますが、トライアルプランをご利用の場合、最大尺数は3分となっているため、3分以下の動画を使用しましょう。
STEP2:タグ付け
チュートリアル動画
動画にインタラクティブな要素を追加する工程です。
動画を登録したプロジェクトをクリックして、MILの編集画面に入り、「タグ設定」からタグ付けを始めましょう。
タグ設定
タグが表示される時間や位置などの基本的な設定を行います。
◎タグ種類
「固定タグ」と「軌跡タグ」の2種類から選択可能です。
「固定タグ」はその名の通り、位置が固定されたタグになるので、動きの少ないものに使用しましょう。
「軌跡タグ」では、タグの動きを設定することができます。動きの大きいものにタグ付けをするときは、対象の動きに合わせてタグを動かしましょう。
◎タグ表示の時間
「開始フレーム」と「終了フレーム」を入力することで、タグの表示時間を設定することができます。
MIL動画は全て「30fps」となるため、「30フレーム=1秒」になります。
また「現在フレーム取得」ボタンをクリックすると、現時点のフレーム数が入力されます。
◎タグ表示の位置
「領域指定を開始する」をクリックすると、「クリック可能な領域」を指定することができます。
「クリック可能な領域」を指定した後に、「タグ付けを行う」をクリックすることで、タグ付けが完了します。
有効になっているタグは、指定した領域が青くなるため、「タグを設定したのに表示されない」という場合には、該当タグの指定領域が青くなっているか確認しましょう。
タグデザイン
タグのデザインに関する設定を行います。
◎アイコン
タグが有効になった際に表示される「アイコン」を設定することができます。
アイコンは、「MILのテンプレート(6種類)」、「非表示」、「オリジナル画像」から選択できます。
「オリジナル画像」を使用する場合には、「ファイルを指定」をクリックし、画像をアップロードしてください。
◎アニメーション
指定した「アイコン」に、「アニメーション」を加えることができます。
テンプレートのアニメーションは全3種類になります。
その他、「GIF」や「APNG」をアップロードすることで、動きのあるタグアイコンを設置することができます。
◎表示位置
指定した「クリック可能な領域」のどの位置にアイコンを表示するかを設定することができます。
タグアクション
ユーザーがタグをタップした際に起きる「アクション」を、7種類のタグアクションから設定することができます。
タグの使用目的に応じて、最適なタグアクションを設定しましょう。
タグアクション一覧
ポップアップ:動画上に設定したポップアップが表示されます。
ダイレクト外部リンク:指定した外部サイトが開かれます。
動画内リンク:動画内の指定したフレーム数に移動します。
電話リンク:設定した電話番号に発信します。※PCからの視聴ではタグごと非表示
ストーリー選択:指定した動画に分岐します※ストーリー用プロジェクトの時のみ表示
クーポン:動画上に設定したクーポンが表示されます。
フォーム:動画上に設定したフォームが立ち上がります。
STEP3:公開
チュートリアル動画
作成したインタラクティブ動画を公開することで、実際にWeb上で視聴することができるようになります。
公開の種類
MIL上でインタラクティブ動画を制作をすると「公開画面URL」と「埋め込み情報」の2つが自動で生成されます。
「公開画面URL」では通常のURL、「埋め込み情報」ではWebサイト内に埋め込む際に用いるiframeタグが生成されます。
公開管理
◎公開管理
「公開管理」をクリックすると、「公開」、「更新」、「非公開」の三つが表示されます。「公開」をクリックすることで動画が公開されます。
公開後に、変更を加え更新する際や、動画を非公開にする際も「公開管理」から行います。
◎公開範囲
インタラクティブ動画の公開範囲に制限を加えることができます。
「クローズドサイト内」を選択すると、「埋め込み情報」からの視聴に限定され、「公開画面URL」からの視聴ができなくなります。
限定公開管理
「限定公開管理」から動画を公開すると、動画にパスワードを設定し、限られた人にしか視聴できないよう設定することができます。
その他
MILでは、その他にも視聴後のユーザーを、次のアクションに誘導することのできる「終了画面設定」や、複数商品を紹介する際に便利な「目次設定」など、様々なインタラクションを動画に加えることができます。
MILのヘルプセンターにて、それぞれの設定方法について動画で説明しているので、ぜひご覧ください。
まとめ
MILでは、3STEPで簡単にインタラクティブ動画を制作することができます。
また現在、無料会員登録をすることで、MILの全機能の使用に加え、登録月から翌月末まで視聴回数1000回を上限として、Web上に動画を公開することも可能です。
ぜひ本記事を参考に、お持ちの動画をインタラクティブ化してみてはいかがでしょうか。
その他MILの使用方法に関しまして、ご不明な点等ございましたら、お気軽にご相談ください。
執筆者
田中
MIL株式会社 クリエイティブグループ エディター
1997年生まれ、神奈川県出身。大学在学中にインターンとしてMIL株式会社にジョインし、2020年12月に入社。インタラクティブ動画を専門とした制作経験を活かし、クリエイティブグループでは主に、インタラクティブ動画特有のUIデザインや映像編集を担当する。