This is a very early and experimental draft – but I like sharing our work in progress to show what we’re working on. This interface shows a simple, manual UI for annotating image spans (both rectangular and free-form polygon shapes). I ended up writing the whole thing from scratch, so it’s still a bit rough.
To illustrate the span annotations the interface is producing behind the scenes, I’ve added a box underneath the image. This is obviously just for demo purposes and won’t be present in Prodigy. All spans are
[x, y] coordinates in pixels, relative to the original image size (even if the image is resized in the browser). The annotated data is fully compatible with Prodigy’s regular
Click here to open the demo in a new window.
Current features in the draft:
- Shapes can be drawn by clicking on the image. The bounding box / line is shown on mouseover, so the user doesn’t have to drag.
- Polygon shapes can be closed by a double click, or by clicking on any other line point.
- Shapes can be selected by click – for example, to delete them.
ESC “exits” the current shape in polygon mode.
Not implemented yet:
- Keyboard shortcuts for the shapes (R for rect, something else for polygon).
- Changing the label of a selected span.
- One-click label button option instead of dropdown and better auto-focusing.
- “Select all” or “Clear all” option.
- Solution for overlapping shapes.
- Various small UI fixes, e.g. preventing user from adding “null” shapes.