Agentation: visual UI annotations for AI coding agents

Agentation launched on Product Hunt on March 27, 2026 and reached the #1 daily product with 437 upvotes. It addresses a specific friction point in designer-to-developer handoff when AI coding agents are involved: AI agents have no way to understand what a designer means when they point at something on a screen.

The tool works as a click-to-annotate layer on web interfaces. A user clicks any UI element, adds a note describing what should change or why it’s problematic, and the tool captures both the annotation text and the CSS selector that precisely identifies the element. The structured output can be pasted directly into Claude Code, Codex, or any other AI coding agent as context.

The workflow requires no complex integration. It is a standalone annotation layer, not a plugin inside Figma or a browser extension with a large setup footprint. The output format is designed to be read by AI agents rather than humans — it includes the element identifier alongside the natural-language annotation, giving the agent the specificity it needs to act on the right part of the interface.

This matters because a recurring problem with AI-assisted front-end work is that feedback like “make this button larger” or “this spacing looks off” lacks the element context an agent needs to make the right change. Agentation bridges the gap between a designer’s visual observation and the precise, structured context an agent requires to act on it.

The tool sits at the intersection of design review and AI-assisted development, making it relevant to designers who are already working alongside engineers using AI coding tools, or who want to communicate UI feedback more precisely to agents handling implementation tasks.