Difference between revisions of "OBS-Studio/C2/Getting-familiar-with-OBS/English"

From Script | Spoken-Tutorial
Jump to: navigation, search
(Created page with "Title: Getting familiar with OBS Author: Nikita Misal {| border="2" |- || '''Visual Cue''' || '''Narration''' |- || '''Slide''': Title || Welcome to the '''spoken tutorial''...")
 
Line 12: Line 12:
 
|-
 
|-
 
|| '''Slide''': Learning Objectives
 
|| '''Slide''': Learning Objectives
−
|| In this tutorial, we will learn:* About the '''OBS''' work''' '''area
+
|| In this tutorial, we will learn about the '''OBS''' work area
  
 
We will also learn to
 
We will also learn to
 
* Use '''Edit '''menu
 
* Use '''Edit '''menu
 
* Take '''Screenshots'''
 
* Take '''Screenshots'''
−
* Use '''Filters '''in OBS
+
* Use '''Filters '''in '''OBS'''
 
* Use '''Transform '''options and
 
* Use '''Transform '''options and
 
* '''Cropping '''
 
* '''Cropping '''
Line 24: Line 24:
 
|| '''Slide: '''OS and Versions
 
|| '''Slide: '''OS and Versions
  
−
|| '''OBS Studio '''can '''run''' on any of the following operating systems''':'''
+
|| '''OBS Studio '''can '''run''' on any of the following '''operating systems''':
  
 
* '''Microsoft Windows 8''' or higher versions
 
* '''Microsoft Windows 8''' or higher versions
Line 40: Line 40:
 
|| This tutorial is recorded using
 
|| This tutorial is recorded using
 
* '''Windows 10'''  
 
* '''Windows 10'''  
 +
*'''OBS Studio''' verion 27.0.1 and
 
* '''Firefox web browser'''.
 
* '''Firefox web browser'''.
  
Line 46: Line 47:
 
The steps demonstrated are exactly the same on '''Linux''' and '''Mac OSX'''.
 
The steps demonstrated are exactly the same on '''Linux''' and '''Mac OSX'''.
 
|-
 
|-
−
|| Click on '''Start menu>> '''Type '''OBS>> '''Double-click on '''OBS Studio icon'''
+
|| Click on '''Search>> '''Type '''OBS>> '''Double-click on '''OBS Studio''' icon
 
|| Let us open '''OBS Studio.'''
 
|| Let us open '''OBS Studio.'''
  
−
For that, click on the Search''' icon''' at the bottom left of the screen.
+
For that, click on the '''Search''' icon at the bottom left of the screen.
  
 
Type '''OBS''' in the '''search bar''' and press '''Enter'''.
 
Type '''OBS''' in the '''search bar''' and press '''Enter'''.
Line 60: Line 61:
 
We see '''scenes''' with the names '''Opening Scene 001''' and '''Scene 002'''.
 
We see '''scenes''' with the names '''Opening Scene 001''' and '''Scene 002'''.
  
−
We also see '''sources''' listed as '''Screen capture 001''', '''Screen Capture 002'''  
+
We also see '''sources''' listed as '''Screen capture 001''', '''Screen Capture 002'''.
  
 
And '''Arvind’s external mic'''
 
And '''Arvind’s external mic'''
Line 75: Line 76:
 
|| Click on Edit menu, then move cursor towards Lock Preview to view the tick mark
 
|| Click on Edit menu, then move cursor towards Lock Preview to view the tick mark
  
−
A '''tick mark''' symbol appears in front of''' '''the '''Lock Preview '''option.
+
A '''tick mark''' symbol appears in front of the '''Lock Preview '''option.
 
|-
 
|-
 
|| Point towards '''✓''' symbol  
 
|| Point towards '''✓''' symbol  
  
 
Text on screen:“Lock Preview prevents the editing of any '''scene''' by accident.”
 
Text on screen:“Lock Preview prevents the editing of any '''scene''' by accident.”
−
|| The '''tick mark '''indicates that we cannot edit the '''source position '''or '''size '''in the '''preview window.'''
+
|| The '''tick mark '''indicates that we cannot edit the '''source position '''or '''size '''in the '''Preview''' window.
  
 
This '''setting''' prevents the editing of any '''scene''' by accident.
 
This '''setting''' prevents the editing of any '''scene''' by accident.
Line 90: Line 91:
 
|| Next, let us learn about '''Preview Scaling.'''
 
|| Next, let us learn about '''Preview Scaling.'''
 
|-
 
|-
−
| | Right-click on the '''preview area'''
+
| | Right-click on the '''Preview area'''
  
 
'''Preview Scaling'''>>'''Output(1024*614)'''
 
'''Preview Scaling'''>>'''Output(1024*614)'''
  
−
| style="background-color:transparent;border:0.75pt solid #808080;padding:0.035cm;" | To scale the '''Preview '''window to a fixed size of '''output''', right-click on the '''Preview area.'''
+
| | To scale the '''Preview '''window to a fixed size of '''output''', right-click on the '''Preview area.'''
  
−
From the '''context menu,''' select '''Preview Scaling.'''
+
From the context menu select '''Preview Scaling.'''
  
−
From the sub-menu, select''' <span style="background-color:transparent;color:#252525;">Output (1280x720) '''<span style="background-color:transparent;color:#252525;">option.
+
From the sub-menu, select '''Output (1280x720)''' option.
 
|-
 
|-
 
||  
 
||  
Line 144: Line 145:
 
|-
 
|-
 
|| Point towards '''Opening-scene-001''' dialog box
 
|| Point towards '''Opening-scene-001''' dialog box
−
|| '''Filters for Opening-scene-001''' dialog box opens in the first case
+
|| '''Filters for Opening-scene-001''' dialog box opens in the first case.
  
−
Whereas, '''Filters for Screen Capture 001''' opens up in the second case
+
Whereas, '''Filters for Screen Capture 001''' opens up in the second case.
  
−
This is because, in the second case we have selected the source
+
This is because, in the second case we have selected the '''source'''.
 
|-
 
|-
 
|| Point towards '''Effect Filters'''
 
|| Point towards '''Effect Filters'''
Line 163: Line 164:
 
|-
 
|-
 
|| Point towards all the '''filters''' >> Select the''' Luma key'''
 
|| Point towards all the '''filters''' >> Select the''' Luma key'''
−
|| A '''context menu''' with a list of '''filter '''options opens up.
+
|| A context menu with a list of '''filter '''options opens up.
  
 
Here, we will select the''' Luma key.'''
 
Here, we will select the''' Luma key.'''
Line 186: Line 187:
 
|| Now, click on the '''Close''' button at the bottom right of the dialog box to complete the changes.
 
|| Now, click on the '''Close''' button at the bottom right of the dialog box to complete the changes.
 
|-
 
|-
−
|| Point towards the white''' '''colors turned to '''greyish '''black  
+
|| Point towards the white colors turned to '''greyish '''black  
−
|| In the '''Preview window '''notice that the white''' '''colors have turned to greyish black now.  
+
|| In the '''Preview window '''notice that the white colors have turned to greyish black now.  
 
|-
 
|-
 
|| Press''' CTRL Z'''
 
|| Press''' CTRL Z'''
Line 204: Line 205:
  
 
Context menu select '''Transform'''
 
Context menu select '''Transform'''
−
|| To transform '''Source''', right-click on the '''Screen Capture 001 '''in the '''Sources''' list pane.
+
|| To transform '''source''', right-click on the '''Screen Capture 001 '''in the '''Sources''' list pane.
  
−
From the '''context menu''' select '''Transform.'''
+
From the context menu select '''Transform.'''
 
|-
 
|-
 
|| Click on the '''Edit '''menu >> '''Transform'''
 
|| Click on the '''Edit '''menu >> '''Transform'''
Line 213: Line 214:
 
|| Alternately, click on the '''Edit '''menu on the''' Menu bar''', and click on '''Transform.'''
 
|| Alternately, click on the '''Edit '''menu on the''' Menu bar''', and click on '''Transform.'''
  
−
From the '''context menu,''' click on '''Edit Transform.'''
+
From the context menu, click on '''Edit Transform.'''
 
|-
 
|-
 
|| Point towards '''Scene Item Transform '''dialog box
 
|| Point towards '''Scene Item Transform '''dialog box
  
 
Rotation >> 90
 
Rotation >> 90
−
|| '''Scene Item Transform '''settings dialog box appears.
+
|| '''Scene Item Transform settings''' dialog box appears.
  
 
Under '''Rotation''', we’ll change the value to '''90'''.
 
Under '''Rotation''', we’ll change the value to '''90'''.
Line 225: Line 226:
  
 
Select '''Center-Left'''
 
Select '''Center-Left'''
−
|| Then click on the arrow besides the''' Position Alignment '''field'''.'''
+
|| Then click on the arrow besides the''' Position Alignment '''field.
  
 
From the drop-down, select '''Center-Left.'''
 
From the drop-down, select '''Center-Left.'''
Line 233: Line 234:
 
|-
 
|-
 
|| Point towards the '''Preview screen'''
 
|| Point towards the '''Preview screen'''
−
|| Notice that in the '''Preview '''window''' '''the alignment of the '''Scene '''has changed.
+
|| Notice that in the '''Preview '''window the alignment of the '''scene '''has changed.
 
|-
 
|-
 
|| Only narration
 
|| Only narration
Line 248: Line 249:
 
We do '''manual transformation''' to resize the screen visually as per our requirement.
 
We do '''manual transformation''' to resize the screen visually as per our requirement.
 
|-
 
|-
−
| style="color:#252525;" | Move the cursor a per the narration
+
| | Move the cursor a per the narration
 
|| Move the cursor over a small''' red square handle''' at the bottom right of the '''source bounding box.'''
 
|| Move the cursor over a small''' red square handle''' at the bottom right of the '''source bounding box.'''
 
|-
 
|-
Line 259: Line 260:
 
|| Press '''CTRL Z''' to undo the changes.
 
|| Press '''CTRL Z''' to undo the changes.
 
|-
 
|-
−
| style="color:#252525;" | Point to the side handles for height and then for width
+
| | Point to the side handles for height and then for width
 
|| We can also change only the height or width by resizing using the side '''square handles'''.  
 
|| We can also change only the height or width by resizing using the side '''square handles'''.  
 
|-
 
|-
Line 268: Line 269:
 
||  
 
||  
 
* '''Crop''' option removes unwanted portions of a video to create '''focus''' on the composition
 
* '''Crop''' option removes unwanted portions of a video to create '''focus''' on the composition
−
* We can crop an image from either '''left''', '''right''', '''top''' or '''bottom'''
+
* We can crop an image from either left, right, top or bottom.
  
 
|-
 
|-
Line 306: Line 307:
 
|-
 
|-
 
|| '''Slide''': Summary
 
|| '''Slide''': Summary
−
|| In this tutorial, we learnt:
+
|| In this tutorial, we learnt about the '''OBS''' work area.
  
−
* About the '''OBS''' work''' '''area
+
We will also learnt to* Use '''Edit menu'''
−
 
+
−
We will also learnt to* Use '''Edit '''menu
+
 
* Take '''Screenshots'''
 
* Take '''Screenshots'''
−
* Use '''Filters '''in OBS
+
* Use '''Filters '''in '''OBS'''
 
* Use '''Transform '''options and
 
* Use '''Transform '''options and
 
* '''Cropping'''
 
* '''Cropping'''
Line 321: Line 320:
 
|| As an assignment
 
|| As an assignment
  
−
* Scale the '''Preview screen''' to the '''maximum '''size.
+
* Scale the '''Preview screen''' to the maximum size.
 
* Navigate the screen using '''Spacebar'''
 
* Navigate the screen using '''Spacebar'''
 
* Apply the '''color correction filter'''
 
* Apply the '''color correction filter'''
−
* '''Adjust '''the '''settings '''and observe the difference in the colors
+
* Adjust the '''settings '''and observe the difference in the color
−
* '''Transform '''the screen to '''Rotation 180 '''
+
* Transform the screen to '''Rotation 180'''
  
 
|-
 
|-
Line 346: Line 345:
 
|| Spoken Tutorial project is funded by the Ministry of Education (MoE), Govt. of India
 
|| Spoken Tutorial project is funded by the Ministry of Education (MoE), Govt. of India
 
|-
 
|-
−
| |  
+
||  
−
| | This is Arvind Pillai along with Nikita Misal from IIT Bombay signing off.  
+
|| This is Arvind Pillai along with Nikita Misal from IIT Bombay signing off.  
  
 
Thank you for joining.
 
Thank you for joining.
 
|-
 
|-
 
|}
 
|}

Revision as of 16:58, 27 October 2021

Title: Getting familiar with OBS

Author: Nikita Misal

Visual Cue Narration
Slide: Title Welcome to the spoken tutorial on Getting familiar with OBS interface
Slide: Learning Objectives In this tutorial, we will learn about the OBS work area

We will also learn to

  • Use Edit menu
  • Take Screenshots
  • Use Filters in OBS
  • Use Transform options and
  • Cropping
Slide: OS and Versions OBS Studio can run on any of the following operating systems:
  • Microsoft Windows 8 or higher versions
  • GNU/Linux OS 18.04 or higher versions
  • Mac OS X 10.13 or higher versions
Slide: Prerequisite To practice this tutorial, you should have basic knowledge of computers.

You should also know how to use a web browser.

Slide: System Requirements This tutorial is recorded using
  • Windows 10
  • OBS Studio verion 27.0.1 and
  • Firefox web browser.

You can use any web browser of your choice.

The steps demonstrated are exactly the same on Linux and Mac OSX.

Click on Search>> Type OBS>> Double-click on OBS Studio icon Let us open OBS Studio.

For that, click on the Search icon at the bottom left of the screen.

Type OBS in the search bar and press Enter.

Double-click on the OBS icon to launch it.

Point to the Scenes and the associated Sources We see that the interface reflects all the activities done in the previous tutorial.

We see scenes with the names Opening Scene 001 and Scene 002.

We also see sources listed as Screen capture 001, Screen Capture 002.

And Arvind’s external mic

Only narration First of all, let us learn how to Lock Screen Preview using the Edit menu.
Click on Edit menu >> Click on Lock Preview option >> Point towards ✓ symbol To do so, click on the Edit menu on the menu bar.

Then from the sub-menu, click on the Lock Preview option.

Click on Edit menu >> Point to the Lock Preview option >> Point towards ✓ symbol Click on Edit menu, then move cursor towards Lock Preview to view the tick mark

A tick mark symbol appears in front of the Lock Preview option.

Point towards ✓ symbol

Text on screen:“Lock Preview prevents the editing of any scene by accident.”

The tick mark indicates that we cannot edit the source position or size in the Preview window.

This setting prevents the editing of any scene by accident.

Click on Edit menu >> Click on the Lock Preview Click on Lock Preview option again to enable editing in the Preview window.
Only narration Next, let us learn about Preview Scaling.
Right-click on the Preview area

Preview Scaling>>Output(1024*614)

To scale the Preview window to a fixed size of output, right-click on the Preview area.

From the context menu select Preview Scaling.

From the sub-menu, select Output (1280x720) option.

On my system, 1280x720 is the current output resolution.

Choose the option that appears in your system.

Point towards the enlarged Preview

Hold Spacebar and drag the window first to the left and then to the right

Notice that the Preview size has enlarged.

Hold Spacebar key and with the mouse drag and navigate the Preview window.

Only narration Next, let us learn how to take a screenshot in OBS.
Point to the Scene menu

Right-click on Opening-scene-001 >> select Screenshot (Scene)

To do so, go to the Scene menu at the bottom left of the screen.

Right-click on Opening-scene-001, and from the context menu select Screenshot (Scene).

Click File >> Show Recordings

And point towards the PNG files

All screenshots are saved in PNG format under the same directory as the recordings.
Only narration Likewise, try taking some more screenshots of other Sources on your own.
Only narration Next, let us learn about filters in OBS.
Right-click on Opening-scene-001 >> select

Context menu select Filters

To apply a filter, under the Sources pane right-click on Opening-scene-001.

From the context menu select Filters.

Point towards Filters button on the Source toolbar Alternatively, you can click on the Filters button on the Source toolbar too.
Point towards Opening-scene-001 dialog box Filters for Opening-scene-001 dialog box opens in the first case.

Whereas, Filters for Screen Capture 001 opens up in the second case.

This is because, in the second case we have selected the source.

Point towards Effect Filters On the left side we see Effect filters.

Click on the + button

All the filters that we add will be visible here.

Let us see an example.

On the bottom left click on the + button.

Point towards all the filters >> Select the Luma key A context menu with a list of filter options opens up.

Here, we will select the Luma key.

Filter name dialog box

Click on the OK button

Filter name dialog box pops up.

I will not change anything here and then click on the OK button.

Point to Luma key filter settings

Change the value of Luma Max to 0.7000

On the right side, a number of Luma key filter settings appears.

Here, let’s change the value of Luma Max to 0.7000

We will leave the other options as they are.

Click on the Close button Now, click on the Close button at the bottom right of the dialog box to complete the changes.
Point towards the white colors turned to greyish black In the Preview window notice that the white colors have turned to greyish black now.
Press CTRL Z Select the Preview Area and press CTRL Z to undo the changes.
Only narration Now, we will learn about Transform options in OBS.
Slide: Transform
  • Transform option changes the appearance of the video
  • It helps control the size, mirroring, rotation and cropping of the video
Right-click on Sources >> select Display Capture

Context menu select Transform

To transform source, right-click on the Screen Capture 001 in the Sources list pane.

From the context menu select Transform.

Click on the Edit menu >> Transform

Click on Edit Transform

Alternately, click on the Edit menu on the Menu bar, and click on Transform.

From the context menu, click on Edit Transform.

Point towards Scene Item Transform dialog box

Rotation >> 90

Scene Item Transform settings dialog box appears.

Under Rotation, we’ll change the value to 90.

Click on the arrow besides Position Alignment

Select Center-Left

Then click on the arrow besides the Position Alignment field.

From the drop-down, select Center-Left.

Click on the Close button Click on the Close button at the bottom right of the dialog box to complete the changes.
Point towards the Preview screen Notice that in the Preview window the alignment of the scene has changed.
Only narration This method of transformation is very useful while creating long duration video films.

It helps to keep all the scenes in uniform size and proportion throughout the video.

Press CTRL Z Press CTRL Z to undo the changes.
Only narration Next, let’s perform manual transformation of the source in the Preview window.

We do manual transformation to resize the screen visually as per our requirement.

Move the cursor a per the narration Move the cursor over a small red square handle at the bottom right of the source bounding box.
Click and drag the mouse as per the narration >> release mouse button Click and drag the mouse diagonally towards the left side and release the mouse button.

This will resize the screen keeping the original height and width proportions.

Press CTRL Z Press CTRL Z to undo the changes.
Point to the side handles for height and then for width We can also change only the height or width by resizing using the side square handles.
Only narration Next, let us learn how to crop the screen in OBS.
Slide: Crop
  • Crop option removes unwanted portions of a video to create focus on the composition
  • We can crop an image from either left, right, top or bottom.
Press and hold the Alt key To crop, press and hold the Alt key on the keyboard.
Move the cursor a per the narration

Click and drag the mouse as per the narration

Move the cursor over the small red square at the left side of the source bounding box.

Click and drag the mouse towards the right side.

Point towards green color

Notice at the left, the bounding box turns green in color.

Which means the cropped side of the bounding box is in green color.

Release the mouse button + Alt key Now release the mouse button and the Alt key.

This is how we crop the screen and remove unnecessary footage.

Press CTRL Z Press CTRL Z to undo the changes.
On OBS >> click X icon Let’s now close the OBS interface by clicking on the X icon.
Only narration This brings us to the end of this tutorial.

Let us summarize.

Slide: Summary In this tutorial, we learnt about the OBS work area.

We will also learnt to* Use Edit menu

  • Take Screenshots
  • Use Filters in OBS
  • Use Transform options and
  • Cropping
Slide: Assignment As an assignment
  • Scale the Preview screen to the maximum size.
  • Navigate the screen using Spacebar
  • Apply the color correction filter
  • Adjust the settings and observe the difference in the color
  • Transform the screen to Rotation 180
Slide: About Spoken Tutorial Project
  • The video at the following link summarises the Spoken Tutorial project.
  • Please download and watch it.
Slide: Spoken tutorial workshops
  • We conduct workshops using spoken tutorials and give certificates.
  • For more details, please contact us.
Slide: Answers for THIS Spoken Tutorial Pls post your timed queries in this forum.
Slide: Acknowledgement Spoken Tutorial project is funded by the Ministry of Education (MoE), Govt. of India
This is Arvind Pillai along with Nikita Misal from IIT Bombay signing off.

Thank you for joining.

Contributors and Content Editors

Arvindpillai90, Nancyvarkey, PoojaMoolya

Retrieved from "https://script.spoken-tutorial.org/index.php?title=OBS-Studio/C2/Getting-familiar-with-OBS/English&oldid=55656"