Source · Upload Image
Accepted formats: PNG, JPEG, WEBP, BMP. The image is read locally via FileReader — nothing leaves the browser.
or drag & drop an image here
Source · Capture From Camera
Uses getUserMedia(). Capture a still photo, or record a short clip and pull a frame from it.
Preview · Selected Source Image
This is the image that will be converted. Choose a working resolution — smaller grids convert to fewer bits and animate/scan far more reliably.
The downscaled canvas is the exact pixel grid that gets flattened to binary. Every pixel = 3 bytes (R,G,B) = 24 bits.
Convert · Image → Binary Stream
Extracts RGB from every pixel of the downscaled image and flattens it into one continuous binary string, then packages it into optical frames.
Binary Viewer
Raw flattened bitstream (1 = white pixel-bit, 0 = black pixel-bit). Truncated in the DOM for performance; full stream is held in memory.
Optical Visualizer · Live Animation
Dynamic Optical Bit-Matrix Protocol. Select matrix grid density to scale frame capacity (16×16 = 256 bits, 24×24 = 576 bits, 32×32 = 1024 bits, 48×48 = 2304 bits). Higher grid density processes up to 11.8× more data per frame at once! 1 → white square, 0 → black square.
Scan Mode
Point a camera at the Optical Matrix above (on this device, or another device/tab showing the same animation) to capture frames and read the binary back out. No second device handy? Use Local Loopback to feed the animator's frames directly into the decoder and verify the full pipeline in one tab.
low contrast / not aligned
Already filmed the animation with your phone's camera app, or have a saved .webm/.mp4 clip of the Optical Matrix? Load it here — it will play back and decode automatically, looping a few extra times to pick up any frames it missed the first pass.
or drag & drop a recorded clip here
Decoder
Reassembles frame index + payload bits back into RGB triplets, then pixels, then a full image.
Reconstruction Preview
Side-by-side comparison of the original working image and the image rebuilt purely from decoded bits.
Export Decoded Data
Turns the scan into real files on disk: a viewable PNG, and a raw .bin file holding the decoded binary stream itself (header + packed RGB bytes) — the actual "convert the scanned video into a binary file" step.
Regenerate Image From a .bin File
The other half of the loop: load a .bin file that this page exported earlier (from any previous scan) and rebuild the image straight from it — no camera, no re-scanning, no video needed.
or drag & drop it here
Internal Device Storage · Auto-Saved Decoded Files
Every video scan or decoded stream is automatically saved into your device's internal storage (IndexedDB) and triggered for download into your local Downloads folder — persisting safely across browser restarts and offline sessions.