Share
OBSで画像を動かす方法とは？配信時に立ち絵を動かす方法も解説
OBSで配信を行う際、画像を動かしてみたいと考える方もいるでしょう。本記事では画像を動かす方法について詳しく解説しています。
また、配信時にキャラクターの画像を用いている方向けに、立ち絵を動かす方法も解説しています。
さらに、解像度や背景透過など、画像に関する設定も記載しているため、画像を動かしたい方や綺麗な画像を使いたい方はぜひ参考にしてください。
OBSで画像を動かす方法
OBSで画像を動かす方法は以下の2つです。
- 画像をスクロールさせて動かす
- スライドショー形式で動かす
それぞれの動かし方については、以下の章で詳しく解説します。
画像をスクロールさせる手順
画像をスクロールさせるというのは、表示する画像を右から左、もしくは上から下方向に動かす方法です。手順は以下のとおりです。
- ソースから画像を追加する
- フィルタを追加する
- 画像をスクロールさせる
継続的に動かしたい場合の設定も解説しているため、参考にしてください。
ソースから画像を追加する
OBSを起動し、「ソース」のプラスボタンを押しましょう。
プラスボタンを押すと項目が表示されるため、「画像」を選択しましょう。
「画像」をクリックすると以下の画面が表示されるため、「参照」ボタンを押して動かしたい画像を追加してください。
最後にOKボタンを押して画像の追加は完了です。
なお、画像ではなくテキストを動かしたい場合は、ソースのプラスボタンから「テキスト」を選ぶことで文字を追加できます。
フィルタを追加する
画像の追加が完了後、「フィルタ」を追加する作業に移ります。
まず、OBSに追加済みの画像を右クリックすると以下画像の表記が出るため、「フィルタ」を選択しましょう。
フィルタ選択後に表示される画面左下のプラスボタンを押し、「スクロール」を選択してください。
画像をスクロールさせる
スクロールを選択すると、以下の設定画面が表示されます。
「水平速度」と「垂直速度」のバーもしくは数値を変更し、画像をスクロールさせることができます。
まず「水平速度」は、画像を右から左に動かす設定です。数値を0以上にすると右から左、0以下にすると左から右にスクロールします。
次に「垂直速度」は、画像を上下に動かす設定です。数値を0以上にすると下から上、0以下にすると上から下にスクロールします。
また、水平速度と垂直速度を組み合わせることで、斜め方向に画像をスクロールさせることが可能です。
例えば、水平速度を50.00、垂直速度を-50.00に設定すると、画像は斜め下方向にスクロールします。反対に水平速度を-50.00、垂直速度を50.00にすると、画像は斜め上方向にスクロールします。
なお、ループ（繰り返し）にチェックを入れると連続で画像を動かすことが可能です。以下画像のとおり、設定画面にてスクロールの動き方が確認できるため、数値を変更して希望する方向に画像を動かしてみましょう。
スライドショー形式で動かす手順
本章では画像をスライドショー形式で動かす方法を解説します。スライドショーは、配信に合わせて画像を切り替えたい場合に有効です。複数の画像を配信に使っている方はぜひ参考にしてください。
ソースに画像スライドショーを追加する
まずは、「ソース」のプラスボタンを押し、「画像スライドショー」を選択してください。
画像スライドショーをクリックすると設定画面が出るため、「画像ファイル」のプラスボタンを押すと、画像の選択ができます。
画像は複数枚選択できるため、スライドショー形式で表示したい画像を選択しましょう。
スライドショーの設定内容を確認する
スライドショー形式で表示したい画像を選択すると、以下画像の赤枠内でスライドショーが流れます。
画像が自動で切り替わっていれば、設定は完了です。
なお、プロパティ内の「トランジション」からは、スライドショーの動かし方を変更できます。
上記画像のとおり4種類の動かし方が選べるため、配信に合ったものを選択してみましょう。
また、以下画像赤枠内の「スライド時間間隔」や「画面切替速度」を変更すれば、画像1枚あたりの表示時間やスライドが切り替わるスピードが調整可能です。
配信方法に合わせ、1枚1枚のスライドを長く表示させたいときなどに活用してください。
立ち絵を動かす手順
本章では、配信に立ち絵を利用している方向けに、立ち絵を動かす方法を解説します。
配信者が話すと同時に、立ち絵も動かしたい場合などに活用してください。
立ち絵表示ジェネレータにアクセスする
まず初めに、「立ち絵表示ジェネレーター」にアクセスしましょう。
今回紹介する方法では、CSSを作成し、OBS内に貼り付けることで立ち絵を動かします。「立ち絵表示ジェネレーター」はCSSを自動で生成してくれるため、自力で設定する手間が省けます。
なお、立ち絵表示ジェネレーターでは立ち絵の点滅や動くスピード、枠の色などの自由なカスタマイズが可能です。
サイト内で好みの見た目を設定し、自動生成されたCSSをOBSに貼り付けて活用しましょう。「立ち絵表示ジェネレーター」のサイトは以下からアクセスできます。
ソースにブラウザを追加する
まずはOBSを開き、「ソース」のプラスボタンを押して「ブラウザ」を追加しましょう。
次に、「Discord」を起動しましょう。Discordは無料でダウンロードできるアプリのため、インストールしていない場合は以下からインストールしておきましょう。
Discordの起動完了後、「Discord StreamKit Overlay」にアクセスしてください。
DiscordでボイスウィジェットのURLを取得する
アクセスすると、以下の画面が表示されます。
矢印の「Install for OBS」をクリックすると以下画面に遷移するため、「VOICE WIDGET」を選択し、赤枠内のURLをコピーしてください。
コピーが完了したらOBSに戻り、ソースに追加した「ブラウザ」をクリックしてURLを貼り付けましょう。
カスタムCSSを作成し入力する
次に、立ち絵表示ジェネレーターに戻り、動きの速さや枠の点滅の有無など、好みの設定に変更しましょう。
好みの設定が決まったら、画面を下にスクロールすると自動で生成されたCSSが表示されています。
生成されたCSSを全てコピーし、OBSの「ブラウザのプロパティ」にある「カスタムCSS」に貼り付けましょう。
最後にOKを押せば、設定は完了です。
OBSで画像を回転・反転させる方法
本章では、OBSで画像を回転・反転させる方法を解説します。画像を回転させたい場合、方向や回転する角度などを自由に変更できます。
なお、反転の場合は水平・垂直方向に変更可能です。
画像を回転させる手順
OBSの左上にあるプレビュー画面に表示された画像を右クリックし、「変換」を選択してください。
変換を選ぶと、以下項目が選択できます。
- 時計回りに90度回転
- 反時計回りに90度回転
- 180度回転
選択肢の中から回転したい方向の項目をクリックすれば、即時反映されます。
なお、90度・180度以外の角度に回転させたい場合は、右クリックで「変換」を選択後「変換の編集」を選んでください。
変換の編集をクリックすると、以下画面が出力されるため、「回転」の部分の数値を変更することで指定以外の角度に変更可能です。
画像を反転させる手順
画像の反転も、回転と同様に画像を右クリックして「変換」を選びます。
変換を選ぶと「水平反転・垂直反転」が表示されるため、希望する方向に反転させましょう。
なお、水平方向は左右を反転、垂直方向は上下を反転させることが可能です。
OBSで画像の解像度を設定する際のポイント
本章では、OBSで画像の解像度を上げる方法を解説します。配信で画像を使う方にとって、解像度は注目したいポイントでしょう。
綺麗な画像を使うと視聴者にも見やすくなるため、満足度向上にもつながります。配信のレベルを上げたい方はぜひ参考にしてください。
解像度の重要性
画像の解像度を高くすると、視聴者に綺麗な画像を届けることができるという大きなメリットがあります。
しかし、解像度が高すぎると使用するPCや配信に影響を及ぼす可能性があるため、注意が必要です。
解像度が高い場合、画像は綺麗になりますが、PCには大きな負荷がかかります。PCの処理速度も遅くなるため、配信が途切れてしまったり、途中で止まったりするリスクがあります。
しかしながら、解像度を下げすぎると画像は粗くなり、視聴者が不満に思う可能性があるでしょう。解像度の理想は、高すぎず低すぎないラインで設定することが望ましいです。
以下の章で、解像度設定の詳細や、注目すべきポイントを解説します。解像度設定を理解し、視聴者が満足する配信を行いましょう。
出力解像度
OBSにおける出力解像度は、視聴者が目にする映像の解像度に直結します。
なお、出力解像度を上げる場合はデータ消費量が増えるため、スペックの高いPCを使用するようにしましょう。データ容量に余裕がないPCを使用する場合は、出力解像度を下げることで対応可能です。
設定は、OBSを開いて画面左上にある「ファイル」を選択し、「設定」を選びます。
設定を選択後「映像」をクリックし、「出力（スケーリング）解像度」から解像度設定の変更が可能です。
なお、出力（スケーリング）解像度の推奨値は1280×720です。
ビットレート
OBSにおけるビットレートは、1秒間にどれほど映像を送信できるかを表しています。
ビットレートの数値が高いほど高品質な映像を流すことが可能ですが、PCのスペックが不足している場合、配信時のタイムラグを引き起こす原因となります。
設定は、OBSを開いて画面左上の「設定」を押し、「出力」を選択します。
出力の中の「映像ビットレート」から、数値の変更が可能です。
なお、主なプラットフォームごとの推奨値は以下のとおりです。
- Twitch：3,000～6,000kbps
- ニコニコ生放送 ：最大6,000kbps
- ツイキャス： 最大6,000kbps
- YouTube Live：10,000kbps
設定を行う際の参考にしてください。
また、配信や録画時のビットレートの目安は以下の記事で詳しく解説しているため、参考にしてください。
【OBSのビットレート目安】配信＆録画時の設定をわかりやすく解説
フレームレート
OBSにおけるフレームレートはFPS値とも呼ばれ、1秒間にどれほど画像を表示できるかを表します。フレームレートの数値が高いほど、配信時の映像が滑らかになります。
最大で120fpsまで設定可能ですが、120fpsの場合は高スペックのPCが必須です。一般的な配信の場合は30〜60fpsでも問題ないため、フレームレートを調整する際の参考にしてください。
設定は、画面左上の設定から「映像」を選択します。
赤枠内の「FPS共通値」の数値を変更することで、フレームレートの設定を変更できます。
注意点として、プラットフォームによってはFPSの値が30fpsまでしか対応していない場合があります。対応できる数値はよく確認して、配信を行いましょう。
OBS配信で背景を透過する3つの方法
OBS配信で背景を透過する方法は、以下の3つです。
- クロマキー合成
- OBSプラグイン
- NVIDIA Broadcast
それぞれの方法について、以下の章で解説します。
クロマキー合成
クロマキー合成とは、指定した映像から緑・青・マゼンタなどの色がかかる部分を透明にできる機能です。グリーンスクリーンで撮影した映像から、被写体のみを合成させたい場合に役立ちます。
初めにOBSを開き、「ソース」欄のプラスボタンを押しましょう。
次に、「映像キャプチャデバイス」を選択してください。
映像キャプチャデバイス内で任意の映像を選択すると、OBSの画面にプレビュー画面が表示されます。
プレビュー画面に表示されたソースの下にある「フィルタ」をクリックしてください。
フィルタをクリックすると上記の画面が表示されるため、「エフェクトフィルタ」の左下にあるプラスボタンから「クロマキー」を選択しましょう。
「色キーの種類」で透過したい色（グリーンスクリーンなら緑）を選択すると、背景の透過化が完了です。
NVIDIA Broadcast
グリーンスクリーンを用意せずに背景を透過したい場合、NVIDIA Broadcastの利用がおすすめです。ダウンロードは以下リンクから行いましょう。
「ビデオエフェクト」のダウンロード欄より、自身のPCに対応したものを選択してダウンロードしましょう。
ダウンロード完了後はOBSに戻り、映像キャプチャで追加したソースを編集します。まず、OBSのプレビュー画面下にある「フィルタ」を選択してください。
画面左下に表示された「エフェクトフィルタ」のプラスボタンを押すと、「NVIDIAバックグラウンド除去」が選択できるようになります。
最後に、OBSの最初の画面に戻り、「ソース」欄から透過したい画像・動画を選択して作業は完了です。
OBSプラグイン
最後は、OBSにプラグインを導入する方法を紹介します。背景透過におすすめのプラグインは「obs-backgroundremoval」です。
「obs-backgroundremoval」は、以下のリンクからダウンロード可能です。
ダウンロード完了後、OBSの「ソース」のプラスボタンから透過したい画像・映像を選択します。
次に、追加したソースの下に表示された「フィルタ」を選択すると以下の画面が表示されるため、「音声フィルタ」のプラスボタンから「Background Removal」を選択しましょう。
設定画面上の「Background Color」を緑色に設定し、最後にクロマキー機能を使って緑色を透過すれば、作業は完了です。
なお、プラグインの詳しい入れ方は以下の記事で解説しているため、参考にしてください。
OBSにおけるプラグインの入れ方とは？おすすめのプラグインも紹介
また、クロマキー合成やグリーンバックなしで背景透過する方法については、以下の記事でも詳しく解説しています。
OBSでクロマキー合成&グリーンバックなしで背景透過する方法！
OBSで画像を動かしたら、次は？
今回は、OBSで画像を動かす方法について解説しました。スクロールやスライドショーを活用することで、配信画面に動きを加え、より魅力的な演出が可能になります。
画像の演出を強化したら、次は配信全体のデザインにもこだわってみませんか？
配信画面作成サービス「Alive Studio」を活用すれば、より洗練された配信を実現できます。
- VTuber向け素材制作チーム「うさねこメモリー」提供の背景・小物素材が1,000種類以上使い放題！
- 音楽素材サイト「魔王魂」提供のBGMが100曲以上使い放題！
- お題ルーレット・カウンター機能搭載！
- 全機能使えて、月額980円（税込）！
「画像の演出を工夫したら、次は配信全体のクオリティをアップしたい！」
そんな方は、今すぐ「Alive Studio」をお試しください！
＼ まずは無料お試し7日間！あなたの配信をワンランクアップ！ ／
