image

Photo Re-Enactor

Overlay a reference photo on the live camera and use composition guidance plus four view modes to retake a scene from a similar composition.

View on GitHub

Local processing

About your filesFiles and content selected in this tool are processed in your browser and are not uploaded to a Browser Kitty backend.

Operation demo See the basic workflow in a short video.

About this tool

Photo Re-Enactor is a browser tool for retaking an old or Before photo from a composition that is as close as practical to the original. Load a JPEG, PNG, or WebP reference, place it over the live camera, and switch among Ghost, Outline, Blink, and Split while lining up the scene.

The app compares the reference with downscaled camera frames locally and suggests one major horizontal, vertical, distance, or tilt adjustment at a time. If automatic guidance is unsuitable, you can manually move, zoom, or rotate the reference, then compare Before and After and export a JPEG or standalone comparison HTML.

Good for

Retake an old family or travel photo years later from a similar position and composition
Capture before/after photos of a building, garden, room, or equipment in a layout that is easier to compare later
Approximate an earlier viewpoint with only a phone instead of setting up a precise fixed camera rig
Review Before and After with Split or Ghost immediately after shooting and save a comparison image or HTML

What it can do

Key capabilities available in this tool.

Overlay a JPEG, PNG, or WebP reference photo on the live camera to help recreate a previous composition
Switch among four overlay modes: Ghost, Outline, Blink, and Split
Estimate the largest horizontal, vertical, distance, or tilt mismatch locally and show one plain-language adjustment at a time
Manually drag, zoom, or rotate the reference when automatic guidance is not suitable for the scene
Use an OFF, 3, 5, or 10 second shooting timer without blocking capture when the match score is low
Compare Before and After with Split, Ghost, or Blink after capture, including a directly draggable Split divider
Save the captured JPEG, a side-by-side comparison JPEG, or a standalone comparison HTML with both images embedded
Process photos, camera frames, composition analysis, and export inside the browser without runtime external connections

How to use

Choose the reference photo. JPEG, PNG, and WebP are supported, and camera permission is not requested yet.
Review the reference and start shooting, granting camera permission only when the browser asks for it.
Choose Ghost, Outline, Blink, or Split and move the camera according to the composition guide when guidance is available.
If the reference itself needs adjustment, enable manual adjustment and drag, zoom, or rotate it into position.
Optionally choose a 3, 5, or 10 second timer, then capture. A low match score does not prevent shooting.
After capture, switch among Split, Ghost, and Blink, and drag the Split divider directly on the image when useful.
Save the captured JPEG, side-by-side comparison JPEG, or standalone comparison HTML with the Before and After images embedded.

Supported

Reference images: JPEG, PNG, and WebP.
Overlay modes: Ghost, Outline, Blink, and Split.
Composition guide: locally estimates horizontal, vertical, distance, and tilt offsets; manual adjustment supports move, zoom, and rotation.
Shooting timer: OFF, 3, 5, or 10 seconds.
Exports: captured JPEG, side-by-side comparison JPEG, and a standalone comparison HTML with Before and After embedded; the HTML also supports Split/Ghost/Blink and individual image downloads.
Camera: HTTPS or localhost is recommended. Available cameras, resolution, Wake Lock, and vibration feedback depend on the browser and device.

Limitations and notes

Automatic composition guidance is an aid and may be unavailable in low-detail scenes, darkness, blur, heavily changed scenes, or with large viewpoint differences.
The match score indicates composition similarity rather than photo quality and is never used as a capture gate.
Person-pose matching, person identification, and automatic capture triggered by a composition match are not included.
Some browsers do not allow camera access from a standalone HTML opened through file://. Use HTTPS or localhost for shooting.
The comparison HTML embeds the actual Before and After photos, so sharing that HTML also shares those images.

Frequently asked questions

Are the reference photo or camera frames uploaded to a server?

No. Reference decoding, camera frames, composition guidance, capture, comparison, and export run in the browser. The app does not upload the selected photo or camera feed, and its runtime CSP uses connect-src 'none'.

Can I still shoot when automatic guidance is unreliable?

Yes. Guidance is only an aid and never a capture requirement. You can keep using the overlay views and manually move, zoom, or rotate the reference when automatic comparison is unreliable.

Does it automatically place the camera at exactly the same viewpoint as the old photo?

No. It estimates horizontal, vertical, distance, and tilt differences and suggests what to adjust next, but you still move the camera and decide the final composition. Large viewpoint differences can make guidance unavailable.

Can I share the comparison as a single file?

Yes. Export a standalone comparison HTML with both images embedded. The recipient can open the HTML, switch among Split, Ghost, and Blink, and download the Before or After image individually.

Offline version and source code

The root photo-re-enactor.html is a self-contained HTML file that handles reference loading, composition analysis, capture, comparison, and export without runtime external connections. Camera APIs are still subject to browser security rules, so HTTPS or localhost is recommended for shooting.

View source on GitHub