OBSの画像の追加方法は?透過やスライドショーのやり方も解説!


「OBS Studioに画像を追加したいけどやり方がわからない!」

と悩んでいる人もいるのではないでしょうか。

私自身「しふぁチャンネル」というゲーム実況チャンネルを運営していますが、実際に生配信中に画像を追加して画面に表示させた経験がありますし、スライドショーのやり方に関しても熟知しております。

なので、その実際の経験を元に、OBSに画像を追加する方法はもちろん、画像の位置を動かす方法サイズ・角度の変更方法、透過やスライドショーのやり方についても解説していきます!

スポンサーリンク

🔽OBSの使い方を全てまとめたページはこちら!
check!
>>OBS Studioの使い方まとめページを確認する!

動画でも解説しています

OBSに画像を追加(表示)する

まずは最も基本的な事として、OBSに画像を追加する設定方法を解説していきます。

もしも、OBSをインストールしていない人は、こちらでダウンロード&インストール方法を解説しているのでチェックしてみて下さい。
check!
>>OBSのダウンロード&インストール方法を確認する!

 

まず、OBSを起動したら、画像を追加したいシーンを選択し、そのソースの欄にある「+」をクリックします。

 

様々な要素が表示されますが、「画像」をクリックします。

 

ソースを作成/選択という画面が表示されるので、新規作成の所にわかりやすい名前を付けたら「OK」をクリックします。
※今回は初期設定のまま設定していきます。

 

プロパティが表示されるので、「参照」をクリックして表示させたい画像を選択しましょう。

選択できたら「OK」をクリックします。

 

すると、OBSの画面に画像が表示されます。

これがOBSに画像を追加する基本的なやり方となるので覚えておきましょう。

画像を移動させる方法

次に、画像を移動させる方法ですが、画像を左クリックでドラッグしながら移動させることで、好きな位置に動かすことができます。

 

ちなみに、ソースの欄の「画像」を右クリックして、「変換」の中にある

・画面中央に置く
・垂直方向に中央揃え
・水平方向に中央揃え

これらの選択肢を選ぶことで画像を中央の位置に移動させる事も可能です。

 

さらに、数値を入力して細かく位置調整したいのであれば、先ほどの「変換」の中にある「変換の編集」をクリックします。

 

以下のような画面が表示されるので、位置の欄の数値を変更する事で、指定した位置に移動させることができます。

設定できたら「閉じる」をクリックしましょう。

 

画像のサイズを変更する方法

次に画像のサイズを変更する方法を解説していきますが、

・ドラッグしてサイズ変更する
・数値を入力してサイズ変更する
・変換から画面に合わせてサイズ変更する

この3種類のやり方があるので、それぞれの方法を解説していきます。

 

ドラッグしてサイズ変更する

まずは、ドラッグしてサイズ変更する方法についてですが、ソースの欄の画像を選択すると、画面に表示されている画像の周りに■が付いた赤い枠が表示されます。

 

この■の部分を左クリックでドラッグして移動させることで、画像の縦横比を維持したままサイズ変更することが可能です。

ちなみに、Shiftキーを押しながらドラッグすると、縦横比を無視して自由にサイズ変更する事ができるので覚えておきましょう。

 

数値を入力してサイズ変更する

次に数値を入力してサイズ変更する方法を解説していきますが、ソースの欄の「画像」を右クリックして「変換」の中にある「変換の編集」をクリックします。

 

以下のような画面が表示されますが、大きさの欄の数値を変更する事で指定した大きさにサイズ変更することができます。

ちなみに、1920×1080に設定すれば画面いっぱいに表示させることが可能です。

設定できたら「閉じる」をクリックしましょう。

 

変換から画面に合わせてサイズ変更する

次に、変換から画面に合わせてサイズ変更する方法ですが、ソースの欄の「画像」を右クリックして「変換」の中にある

・画面に合わせる
・画面に引き延ばして置く

このどちらかを選ぶ事でもサイズ変更する事ができ、画面いっぱいに画像を表示させることが可能です。

画像を反転させる方法

次に画像を反転させたい人もいると思うので、そのやり方を解説していきます。

反転させる方法として、

・ドラッグして反転させる
・変換から反転させる

という、2種類のやり方があるので、それぞれ解説します。

 

ドラッグして反転させる

まずは、ドラッグして反転させる方法ですが、ソースの欄の画像を選択して、画像の周りに■が付いた赤い枠を表示させて下さい。

 

次に右側の■の部分を左側にドラッグしていくと画像の左端を超えたあたりで画像が反転します。

 

反転できたら、以下のように位置・サイズを調整してあげましょう。

この要領で■をドラッグしながら上から下、下から上に移動させる事で垂直方向にも反転させることが可能です。

 

変換から反転させる

次に、変換から反転させる方法ですが、ソースの欄の「画像」を右クリックして、「変換」の中にある「水平反転」もしくは「垂直反転」をクリックします。

 

「水平反転」と「垂直反転」の両方を行うとこのような感じです。

ドラッグして反転させる方法と違って同じ位置のまま反転させることができるので、今設定している画像の場所から動かしたくない時にこの方法を使うのがおすすめです。

 

画像の角度を変えて回転させる方法

次に画像を90度回転させたり、微妙な角度をつける方法を解説します。

90度・180度回転させる

ソースの欄の「画像」を右クリックして「変換」の中にある

・時計回りに90度回転
・反時計回りに90度回転
・180度回転

これらを選択する事で画像を90度・180度回転させることができます。

 

実際に「時計回りに90度回転」を選択してみると以下のようになります。

あとは画像を移動させたり、サイズ変更して調整しましょう。

 

指定の角度に設定する

もしも、角度を指定したい場合は、ソースの欄の「画像」を右クリックして「変換」の中にある「変換の編集」をクリックします。

 

以下のような画面が表示されますが、回転の欄に数値を入力して角度を変更します。

設定できたら「閉じる」をクリックしましょう。

 

今回は30と入力したので時計回りに30度の角度をつけることができました。

反時計回りに角度をつけたいのならマイナスの数値に設定するようにしましょう。

 

画像を透過(透明化)させる方法

次に画像を透過(透明化)させる方法を解説します。

ソースの欄の「画像」を右クリックして「フィルタ」をクリックしましょう。

 

フィルタの設定画面が表示されるので、左下にある「+」をクリックします。

 

「カラーキー」をクリックします。

 

名前を指定してくださいと出てきますが、何も変更せずに「OK」をクリックします。

 

以下のような画面が表示されますが、不透明度の調整バーを動かしたり、数値を入れることで透過(透明化)させることができます。

設定できたら「閉じる」をクリックしましょう。

 

以下のように画像を透過させることができ、画像の下にある文字が見えるようになりました!

ちなみに、フィルタで「カラーキー」を選択しましたが、「色補正」を選ぶことでも不透明度を設定して透明化させることが可能です。

あと、OBSでは文字を入れる事もできるようになっていますが、文字の入れ方を解説した記事も別途作成しているので、気になる人はこちらからやり方を確認してみて下さい!
check!
>>OBSに文字を入れたりスクロールさせる設定方法を確認する!

 

複数の画像でスライドショーを作成する方法

次に、複数の画像を使ってスライドショーを作成する設定方法を解説します。

まずは、スライドショーを入れたいシーンを選択し、ソースの「+」をクリックします。

 

「画像スライドショー」をクリックします。

 

ソースの作成/選択の画面が出るので、新規作成の所にわかりやすい名前を入力して「OK」をクリックします。

今回は初期設定のまま進めていきます。

 

プロパティの画面が表示されますが、まずはスライドショーで使いたい画像を先に入れた方が設定しやすいので、1番下までスクロールして画像ファイルの設定を行います。

画像ファイルの右にある「+」をクリックして「ファイルを追加」をクリックすると、1枚ずつ画像を追加する事ができます。

ちなみに、「ディレクトリを追加」を選択すると、フォルダで選択する事ができるので、画像をまとめて追加することが可能です。

 

ちなみに、間違えて画像を追加してしまった場合は、削除したい画像を選択した状態で「-」をクリックすると削除する事ができます。

 

もしも、削除するのではなく、画像を置き換えたい場合は、置き換えたい画像を選択した状態で歯車マークをクリックして画像を選択すると置き換えることが可能です。

 

あと、スライドショーは上から順番に表示されていきますが、もしも順番を変更したい場合は、画像を選択した状態で上マーク・下マークをクリックする事で順番を変更することが可能です。

 

スライドショーで表示させる画像が追加できたら、次に1番上までスクロールして、表示の動作を設定します。

表示の動作には、

・表示されていないときにも常に再生する
・表示されていないときは停止し、表示されているときは再開する
・表示されていないときは一時停止し、表示されているときは一時停止しない

といった3種類の動作設定を選ぶことができます。

ただ、これを見ても「表示されている」「表示されていない」ってどういう事かよくわからない人もいるのではないでしょうか?

 

わかりやすく解説すると、以下の画像のようにソースの欄を見てみると「目のマーク」があると思います。

今の状態は、目を開いている状態なので「表示されている」状態になっています。

 

ちなみに、この「目のマーク」をクリックする事で画像が消えます。

マークも目が閉じられている状態になるので、「表示されていない」状態になっています。

 

この事を理解したうえで、

・表示されていないときにも常に再生する
・表示されていないときは停止し、表示されているときは再開する
・表示されていないときは一時停止し、表示されているときは一時停止しない

この3種類の設定をわかりやすくすると、

【表示されていないときにも常に再生する】
スライドショーの「目のマーク」が閉じられ、OBSの画面に映っていなくても常にスライドショーは動き続ける。

「目のマーク」が開いて、OBSの画面に映った場合は目を閉じた時の画像よりも先に進んでいる設定。

【表示されていないときは停止し、表示されているときは再開する】
スライドショーの「目のマーク」が閉じられ、OBSの画面に映っていない時はスライドショーが停止する。

「目のマーク」が開いて、OBSの画面に映った場合は1番最初からスライドショーを再開する設定。

【表示されていないときは一時停止し、表示されているときは一時停止しない】
スライドショーの「目のマーク」が閉じられ、OBSの画面に映っていない時はスライドショーが停止する。

「目のマーク」が開いて、OBSの画面に映った場合は目を閉じた時の画像からスライドショーを再開する設定。

このようになるので、自分の好みの設定にするようにしましょう。

 

次にスライドモードを選択します。

・自動
・手動(ホットキーを使用してスライドショーを制御する)

の2種類があるので、好きな方を選択してください。

ちなみに、手動(ホットキーを使用してスライドショーを制御する)に関してですが、ホットキーとは「ショートカットキー」といえば想像しやすいですかね。

手動で操作するためのキーの割り当てを自分で設定する必要があります。

 

設定方法に関してですが、一旦「OK」をクリックしてプロパティの画面を閉じ、画面右下の「設定」をクリックします。

 

画面左にある「ホットキー」をクリックして、「画面スライドショー」の欄を探しましょう。

・再生/一時停止
・再開
・停止
・次のスライド
・前のスライド

という、5つの項目があるので、横の黒い枠の中をクリックした後にキーボードのボタンを押すと、押したボタンがホットキーとして設定されます。

必要に応じて、各項目のホットキーを設定して、設定できたら「OK」をクリックしましょう。

 

次にトランジションの設定を行いますが、次の画像へ切り替わる時の動きを設定します

・カット
・フェード
・スワイプ
・スライド

この4種類があるので、画面を見ながら自分好みに設定してください。

 

次に「スライド時間間隔」と「画面切り替え速度」を設定します。

ちなみに、時間の単位はミリ秒となっており、1000分の1秒と等しい時間の単位となっています。

上の画像だとスライド時間間隔を4000に設定していますが、いわゆる4秒間は画像が表示される設定となっています。

画面切替速度は700に設定していますが、いわゆる0.7秒かけて画面を切り替える設定になっているので、数値を大きくすればするほどゆっくりと画面が切り替わります。

ただ、トランジションをカットに選択している場合は、画面切替速度の設定は反映されないので注意しましょう。

 

次に、

・繰り返し
・スライドショーが終わったら非表示にする
・ランダム再生

という、チェック項目があるので、必要であればチェックを入れましょう。

バウンディングサイズ/アスペクト比は自動で大丈夫です。

設定できたら「OK」をクリックします。

 

あとは、スライドショーを表示させる場所や大きさを変更したら設定はOKです。

これでスライドショーの設定は完了です。

お疲れさまでした。

他にもOBSの生配信・録画設定方法や、BGMを追加する方法など、OBSの使い方をまとめたページを作成しているので、他の設定方法も気になる人はこちらからチェックしてみて下さい!
check!
>>OBS Studioの使い方まとめページを確認する!

まとめ

今回は、OBS Studioの画面内に画像を追加する設定方法と、画像の位置を動かす方法、サイズ変更、角度変更(回転)、透過、スライドショーのやり方を解説しました!

ちなみに、私自身「しふぁチャンネル」というゲーム実況チャンネルを運営していますが、

「YouTubeゲーム実況でチャンネル登録者1000人突破するまでにやった15の方法」

という記事をnoteにて販売しております。

少しでも早くYouTubeのゲーム実況チャンネルを大きくしたい!収益化まで行きたい!と考えている人にとって役に立つ情報を紹介しているのでチェックしてみて下さい!
check!
>>YouTubeゲーム実況でチャンネル登録者1000人突破するまでにやった15の方法を確認する!

スポンサーリンク
この記事を書いた人
アバター

1993年5月生まれ。
WEB関係のお仕事で独立し、YouTubeで「しふぁチャンネル」というゲーム実況チャンネルを運営中。
アクションゲームを中心に18時頃から毎日生配信をしています。
生配信や動画投稿、撮影・編集作業などチャンネル運営をしていく過程で経験したことや、ゲーム実況をこれから始めるあなたの悩みが少しでも晴れるように、有益な情報をお届けします!

しふぁをフォローする
OBS
しふぁをフォローする
しふぁチャンネルのゲーム実況ブログ

コメント

タイトルとURLをコピーしました