Video Recorder

Overview

In the Oooh app, we've got a video recorder with a bunch of different features - including layouts and different recording modes. Your module can take advantage of all of the features of the Oooh video recorder by configuring it with stickers, layouts, media assets and more! This makes it easy to create fun recording moments after games or throw in a conversation starter with a sticker.

How it works

The Oooh video recorder can be run after your module. You can run the video recorder after your module by providing ModuleResults.recordingViewOptions when completing the module.

Implementation

You can run the video recorder after your module by providing ModuleResults.recordingViewOptions when completing the module with Runtime.completeModule().

You can configure and customise the Oooh video recorder using VideoRecordingLayoutOptions.

🚧

Common gotchas

• When you're running the video recorder after your module, make sure you're not outputting a video asset that has the same name as the feed video in your manifest

Examples

Coming soon! 🚧

Stickers

Stickers are a great way to give players inspiration for their video recording, whether it's a score, leaderboard, their game character or a quick conversation starter. You can create stickers by adding an array of StickerConfig objects to VideoRecordingLayoutOptions.inputStickers when configuring the video recorder.

Under the hood, each sticker image is an ImageAsset created by your module. Image assets can be created from static image files saved with your module using AssetManager.getImageFromPath(), or you can generate an image off-screen using a HTML5 <canvas> and pass the data URL to AssetManager.createImageFromDataUri().

ℹ️

Did you know?

We support GIFs! You can use animated GIF or WEBP files for creating stickers in the Oooh video recorder.

• For saved animated images, we recommend using optimised WEBP files to keep file sizes low and loading times fast
• For generated animated images, we recommend using a library like gif.js.optimized that uses web workers to avoid GIF generation lagging your module

Best practices

• Sticker resolution: stickers should be at least two times the size they will show on the screen, otherwise they will appear fuzzy when scaled
• Fill the screen: Players can choose to either customise their recording moment and move the stickers, or post with the default positions you set - so empty space should be avoided
• Use human-readable keys: The keys of importable asset collections are shown as the asset names in the video recorder
• Trim empty space: Only leave a few empty pixels of padding around the edges of sticker images, too much empty space makes stickers hard to control