Own Product • Shipped Software Browser-Side Video Rendering

Video Studio

A promo video editor that renders the MP4 in your browser.

Sample made in Video Studio Video Studio

Project Overview

A slide-based promo video editor for small businesses, apps and websites. You pick a template or start blank, add text, icons, numbers and your logo, drop a screen recording into a ready-made laptop or tablet scene, and export a 1080p MP4 for Reels, Shorts, TikTok, YouTube or LinkedIn. The video is rendered frame by frame on the visitor's own computer, so recordings and images are never uploaded and no account is needed. Editing is free; the download is paid per video, by pack, or with a code. It grew out of Video Factory's editor, rebuilt for people instead of a pipeline.

What Was Built

  • Browser-side MP4 export: WebCodecs H.264 + AAC, muxed with mediabunny; a 21-second 1080p video encodes in about 8 seconds
  • One pure render function for preview and export, so what you see is frame for frame what you download
  • Device scenes: the screen recording is warped into the photo's four screen corners with a per-pixel homography in WebGL, decoded frame-exactly for export
  • Ten templates in portrait and landscape, palette colours and a logo slot, plus animated icons, counters and progress rings
  • Pay-per-export with no accounts: PayPal orders, signed export tokens, download codes, export packs and an emailed free trial, all checked server-side
  • Editor craft: undo/redo, layers, several local projects, media stored in IndexedDB, and an automated check suite of ~450 editor checks run under the production security policy

Stack

The precision software, design libraries, and preflight standards deployed for this engagement:

React 18 TypeScript Vite Tailwind CSS v4 WebCodecs mediabunny WebGL IndexedDB Firebase Functions Firestore PayPal Resend Cloudflare Turnstile

Need similar results for your business?

Available for select print production, brand systems, and software engineering projects.

Request Consultation