Recording Videos

Using The Recorder

You can record your presentation using the <Recorder> component:

<script>
	import { Recorder } from '@animotion/core'
</script>

<Recorder />
  • After you import the <Recorder> component you’re going to be asked to give permission to share your screen, and microphone
  • Select the window, or screen you want to record, and press F11 to fullscreen your browser and start recording

Default Settings

The default settings give you a nice balance of quality, and file size but you can use the YouTube recommended upload encoding settings to change it.

⚠️ Before you start recording do a test recording to make sure everything is working properly, and adjust the settings accordingly.

These are the default video settings:

<script>
	import { Recorder } from '@animotion/core'
</script>

<Recorder
	codec="video/mp4"
	fps={60}
	videoBitrate={2500}
	audioBitrate={320}
	systemAudio={true}
	useTimer={true}
	useMicrophone={true}
/>
  • MP4 container (VP9 video codec, Opus audio codec)
  • 60 FPS
  • 2,5 mbps (2500 kbps) video bitrate
  • 320 kbps audio bitrate
  • Captures system audio
  • Timer enabled
  • Microphone enabled

You Can Change The Video Type

You can change the video container, and codecs like in this example which uses the AVC (H.264) video codec, and AAC for the audio codec:

<script>
	import { Recorder } from '@animotion/core'
</script>

<Recorder codec="video/mp4;codecs='avc1.4d002a,mp4a.40.2'" />

For available options you can read the Web video codec guide for the video codec options, and Web audio codec guide for the audio codec options.