§ A workbench for specifying UI against live APIs

API Sketch.

Drop a screen. Drop a Postman collection. Draw boxes on the screen and tie each one to a field in the API response. Share a random URL with your team - anyone with the link can edit and comment. Export the mapping as a single file; re-resolve it against a future version of your collection without redrawing a thing.

01 / Screens

Drop any screenshot.

PNG, JPG, whatever. Drop it in and start annotating right away.

02 / Collection

Bring the API.

Upload a Postman collection. Every saved example response becomes a clickable field tree.

03 / Mapping

Draw and bind.

Each box gets a serial like A-01, a JSON path, and a thread. The mapping survives collection upgrades.

Made with ❤️ by Unravel.tech
§ Getting started

A blank sketch.

Add a screenshot from the left sidebar to begin. Then draw boxes on the image and bind each one to a field in your API response.

  1. Drop a screenshot — it uploads to R2 and stores only the key.
  2. Drop a Postman collection — examples become a field tree.
  3. Drag on the image to draw a box, click a field to bind it.
idle
↑↓ navigate select esc close