Work / Plate 06 of 06
Add audio to video
A converter people use once should show what it is about to do before they press the button: the files on one timeline, the length of the result, and nothing leaving the machine.
- Year
- 2026
- Status
- Own product
- Brief
- Free browser tool that adds an audio track to a video, or turns an image and audio into a video
- Medium
- Static HTML, CSS and vanilla JS, ffmpeg.wasm 0.12 (single thread)
- Mobile speed
- Lighthouse 100, 75 KB
- Shown at
- add-audio-to-video.fixmap-site.workers.dev/
- Palette
#E5E8E4#14181A#066B50
Open the live product Live product, launched 6 October 2026.
Plate 06. Add audio to video, first screen at 1440 pixelsWall painted in the work's own #E5E8E4
What was built
Product decision and sign-off: Angel. Design, build, tests and deployment: AI-agent pipeline, using the premium-web skill for the interface.
The opposite bet to the concept pieces: a small utility built in about one agent-day to test whether a free tool funded by donations can earn anything. It launched on 6 October 2026, so there is no traffic or revenue to report.
- A single-page tool that adds an audio track to a video, or combines an image and an audio file into a video, as MP4 or WebM
- ffmpeg.wasm running in the browser, so files are never uploaded; no watermark, no signup, no ads
- A timeline of lanes: the dropped video or image, the audio waveform drawn from the file itself, and the output length, with volume, trim and loop shown on the drawing
- The wasm core split in two files and rejoined in the browser, because Cloudflare static assets cap a single file at 25 MiB
- A pay-what-you-want donation link through Polar, a FAQ with structured data for search, and cookieless PostHog analytics
- Deployed as a Cloudflare Worker with static assets; end-to-end tests in tests/e2e.mjs (6 of 6 passed)
Stack Static HTML, CSS and vanilla JS, ffmpeg.wasm 0.12 (single thread), Cloudflare Worker with static assets, Polar, PostHog
Decisions, with the reasons.
Approach
Files stay on the device
The converter is ffmpeg compiled to WebAssembly and runs in the visitor's browser tab, so no file is uploaded anywhere. That removes the server cost of video processing and answers the first question a visitor asks. The cost is a roughly 30 MB converter that downloads on the first run, and one CPU thread, so WebM and re-encoded video are slow.
Rejectedserver-side conversion. It would need storage, a queue and a privacy policy, and would break the no-upload claim.
Approach
The interface shows the result before it is made
A normal converter shows two file names and a dropdown, and you learn the output length only after converting. Here the dropped video and audio sit as lanes on one shared time ruler, the waveform comes from the dropped file, and the output length and any clipping appear after the second drop. Nothing on the timeline is sample data; if the audio cannot be decoded, the lane says so instead of drawing a fake wave.
Interaction
A real conversion, start to finish
The frames show the live tool after dropping two small test clips (a 3-second test-pattern video and a 3-second tone) and clicking Create video, on a phone: the loaded timeline, then the finished file with the Download button. The output length matches the audio, and the 6 end-to-end tests check the downloaded files with ffprobe.
Approach
Donations, not ads or a paywall
The only money path is a Support link to a Polar checkout, with no limit on the free tool. The checkout page renders, but no stranger has paid through it yet, so whether people give is the open question the tool exists to test.
How it was started Designed with the premium-web skill in app mode: the generic converter template (two dashed boxes, a radio list, one button) was named up front and the lane timeline was chosen to avoid it. The skill's calibrated critic did not pass the empty and result screens after four rounds; that is recorded in the project notes, not hidden.
Figures, captured live.
Screenshots I took from the running preview at 1440 and 390 pixels wide. They are not mock-ups.
Measured, not claimed.
- Largest contentful paint
- 1.3 s
- Layout shift
- 0
- Blocking time
- 0 ms
- Page weight
- 75 KB
- Fonts
- Font inlined in the HTML (data URI) 22 KB
Font inlined in the HTML (data URI) 33 KB
Lighthouse 12.8.2, simulated mobile, one run against add-audio-to-video.fixmap-site.workers.dev/ on 2026-10-06. Lab data, not field data. Re-run before quoting these elsewhere.
Honest limits.
- Launched 2026-10-06. No traffic, usage or revenue figures exist yet, so none are claimed.
- Not open source. Only the live page is public.
- Donations are untested end to end: the Polar checkout renders, but no real payment has been made by a stranger.
- Large files are a guess: a warning at 500 MB and a block at 2 GB were not measured, and no large conversion was run. Safari, Firefox and real phones were not tested.
- The converter build includes GPL components (x264), so licensing has to be checked before any commercial use.
- Screenshots use small test clips from the repository's fixtures, not real user files.
Next plate
Halcyon OneLaunch page for a fictional generative-audio instrument
Want a redesign demo of your own site?
Free and private. You only pay if you want the full build.
Try the Redesign Lab- RequestYour site and consent
- AuditBy email, straight away
- Private demoAbout five days
- Optional buildOnly on payment
- Case studyOnly with your yes