星野源さんの #うちで踊ろう 企画を皮切りに、演奏動画をつなぎ合わせた「オンラインセッション」の動画を公開される方が増えてきました。
私もこんな感じで参加しましたが、やり方を覚えてしまえば、iPhoneだけでささっと作れます。
この動画も全てiPhoneで作成しています。PCに動画を取り込んで…とやらなくても、iPhoneだけでこれくらいのものはできてしまうんだなあ…という感想を持ちました。
音楽活動をされていた方も、なかなか外でのライブもしづらい状況で、音楽仲間となかなか一緒に演奏できなかったりするかと思います。
練習の成果を見せる場として、音楽仲間とのコミュニケーションのきっかけとして、「おうちセッション」動画はひとつの方法だと思うので、今回はその作り方をご紹介したいと思います。
用意するアプリはアリモノ
iPhoneに初めから入っているアプリで全部できます。追加でダウンロードが必要なアプリは一切ありません。
- カメラアプリ(撮影に使う)
- 写真(画質や動画尺の調整などに使う)
- iMovie(動画を重ねるのに使う)
- ボイスメモ(音声だけ重ねる場合に使う)

一応アプリの画像も載せておきます。5つ目のアプリは、iRig Recorder LEというアプリで、カメラアプリの代わりに使えるものです(無料ですがダウンロードが必要です)
iPhoneに最初から入っているカメラアプリでも十分な撮影ができますが、音がペチペチして気になるという方は、代わりにiRig Recorder LEを使うと入力音量の調整ができるので便利です。今回の記事で使い方については触れませんが、気になる方は使ってみてください。
iMovieで動画を組み合わせる
この記事では組み合わせたい動画全ての撮影が終了して、画質調整や動画の尺の調整もできて素材が完全に揃っているという前提で書いてゆきます。
入門編:2つの動画を組み合わせる
まずは2つの動画を組み合わせて、画面を2分割にする方法です。
手順はこのような感じ。慣れればサクッとできます。
- 動画を読み込む
- 音量・サイズを調整する
- タイミングを合わせる
- 書き出す
それでは順番に説明していきます。
① 動画を読み込む
iMovieを立ち上げて、「+」のマークを押すと以下の画面が出るので「ムービー」を選びます。

一つ目の動画を写真リストから選択して、「ムービーを作成」をタップします。

作業画面に一つ目の動画がタイムラインとして表示されるので、プレビュー下にある「+」ボタンを押して、二つ目の動画を追加します。

組み合わせたい2つ目の動画を選択したら、「…」をタップします。

どのように組み合わせるのかを聞かれます。セッション動画で使うのは「ピクチャ・イン・ピクチャ」か「スプリットスクリーン」です。それぞれの出方は以下のような感じ。
- ピクチャ・イン・ピクチャ:
冒頭完成図のカスタネット部分 - スプリットスクリーン:
冒頭完成図の4分割されている部分
ここでは画面を中央で2分割して表示する「スプリットスクリーン」を選んでいきます。

2つ目の動画を追加すると、画面上部に2つの動画が組み合わさったプレビューが表示され、下部に2つの動画のタイムラインが縦に並びます。

② 音量・サイズを調整する
タイムライン上に表示されている2つの動画のうち、調整したい方をタップすると音量やサイズを調整するメニューが出てくるので、順番に調整していきます。
音量を調整する
メニュー真ん中の音声調整アイコンをタップします。

音声調整のバーが出てくるので、バーを動かして音量バランスを調整します。(はじめは追加した動画はミュート状態になっています)

サイズを調整する
調整したい方の動画をタイムライン上でタップすると、プレビューのところにメニューが表示されます。

サイズ調整するのは虫眼鏡マークを押してから、二本の指でつまむ動作、広げる動作をすることで拡大縮小ができます。
その他のマークの機能は画像に書いたとおりです。こちらは押していくと変化が見られるので好きなように調整してみてください。
③ タイミングを合わせる
タイムラインの追加した方の動画を長押しすると左右に動かせるようになるので、これでタイミングを調整します。

この作業が細かく数値で指定できないので感覚での調整になります。音を聴きながら根気よく調整してゆきましょう…
④ 書き出す
タイミングまで調整できたら、左上の「完了」をタップし、真ん中のマークを押します。

メニューが出てくるので、「ビデオを保存」を押して、書き出しサイズを選択してください。

数値は動画の横幅を指しています。高画質のものが良ければ数値の大きいものを選んでください。SNSに投稿するのであれば、「中 – 540p」でも十分だと思います。
「写真」の中にしっかり保存されているのが確認できたら、2つの動画を組み合わせる工程は完成です!
応用編:3つ以上の動画を組み合わせる
3人以上の複数パートがいる場合、3分割や4分割の画面にする動画はどのように作ったらいいのか…私はこれに悩みました。
iMovieは、最大2つの動画しか組み合わせることができないので、冒頭でご紹介した私の動画の場合、先ほどの2つの動画を組み合わせる工程を4回ほど繰り返しています。
先ほどの完成図を例にすると、以下のような作り方になります。

- 完成図上部のシェイカーさんと源さんの動画を組み合わせる(スプリットスクリーン横分割)
- 完成図下部のギターとベースさんの動画を組み合わせる(スプリットスクリーン横分割)
- ①と②でできた動画を組み合わせる(スプリットスクリーン縦分割)
- ③でできた動画と完成図中央のカスタネットを組み合わせる(ピクチャ・イン・ピクチャ)
やることとしては、2つの動画をひたすら組み合わせていくだけなので、入門編を見ながらチャレンジしてみてください!
動画に音声だけ重ねる
iMovieでは、動画同士だけでなく、音声のみも重ねることができるので、今回の完成版動画は、動画の上にコーラスの音声を重ねています。
方法は、2種類あって、動画から音声のみを取り出す方法と、ボイスメモで録った音声を重ねる方法があります。
どちらも、動画を組み合わせる工程で一緒にできてしまうので、絵を入れる必要がない場合は音声のみ重ねると作業が楽になります。
動画から音声を取り出す場合
2つ目の動画を追加するのと同じ流れで音声を追加したい動画を指定したら「オーディオのみ」を選択します。

ボイスメモの音声を重ねる場合
まず、iMovieで読み込むための準備として、ボイスメモのファイルをあらかじめ「ファイル」として保存しておきます。
ボイスメモのアプリで以下の操作をすると「ファイル」として保存できます。
- 重ねたい音声の「…」をタップして、「ファイルに保存」を選択
- iCloudDriveなどの適当な場所に保存する

iMovieで2つ目の動画を追加するのと同じ要領で、作業画面のプレビュー下にある「+」をタップします。

追加するものを選ぶ画面で、「ファイル」をタップして、先ほどの準備でボイスメモを保存した場所から追加したいファイルを選択します。

タイムライン上で音声が青い棒で表示されます。タイミングの調整や音量の調整は先ほどご紹介したやり方でできます。

iMovieの編集で苦労したポイントとコツ
一連の編集作業はこのような感じですが、最後に実際にやってみて苦労したポイントと、こうすればもっと楽になるんじゃないかと思ったことをお伝えいしたいと思います。
一番大変なのは、タイミングの調整です。数値での細かい微調整ができず、指でスライドさせていくしかないので、タイムラインを少しずらしては聴いて、少しずらしては聴いて…を繰り返します。
この作業は、それぞれの動画の開始地点がズレていると泥沼にハマるので、撮影時に聴いている基準音声の再生開始タイミングで合図をするのが良いと思います。
例えば、再生ボタンを押すタイミングでポチッとする音が入るようにするとか、再生と同時に手でサインするなど、編集する時にわかりすい動きを一つ入れておくなどです。
複数の動画を組み合わせるのはなかなか手間がかかりますが、まずは2つから、「おうちでセッション」動画、始めてみませんか?
おまけ:お題動画をダウンロードする方法
星野源さんなど、オンラインセッションのお題を提供される有名人の方もいらっしゃるので、その動画をSNSからダウンロードしたい!ということもあるかと思います。
こちらの方法についてもご質問いただいたので、解説したいと思います。
twitterやInstagramの動画をダウンロードする方法はいくつかありますが、いずれも基本的には以下のような手順を踏んでダウンロードしました。
- 投稿のURLをコピー
- 動画ダウンロードサイトに①のURLを貼り付け
- ダウンロード
参考にしたサイトにもリンクを貼っておきますので、ダウンロード方法がわからない!という方はこちらもご参照ください。
twitterの動画をダウンロードする方法
ダウンロードできるサイト
こちらのサイトに記載されている「Twitterの動画を保存できるWebサービス」のうち、「Syncer」というサービスを利用しました。
twitterのURLをコピーする方法
対象のツイートの右下にあるマークをタップします。

「ツイートへのリンクをコピー」をタップします。URLのコピーはこれで完了です。

ツールで動画をダウンロード
コピーしたURLを先ほどご紹介した「Syncer」というツールに貼り付けると、動画のURLが表示されます。表示されたURLのうち、私は「統合ファイル(mp4)」の一番大きいサイズをダウンロードしました。
お好きなURLを長押しすると以下のような画面になるので、「リンク先のファイルをダウンロード」をタップします。

SafariのURLバー横にダウンロードマークが表示されるので、それをタップした後、表示される動画のサムネイルをタップします。

左下にあるマークをタップすると、メニューが表示されるので、「ビデオを保存」をタップします。これで「写真」にお題動画が保存されます。

注意点としては、カメラロールには動画の投稿タイミングの時間で保存されているため、それ以降に何か写真などを撮っている場合、最新の写真ではなく、過去の写真として表示されているかもしれませんので、ダウンロードされていないかも、と思ったらよく探してみてください。
Instagramの動画をダウンロードする方法
ダウンロードできるサイト
「Insta Downloader」というサイトを利用しました。
InstagramのURLをコピーする方法
対象の投稿の右上にある「…」をタップし、出てきたメニューから「リンクをコピー」を選びます。

ツールで動画をダウンロード
コピーしたURLを先ほどご紹介した「Insta Downloader」というサイトに貼り付けると、以下のような画面になるので、右下の「Dounload」ボタンを押し、動画をダウンロードします。
たまに広告が出てしまうことがありますがそうなったら一度戻ってもう一度ボタンを押し直してみてください。

ダウンロードすると、twitterの時と同様に、SafariのURLバー横にダウンロードマークが表示されるので、それをタップした後、表示される動画のサムネイルをタップします。

左下にあるマークをタップすると、メニューが表示されるので、「ビデオを保存」をタップします。これで「写真」にお題動画が保存されます。

以上の方法でお題投稿の動画がダウンロードできると思いますので、ぜひぜひオンラインセッションで遊んでみてください!