AI-Powered Video Recording

How It Works

AI Kit's video package provides a complete recording pipeline that handles screen capture, camera recording, and audio processing through a unified API. The ScreenRecorder uses the MediaStream API to capture your display at configurable resolution and bitrate, while CameraRecorder provides webcam access with auto-exposure and white balance. The PiPCompositor combines both feeds into a single output, placing the camera feed as an overlay in any corner of the screen recording.

Audio processing runs through the NoiseProcessor, which applies real-time echo cancellation, noise suppression, and auto-gain control using the Web Audio API. Once recording is complete, the Transcription module sends the audio to OpenAI Whisper for AI-powered transcription with word-level timestamps. The TextFormatter post-processes the transcript to remove filler words, fix punctuation, and normalize capitalization. The HighlightDetector identifies key moments in the transcript for automatic chapter generation. All components emit instrumented events for analytics integration.

Use Cases

• Developer tutorials with screen + webcam PiP recording and auto-generated subtitles from Whisper transcription.
• Customer support recordings with noise-reduced audio and searchable transcripts for quality review.
• Meeting documentation with automatic speaker detection, timestamped notes, and highlight extraction.
• Async video messaging with camera recording, real-time audio denoising, and instant text transcription.

Integration Guide

Record your screen and transcribe with AI in a few lines:

import { ScreenRecorder, transcribeAudio } from '@ainative/ai-kit-video';

const recorder = new ScreenRecorder({
  resolution: { width: 1920, height: 1080 },
  frameRate: 30,
  audioBitrate: 128000,
  noiseReduction: true,
});

// Start recording
await recorder.start();

// Stop and get the recording
const blob = await recorder.stop();

// Transcribe with AI
const transcript = await transcribeAudio(blob, {
  model: 'whisper-1',
  language: 'en',
  timestamps: 'word',
});

console.log(transcript.segments);
// [{ text: "Hello world", start: 0.0, end: 1.2 }, ...]