AppStoreのプレビューに表示する動画を作成したので、作成方法をメモしときます。
ちなみに私は今回始めて動画編集というものに挑戦したガチの素人です。
プレビュー動画の決まり事項
プレビュー用の動画の形式はAppleにより決められています。詳しくは公式を見てください。
大事そうな表だけ一応引用しておきます。
| コンテキスト | 説明 |
|---|---|
| 最大ファイルサイズ | 500 MB |
| 最小の長さ | 15 秒 |
| 最大の長さ | 30 秒 |
| デフォルトのポスターフレーム設定 | 5 秒 (「アプリプレビューポスターフレームの設定」を参照) |
| 方向 | 縦向きまたは横向き (注：macOS および tvOS アプリの場合は、横向きのアプリプレビューのみ使用できます)。 |
| OS デバイスのキャプチャと再生 | iOS 8 以降 |
| App Store Connect でのアップロードと再生 | Safari 8 および macOS 10.10 以降 |
ビデオの仕様
| H.264 フォーマット | ProRes 422 (HQ のみ) フォーマット | |
|---|---|---|
| 目標ビットレート | 10 ～ 12 Mbps | VBR ～ 220 Mbps |
| ビデオ特性 | プログレッシブ、最大ハイプロファイルレベル 4.0 | プログレッシブ、外部参照なし |
| 最大フレームレート | 毎秒 30 フレーム | 毎秒 30 フレーム |
| オーディオ | ステレオコーデック：256 kbps AACサンプルレート：44.1 kHz または 48 kHzすべてのトラックを有効にしてくださいステレオ構成：1 トラックに 2 チャンネルステレオ (第 1 チャンネル L と第 2 チャンネル R)2 トラックに 1 チャンネルステレオ (第 1 トラック L と第 2 トラック R) | ステレオコーデック：PCM または 256 kbps AACビットの深さ (PCM 用)：16、24、または 32 ビットサンプルレート：44.1 または 48 kHzすべてのトラックを有効にしてくださいステレオ構成：1 トラックに 2 チャンネルステレオ (第 1 チャンネル L と第 2 チャンネル R)2 トラックに 1 チャンネルステレオ (第 1 トラック L と第 2 トラック R) |
| サポートされる拡張子 | .mov、.m4v、.mp4 | .mov |
時間は15秒〜30秒、最大ファイルサイズが500MB、30fps以下、.mov、.m4c、.mp4ファイルである必要があります。
動画を撮影
まずはアプリの動画を撮影。今回はアプリを使用している動画をいくつか撮ってみました。
取り方はSimulatorならoptionを押しながらスクリーンショットを撮るボタンを押すと動画が撮れます。実機なら画面録画機能で簡単に録画できます。
後で動画編集するので、余分に色々撮ってみて後で切り取ったりするほうがいい感じになりそうと思いました。
あとは意図的に何もしない（画面が全く動かない）ところがあると、編集しやすい感じがします。
動画を編集する（その1・iMovie）
動画を撮ったらそれを編集します。
YouTubeとかインスタとかで動画投稿してる人は独自のやり方があると思うので、本投稿では初めて動画編集する人向けに解説します。
使うのはMacに最初からインストールされてるiMovieです。
iMovieの詳細な使い方はこのへんを参考にしました。
ざっと書きますが、左上側のマイメディアから撮影した動画を下半分の部分にDragDropすると動画の素材としてプロジェクトに追加されますので、使いたい動画や画像などをどんどん追加していきます。追加し終わったら要らない部分をカットしていきます。
カットのやり方は、カットしたい部分の最初をクリックし、右クリック→”クリップを分割”で分割します。同じようにカットしたい部分の最後も右クリック→”クリップを分割”で分割するとカットしたい部分が独立したクリップになるので、バックスペースで削除します。
あとは左上の、背景、トランザクションとかをいい感じに追加していきます。音はなしでも大丈夫です。
編集が終わったら右上の共有→ファイルを書き出すで書き出します。フレームレートが60になりますが、後で直します。
動画を編集する（その2・ffmpeg）
その２とその３はどっちが先でもOKです。
iMovieで書き出した動画はフレームレートが60になってますが、AppStoreConnectにアップロードするにはフレームレートが30以下である必要があります。
私はhomebrewを使ってffmpegをインストールし、フレームレートを変更しました。
参考記事： https://fukatsu.tech/install-ffmpeg
一応動画ファイルのフレームレートを変更するコマンドはこれ。
ffmpeg -i input.mp4(もとの動画のパス) -r 30(設定したいフレームレート) output.mp4(出力する動画のファイル名)かっこ部分は補足なので入力しない。iCloudに保存してある場合、「/Users/hogehoge/Library/Mobile Documents/com~apple~CloudDocs/….」のMobileのあとに\を入れないと「Error opening input files: No such file or directory」と出てくる。
動画を編集する（その3・Canva）
その2まで編集してAppStoreConnectにアップロードしようとしたら、6.7インチ端末用の承認済み解像度は886 x 1920 ピクセルか1920 x 886 ピクセルですよって言われました。実機とかシミュレーターで撮ったらそのサイズではなかったっぽい。
動画編集素人過ぎて、動画の解像度を変える方法がわからなかったのですが、Canvaで動画も作成できることを発見しました。iMovie以外の動画編集ソフトでは解像度とか変えられるっぽいのでそっちでもいいかもしれませんね。
私はめんどくさかったのでCanvaを使いました。
AppStoreConnectで指定されたサイズのキャンバスを作成し、動画を貼り付けていい感じの調整をしてダウンロードしたところ無事AppStoreConnectにアップロードできるようになりました。
5.5インチ用の動画も別で作成して編集しても良いですが、同じ動画をCanvaのキャンバスサイズだけ変えて作成しても大丈夫でした。動画の横のサイズに対してキャンバスのサイズが少し大きいですが、背景色を黒（これは動画の色によりけり）にしてごまかしました。
Conclusion
iMovieを初めて使う人間でも1日かからないくらいで動画作成ができました（クオリティはさておき）。
プレビュー動画がある方がプロダクトページ閲覧数とかダウンロード数が良いらしいんですが本当でしょうか。
以上
コメント