Local image geometry · 2026 · Solo — popularity-led research, test-first image segmentation, interaction design, accessibility hardening, exact-SHA production verification
Sketchshift
A local-first capture bench that finds strong ink regions, hands every guess back for correction, and exports a standalone HTML and SVG diagram.
The problem
Paper and whiteboard process sketches are fast to make but awkward to revise, share accessibly, or carry into documentation. Sketchshift accepts a real PNG, JPEG, WebP, or camera frame; reads its pixels only in the browser; detects bounded connected ink regions; and lets the user rename, add, remove, drag, or keyboard-move the resulting blocks before downloading a standalone HTML and SVG diagram. No account, backend, analytics, cloud storage, or third-party runtime request is involved. GitHub deployment 5918027502 completed successfully from exact private-repository SHA 8686c8fd8211d3d04001a3ba07f3cdf120a08b38, followed by a production golden path across desktop, mobile reduced-motion, short-height, and JavaScript-disabled modes. The idea came from secure 2026-08-14 Star Radar run 20260814T214613-0700-github-star-radar-678cc42f: daily rank #1 cathrynlavery/diagram-design gained 3,646 stars that day and had 17,461 total stars. Sketchshift translates demand for deliberate portable diagrams into an original physical-sketch capture workflow without using the source repository's code, templates, brand, assets, or diagram grammar.
Architecture
Key decisions
Keep pixels on the device
Raster decoding, grayscale conversion, segmentation, correction, and export happen in the browser. Exact dependency pins, local fonts, strict headers, and a no-third-party-request browser gate make the privacy boundary inspectable.
Return automated guesses to the user
Connected components provide a fast starting point rather than pretending to understand the sketch. Every bounded region remains visible and editable through pointer and keyboard controls before export.
Export a durable accessible artifact
The result is standalone semantic HTML with an accessible SVG and a hidden ordered text representation of step relationships, not a screenshot trapped inside the app.
Close focus races with lifecycle state
A CI-only mobile race showed that requestAnimationFrame could focus a trigger while it was still inert. A repeated failing browser test drove focus restoration into the post-dialog React effect; 24 repeated mobile checks and the exact-SHA CI run then passed.