How to create screen video capture like on Laracasts with OBS Studio ?

Level 31

Basically, OBS captures everything what you want with ease. Can you give screenshots of what you're trying to capture and what resuolt you have?

1 like

Level 20

You can adjust the areas that OBS captures.. add overlays and all sorts... get it to record an entire screen or a single window.

You could fullscreen the app/browser and use OBS to record that (can still base it on window) if you wanted it fullscreen so not to capture OBS etc itself.

Here's an example of one of my OBS scenes that would capture ACC (couldn't add an image to the post, so had to be a link) https://cloud.digiserv.net/s/AbGsjFoCH5bErJZ

Run the app you want to capture, and once you select the capture specific window option, you should be able to select the window name of the app/browser that you want.

If it is a browser, there's a browser capture option too IIRC.. you can pick it from the sources list of items to capture.

1 like

martinbean

Level 80

@vincent15000 I just used QuickTime to record my screen when making video tutorials.

1 like

Level 63

I add some information to my post : when I say that there is a blank on the video, blank in place of the application and status bar, that mean that the fullscreen is in reality fullscreen minus the application and status bar. That's why I have blank borders in the video.

Level 63

The problem is while taking the capture, because the windows doesn't occupy all the space (a part of the space is occupied by the status bar and it is impossible to grow the window so that it occupies this status bar space too).

And also after the capture, because the unoccupied space is not captures.

For example : 1024 pixels height minus 24 pixels for the status bar.

Level 20

Can you not fullscreen the browser, Vincent? This should remove the statusbar from being part of the equation? (I'm on a windows box, but have recorded games that use fullscreen without there being any borders/space where the statusbar would be.. not sure what OS you're on?)

1 like

https://www.youtube.com/watch?v=03ZUhA8xNcM

Level 20

Here's an example I've just done recording this page in Firefox for example:

I have hotkeys setup for start/stop recording/streaming in OBS.. and both OBS and Firefox were running on the same monitor.

Here's a screenshot of the quick setup in OBS I used for the above example video:

https://cloud.digiserv.net/s/epnMxd6AEyqKgEG

In short, the process was:

OBS - Define a window capture as the source, and specify Firefox (for my example)
Fullscreen my browser (F11)
OBS start recording hotkey
Do whatever in the browser
OBS stop recording hotkey

The hotkeys aren't required as if you select a window source, it won't matter if OBS is on top of that window or not.. I did this a long time ago to make life easier for streaming videos mostly.

1 like

Level 63

@ian_h Oh interesting idea to not fullscreen the browser ... hmmm ... I just tried it, the video capture shows a black outline (capture 1980 x 1024, browser smaller).

Perhaps I missed some configuration ?

Level 63

@ian_h But in your video capture, I see the application bar on the left ... so you capture the entire screen and not just a window.

Level 20

Sorry mate, maybe I mis-worded my previous reply. You want to put the browser into fullscreen mode and then select just the browser window in the OBS source.. this will prevent other windows etc from overlaying the browse, regardless of whatever you happen to see/have visible on your screen.

If you're still struggling by this evening.. I'll try and record another video from start to finish of what I'm selecting in OBS and what I'm doing with the browser window 🙂

1 like

Level 20

Ahhh that's not the application bar, I use vertical tabs in Firefox (the icons displayed on the left).. so the only thing you see in the video is Firefox itself.

1 like

Level 63

@ian_h

Ok so it's only Firefox ... hmmm ... that's fine and very interesting.

I'm interested in knowing the whole configuration you are using on OBS ;).

1 like