How can you get the best screen captures in Mozilla Hubs on desktop? Maybe you would like to livestream your event, capture a clip of your latest creations to share, or demo a new feature you are working on.
Read on to learn how to dramatically improve your screen captures in Hubs. 🌆
Screen Capture Mode
Use the new screen capture mode feature built by Hubs Community Developers. A small group of developers worked together to contribute this feature specifically to make screen captures more accessible and convenient - yay open source!
You may want to hide UI elements to better frame the content and eliminate distracting chat or debug menus. You can press the B key to conveniently hide all the UI.
If you would like to include the cursor but still hide the UI, you can press the ~ key.
Know Your Preferences
Nametags, auto pixel adjustment, auto-exit, dynamic shadows, high-quality mode, post-processing, movement, resolution....
Understanding the options available to you will be a huge help to getting the best-quality screenshots and recordings. Here are a few to look out for:
Nametags
There are several options for displaying name tags, you can hide them when your camera is in close proximity, completely turn them off or have them on only when the object menus are open.
Auto Exit
Some settings here you will want to check to ensure smooth recordings with multiple cameras or when you're backgrounding a tab.
High Quality Mode / Dynamic Shadows / Post-Processing Effects / Resolution
These are all preferences you will want to consider when recording with your best hardware to get the best looking shots possible.
Movement
You may want to slow your cameras speed down to reduce the motion. Don't forget you can also right-click to teleport to a location.
Using OBS
Open Broadcast Studio is free and open source software for video recording and live streaming. This software is available for mac, windows and linix and allows you to capture different windows, tabs and even control transitions and mix audio. Combine OBS with the above tips to get some high quality production value out of your recorded events.
You can even set up multiple cameras and use OBS scene transitions to toggle between them. You can add elements like overlays, logos, and captions via the sources tab.
The key to recording good audio from a web browser is to experiment with different settings and find what works best for your specific setup and recording environment. It's also important to make sure that the web page you're recording has audio enabled, and that you have the necessary permissions to record it.
Event Best Practices
Let people know you are recording.
Avatars can help communicate to others in the room where your camera feed is coming from. Pasting a message in chat and making an announcement in the room (maybe even one you broadcast with an audio-zone) is also a great practice.
Moderation Tools
Be familiar with the moderation tools. You can hide, kick, mute, and control individual volumes of people in the space with you. Make sure you are aware of all these tools. See 'Hosting Events in Hubs' in the Hubs docs.
Spatial Audio
If recording audio with OBS, be aware of spatial audio and the audio set up. Be cognizant of what camera source/tab you are getting audio from and their proximity to the action.
Feel ready to record your event and get some great-looking screen captures? I hope so! For more Mozilla Hubs updates Creator Labs content, follow us on Twitter, LinkedIn or Discord. Thanks for reading!
Ready to get started with your own hub? Visit https://hubs.mozilla.com/#subscribe today!
