All skills
benjitaylor avatar

/agentation-self-driving

@cff4cef
by Benji Taylorbenjitaylor/agentation4.8k stars
390

Autonomous design critique mode using the Agentation annotation toolbar. Use when the user asks to "critique this page," "add design annotations," "review the UI," "self-driving mode," "auto-annotate," or wants an AI agent to autonomously add design feedback annotations to a web page via the browser. Requires the Agentation toolbar to be installed on the target page and agent-browser skill to be available.

Requires /agentation

Use this Skill: https://skilld.dev/gh/benjitaylor/agentation/agentation-self-driving

This session only. Nothing lands on disk.

referencestwo-session-workflow.md

≈655 tokens on demand. Your agent reads this file only when SKILL.md points to it.

Two-Session Self-Driving Workflow

Full autonomous design review: one agent critiques, another fixes.

Prerequisites

  • Agentation toolbar installed with an endpoint pointing to the same HTTP server as the agent
  • MCP server running and connected (toolbar shows "MCP Connected")
  • agent-browser skill installed

Setup

Terminal 1 — The Critic (this skill)

claude
> /agentation-self-driving

This session opens the headed browser, scans the page, and adds design annotations. The user watches the browser as the agent navigates and critiques.

Terminal 2 — The Fixer

claude
> Watch the intended Agentation session and address incoming feedback until I say stop.

This session blocks on agentation_watch_annotations, receives each annotation as it's created by Terminal 1, and edits the codebase to address the feedback.

Ask the agent to watch only the intended session, read the target code, make the change, run relevant checks and inspect visual results before resolving. Leave failed or unverified work open.

How It Connects

  1. Critic adds annotation → toolbar sends it to its configured HTTP endpoint
  2. Fixer's agentation_watch_annotations unblocks with the new annotation
  3. Fixer reads the annotation (element path, CSS selectors, feedback text)
  4. Fixer greps the codebase using the selectors/component names
  5. Fixer makes changes, verifies the result, then calls agentation_resolve with a summary
  6. Fixer loops back to agentation_watch_annotations

Flow Diagram

Browser (visible)          Terminal 1 (Critic)         Terminal 2 (Fixer)
─────────────────          ───────────────────         ──────────────────
User watches cursor    →   Scrolls, clicks elements   Blocking on watch...
Annotation dialog      →   Fills critique, clicks Add
                           Annotation auto-sends  →   Receives annotation
                                                      Reads code, makes fix
                                                      Resolves annotation
                           Moves to next element  →   Blocking on watch...

Tips

  • Start the Fixer session first so it's ready when annotations arrive
  • The Critic can add annotations faster than the Fixer processes them — that's fine, they queue up
  • If the page hot-reloads from Fixer's changes, the Critic may need to re-expand the toolbar
  • Both sessions share the same MCP server registered with claude mcp add (stored in ~/.claude.json)

Source: SKILL.md on GitHub

2 warnings10d5 checks · Risk SAFE
  • Gen Agent Trust Hub10d

    The skill is functional for design critiques but is susceptible to indirect prompt injection attacks because it processes content from arbitrary external websites.

  • Socket10d

    No alerts

  • Snyk10d

    Risk: MEDIUM · 1 issue

  • Runlayer7mo

    2/2 files flagged

  • ZeroLeaks5mo

    2 findings · Score: 80/100

Signed by skilld at cff4cef. This ties the file your Agent reads to that commit on GitHub. It does not review the instructions.

Last checked against GitHub last week.

Activeupdated 2 weeks ago
What it can do
Runs commands
All 1 allowed tools
Bash(agent-browser:*)
  • agentation
  • design-critique
  • annotations
  • ui-review
  • browser-automation
  • agent-browser
  • web-page-analysis
  • self-driving

README badge

README badge for benjitaylor/agentation/agentation-self-driving

Autonomously critiques a web page by adding design annotations through the Agentation toolbar in a visible headed browser. Requires the Agentation toolbar installed on the target page and the agent-browser skill available to execute mouse movements and form interactions.

Generated from the current SKILL.md.

What does this skill require to run?
The agent-browser skill must be installed first, and the target web page must have the Agentation toolbar already installed. The browser must run in headed (visible) mode so you can watch the agent add annotations in real time.
How does this skill actually create annotations?
It uses coordinate-based mouse events (move, down, up) to trigger the Agentation overlay's annotation dialog, not element clicks. After each interaction, it reads the full snapshot output to locate dialog refs, fills the critique text, and submits via the Add button.
Can I run this headless or in the background?
No. The browser must always be visible and headed — the skill is designed so you can watch the agent scan, hover, and annotate the page like a self-driving car navigating.
What happens if the Agentation toolbar is not installed on the page?
The skill will detect this during preflight checks and stop with an error message. You must install Agentation on the target page first using the agentation skill.
Does this support the two-session MCP workflow?
Yes. If MCP is connected and a second agent runs agentation_watch_annotations, annotations auto-send to the listening agent, enabling fully autonomous design review and code fixes in parallel.

Generated from the current SKILL.md. These answers refresh after source changes.