kamitool > 読みもの > 縦型配信・縦動画の基本｜9:16の解像度と、横配信との違い

縦型配信・縦動画の基本｜9:16の解像度と、横配信との違い

kamitool 運営者

スマートフォンで見られることが前提の配信や動画では、縦長の画面が使われます。横長の画面をそのまま縦に使うと、上下に大きな余白ができたり、文字が小さくなったりします。ここでは、縦型の画面の大きさ、横との違い、OBSで縦の画面を作る考え方、ブラウザソースのツールを縦の画面に置くときの注意を、順番に整理します。

縦型とは何か

縦型は、画面の縦が横より長い形式です。比で表すと、横16に対して縦9の「16:9」が、横長の画面の標準です。これを回転させた「9:16」が、縦型の標準にあたります。スマートフォンを縦に持ったときの画面の形に近く、見る側は、端末を回さずに、そのまま画面いっぱいで見られます。

縦型が選ばれる場面は、次のようなものです。

• スマートフォンで見る人が中心のサービスで配信する
• 短い動画を切り出して投稿する
• 雑談、歌、作業の手元など、人物や手元が主役で、横幅が不要な内容

いっぽう、ゲームの映像は、もともと横長のものが多く、縦型の画面に入れると、上下に余白ができます。縦型でゲームを見せるなら、ゲーム映像を上に置き、下に別の情報を置く構成が、よく使われます。

縦型の解像度の目安

縦型の標準的な大きさは、横1080、縦1920です。横長のフルHD（1920×1080）を、そのまま90度回した大きさにあたります。

どの大きさが使えるかは、配信先のサービスや、ライブか投稿かによって異なります。最新の条件は、各サービスの案内で確認してください。ここでは、一般的な目安として、1080×1920を基準に説明します。

縦と横で、画面の面積の考え方は、同じです。1080×1920の面積は、1920×1080と同じです。ただし、横の幅は1080しかなく、横長の画面の56%ほど（1080÷1920）です。文字を並べられる幅が、狭くなる点が、大きな違いです。

横配信との違い

文字数の欄は、画面の幅を、文字の大きさで割った、単純な計算の結果です。縦型では、横の幅が狭いため、同じ文でも、折り返しが増えます。文を短くするか、文字の大きさを下げて、1行に収めます。

もう1つの違いは、視線の動きです。縦の画面では、視線が上から下へ動きます。重要な情報は上寄り、補助の情報は下寄りに置くのが、見やすい配置です。ただし、縦型の視聴画面では、上下にサービス側の表示が重なることがあるため、端に寄せすぎないようにします。

OBSで縦の画面を作る考え方

OBSで縦型の配信を作るには、キャンバスの大きさを、縦長に変えます。手順は、次のとおりです。

1. OBSの「設定」を開き、「映像」を選ぶ
2. 「基本（キャンバス）解像度」を、1080×1920に変える
3. 「出力（スケーリング）解像度」も、同じ値にそろえる
4. OKを押して、プレビューが縦長になったことを確認する
5. 各シーンのソース（カメラ、画像、ブラウザなど）を、縦の画面に合わせて置き直す

キャンバスの大きさを変えると、すでに作ったシーンの配置が、ずれることがあります。シーンコレクションを複製して、縦型専用のものを作り、横配信用と分けておくと、元に戻しやすくなります。項目の名前や位置は、OBSの版によって異なることがあります。

横長の配信と、縦型の配信を、同時に行いたい場合は、別の仕組みが必要になることがあります。OBS本体だけでは対応できないケースもあり、追加の機能や、別のソフトを使う方法があります。必要な場合は、使うサービスと、OBSのバージョンの案内を確認してください。

縦の画面を、3つの段で考える

縦型の画面は、上、中、下の3つの段に分けて考えると、置き場所が決めやすくなります。1080×1920の例です。

表の割合は、自分で決める目安です。サービス側の表示の位置は、サービスやアプリの更新で変わるので、具体的な数字を決めつけず、実際の視聴画面で確かめるのが確実です。下段が広いのは、コメント欄や操作ボタンが、下側に重なりやすいことが多いためです。

左右の余白は、5%で54ピクセル（1080の5%）です。文字を置くときは、この内側に収めます。

ブラウザソースのツールを、縦に置くとき

このサイトの各ツールは、OBSで作ったブラウザソースの四角い枠のなかに、描かれる仕組みです。多くのツールで、横1920×縦1080の枠が目安として案内されています。縦型のキャンバスに入れるときは、次の点に気をつけます。

• ソースの幅と高さを、キャンバスの大きさに合わせるか、置きたい場所の大きさに合わせる。横1920の枠のままだと、縦型のキャンバス（横1080）から、はみ出して切れる
• カウンターや目標などの、小さな表示は、枠を小さくして、必要な場所に置く。たとえば、幅600、高さ300のような枠にして、キャンバスの下段に置く
• 待機画面や離席中画面は、画面全体を覆う作りなので、キャンバスと同じ大きさ（1080×1920）の枠にして、見え方を確かめる。文字の大きさは、横の幅が狭い分、下げる必要がある。大きさ96では、全角で1行に約11文字しか入らない
• 流れる告知の帯は、横に長い作りなので、幅1080の枠で、下段に置く。文字の大きさは、横長の初めの値より下げすぎず、読める大きさに調整する

ツールによって、枠の中の配置の仕方は異なります。枠の大きさを変えたときに、表示がどう変わるかは、実際にOBSのプレビューで見て確かめてください。表示がずれる、切れるなどの場合は、ソースの幅と高さを変えてみます。

縦型のレイアウト例

縦型で、よく使われる配置の型を、3つ挙げます。1080×1920を前提にした、座標の目安つきの例です。数値は、自分の配信に合わせて、動かしてください。

ゲーム映像の縦の高さは、横1080に対して、16:9の比を保つと、1080÷16×9で約608です。縦型の画面に、横長のゲーム映像をそのまま入れると、残りの縦（1920−608で約1312）が、余ります。この余りの部分に、カメラや、告知、補助の表示を置くのが、よくある構成です。

ゲーム映像を、縦型に合わせて大きく使いたい場合は、映像の左右を切り取って（クロップして）、縦長の部分だけを見せる方法もあります。ただし、画面の端に重要な情報があるゲームでは、情報が切れるため、ゲームごとに確認が必要です。

文字の大きさの決め方

縦型の画面は、見る人の手元で、小さく表示されることが多くなります。1080ピクセル幅の画面が、スマートフォンの画面幅（数百ピクセル）に収まるように表示されるため、縮小の倍率は、横長の1920幅のときより緩やかで、同じ数字の文字なら、縦型のほうが大きく見えます。たとえば、390ピクセル幅の画面に縦型を表示すると、倍率は約0.36（390÷1080）です。文字の大きさ48は、約17ピクセルで表示されます。横配信（倍率約0.2）で、同じ数字が約9.8ピクセルだったのと比べて、読みやすい大きさです。

縦型では、文字の大きさの数字を同じにしたまま使えるわけではありません。横の幅が狭いため、数字を下げても、1行の文字数が足りなくなります。短い言葉にして、複数行に分けるのが、基本の考え方です。

縦型の動画として残す場合

縦型の配信を録画したり、横の配信から縦型の動画を切り出して投稿したりする場合は、動画ファイルの大きさにも気を配ります。横長の動画の一部を、縦型に切り出すと、元の映像の中央付近だけが使われることが多く、左右にあった文字や表示が、切れて見えなくなることがあります。

• 切り出しを前提にするなら、重要な文字を、画面の中央寄りに置く
• 縦型の動画に変換する前に、画面の左右の端に、重要な情報が出ていないかを確認する
• 字幕を入れる場合は、縦型の幅（1080）に収まる文字数にする
• 編集ソフトの書き出し設定で、縦横の大きさが、意図したとおりになっているかを確認する

縦型の動画を最初から作る場合は、編集ソフトで、プロジェクトの大きさを1080×1920に設定してから素材を並べると、あとから拡大縮小をする手間が減ります。

横配信との切り替えに備える

同じ配信者が、横長の配信と、縦型の配信を、日によって使い分けることもあります。そのとき、設定を毎回直すのは負担です。次のように、分けておくと、切り替えが楽になります。

1. OBSの「シーンコレクション」を、横用と縦用に分ける
2. それぞれで、キャンバスの大きさを設定したら、そのままにして、変えない
3. ブラウザソースのURLと、幅・高さを、それぞれのコレクションに保存しておく
4. メモに、「横用：1920×1080」「縦用：1080×1920」と、大きさを書いておく
5. 配信の前に、いまどちらのコレクションを使っているかを、OBSの画面で確認する

コレクションを切り替えると、OBSの設定の「映像」の大きさが、自動では変わらない場合があります。切り替えたあとは、設定の映像の項目も、確認してください。

縦型でのよくある失敗

配信前の確認項目

• キャンバスと出力の解像度が、どちらも1080×1920になっている
• スマートフォンで、実際に視聴して、文字が読める
• 上段、下段に、サービス側の表示が重なっても、重要な表示が隠れない
• ブラウザソースが、キャンバスの外にはみ出していない
• 全シーンを切り替えて、不要な表示が残っていない
• 音声の設定は、横配信と同じでよいかを確認した

配信前に、手元でできる試し方

縦型の見え方を確かめるには、実際の視聴端末で見るのが一番です。限定公開の配信や、非公開の録画を、スマートフォンで開いて、手に持った状態で見ます。パソコンのプレビューで見たときに比べて、文字の大きさや、余白の感覚が違うことに気づけます。可能なら、画面の大きさが異なる端末（小さめのスマートフォン、大きめのスマートフォン）の両方で確認します。

確認用に、画面の上に、仮の文字（「ここに文字が入ります」など）を置いて、1行の文字数と、折り返しの位置を見る方法もあります。本番の文が決まっていなくても、配置の問題を先に見つけられます。

まとめ

縦型は、1080×1920を基準に考えます。横の幅が1080しかないので、1行に入る文字数が減ります。文を短くして、上段、中段、下段の3つに分けて、置く場所を決めます。サービス側の表示が重なる場所には、重要な情報を置かず、実際の視聴画面で確かめます。ツールを入れるときは、ソースの幅と高さを、縦型の画面に合わせて調整してください。

あわせて読みたい記事