agentation

Visual UI annotation tool for AI agents. Drop the React toolbar into any app — humans click elements and leave feedback, agents receive structured CSS selectors, bounding boxes, and React component trees to find exact code. Supports MCP watch-loop, platform-specific hooks (Claude Code / Codex / Gemini CLI / OpenCode), webhook delivery, and autonomous self-driving critique with agent-browser.

1.52x

Quality

63%

Does it follow best practices?

Impact

96%

1.52x

Average score across 3 eval scenarios

Securityby

Advisory

Suggest reviewing before use

Optimize this skill with Tessl

npx tessl skill review --optimize ./.agent-skills/agentation/SKILL.md

Quality

Discovery

50%

Based on the skill's description, can an agent find and select it at the right time? Clear, specific descriptions lead to better discovery.

The description excels at technical specificity and carves out a distinctive niche for AI-assisted UI annotation workflows. However, it critically lacks any 'Use when...' guidance, making it difficult for Claude to know when to select this skill. The language is heavily technical/jargon-laden, which may not match how users naturally request this functionality.

Suggestions

Add an explicit 'Use when...' clause with trigger scenarios, e.g., 'Use when the user needs to annotate UI elements, collect visual feedback, or help AI agents locate specific components in a web application.'

Include more natural user-facing trigger terms alongside technical ones, such as 'visual feedback', 'element selection', 'UI debugging', or 'component identification'.

Consider adding common task-based triggers like 'when reviewing UI changes', 'when debugging element positioning', or 'when agents need to interact with specific UI components'.

Dimension	Reasoning	Score
Specificity	Lists multiple specific concrete actions: 'Drop the React toolbar into any app', 'humans click elements and leave feedback', 'agents receive structured CSS selectors, bounding boxes, and React component trees'. Also mentions specific features like MCP watch-loop, platform hooks, webhook delivery, and autonomous critique.	3 / 3
Completeness	Describes WHAT the tool does in detail but completely lacks a 'Use when...' clause or any explicit trigger guidance. There's no indication of when Claude should select this skill over others. Per rubric guidelines, missing explicit trigger guidance caps completeness at 2, and this has none at all.	1 / 3
Trigger Term Quality	Contains some relevant technical terms like 'UI annotation', 'CSS selectors', 'React', 'bounding boxes', but these are developer-centric jargon. Missing natural user phrases like 'annotate UI', 'mark elements', 'visual feedback'. Platform names (Claude Code, Codex, Gemini CLI) are specific but niche.	2 / 3
Distinctiveness Conflict Risk	Highly distinctive niche: 'Visual UI annotation tool for AI agents' with specific technical scope (React toolbar, CSS selectors, bounding boxes, component trees). The combination of AI agent feedback, specific platform hooks, and agent-browser integration creates a clear, unique identity unlikely to conflict with other skills.	3 / 3
	Total	9 / 12 Passed

Implementation

77%

Reviews the quality of instructions and guidance provided to agents. Good implementation is clear, handles edge cases, and produces reliable results.

This is a comprehensive, highly actionable skill with excellent executable examples and clear workflow patterns. The main weakness is verbosity - multiple redundant setup paths are listed inline, and the document would benefit from splitting platform-specific configs and the setup script into separate reference files. The workflow clarity is strong with explicit lifecycle states and validation checkpoints.

Suggestions

Extract the 50-line setup-agentation-mcp.sh script to a separate file and reference it with a one-liner

Consolidate the 5+ different Claude Code setup methods into a single recommended approach with alternatives in a separate SETUP.md

Move platform-specific hook configurations (Section 4 subsections) to a PLATFORMS.md reference file, keeping only the universal npx add-mcp command inline

Dimension	Reasoning	Score
Conciseness	The skill is comprehensive but includes redundant setup options (multiple ways to do the same thing listed sequentially), repeated information across sections, and some explanatory text that could be trimmed. The architecture section and some hook examples are efficient, but overall the document could be 30-40% shorter.	2 / 3
Actionability	Excellent executable examples throughout - complete React component code, bash commands, JSON configs, TypeScript types, and curl commands are all copy-paste ready. The MCP tool table with parameters and the full annotation schema provide concrete, actionable reference.	3 / 3
Workflow Clarity	Clear workflow patterns (Section 6) with explicit sequences: Copy-Paste, MCP Watch Loop, Hook Injection, and Autonomous Self-Driving. The watch loop pattern includes acknowledge→fix→resolve lifecycle with validation. The jeo integration section shows phase guards and pre-flight checks.	3 / 3
Progressive Disclosure	The document is well-structured with numbered sections and tables, but it's monolithic at ~600 lines. Advanced topics like jeo integration, webhook setup, and platform-specific hooks could be split into separate reference files. The inline bash script (setup-agentation-mcp.sh) adds significant bulk that could be externalized.	2 / 3
	Total	10 / 12 Passed

Validation

90%

Warnings & errors only

Checks the skill against the spec for correct structure and formatting. All validation checks must pass before discovery and implementation can be scored.

Validation — 10 / 11 Passed

Validation for skill structure

Criteria	Description	Result
skill_md_line_count	SKILL.md is long (778 lines); consider splitting into references/ and linking	Warning

	Total	10 / 11 Passed

Repository: supercent-io/skills-template
Commit: c033769

Reviewed: 15 days ago

Table of Contents

Discovery Implementation Validation

Is this your skill?

If you maintain this skill, you can claim it as your own. Once claimed, you can manage eval scenarios, bundle related skills, attach documentation or rules, and ensure cross-agent compatibility.