Skip to content

Promote to production: Video Recorder effects (filters, bg blur/replace, green screen) - #392

Merged
slaveofcode merged 2 commits into
mainfrom
develop
Sep 11, 2026
Merged

Promote to production: Video Recorder effects (filters, bg blur/replace, green screen)#392
slaveofcode merged 2 commits into
mainfrom
develop

Conversation

@slaveofcode

Copy link
Copy Markdown
Owner

Promotes PR #391. Canvas-composited effects: colour filters, background blur/replace (MediaPipe selfie segmenter), green screen. CI green on develop. NOTE: background blur/replace need selfie_segmenter.tflite uploaded to R2 (npm run sync:r2:prod) — they degrade gracefully until then; filters + green screen need no model.

…en screen

Phase 2 of the Video Recorder: switch recording to a canvas-composited
pipeline (record the effects canvas + camera audio) and add effects that
bake into the file:
- colour filters (grayscale/sepia/vivid/cool/warm/invert)
- background blur and background replace (colour or image) via an
  on-device MediaPipe selfie segmenter (VIDEO mode, per-frame)
- real green-screen chroma key (adjustable key colour + tolerance)

Pure, unit-tested video-effects.lib (filter presets, hex parse, chroma
key). Stages the selfie-segmenter model (stage-models.mjs); it is served
same-origin from /models like the face model. E2E records through the
filter path with the fake camera. EN + ID SEO updated.

NOTE: production serves /models from R2 — run `npm run sync:r2:prod`
(with Cloudflare auth) to upload selfie_segmenter.tflite, or the
background-blur/replace effects 404 the model in prod (filters and green
screen need no model).
feat(video-recorder): effects — filters, background blur/replace, green screen
@slaveofcode
slaveofcode merged commit 4a6dd56 into main Sep 11, 2026
4 of 5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant