agent-ready-ui Build Log

agent-ready-ui Build Log

Why this exists

The trend scan pointed at two signals: browser and GUI agents are becoming a normal way to operate web software, and skills are becoming a clean distribution format for repeatable agent workflows. alibaba/page-agent showed up on GitHub Trending as an in-page GUI agent, while the anthropics/skills ecosystem keeps normalizing small, file-based instructions that improve existing coding agents.

The failure mode is mundane but expensive: a web page can look obvious to a human and still be unreliable for an agent. Icon-only controls lack accessible names. Duplicate buttons share the same label. Placeholder-only inputs cannot be proven after typing. Loading states appear clickable before the flow is settled. Agents then fall back to brittle CSS selectors, child indexes, coordinates, or arbitrary sleeps.

agent-ready-ui focuses on that one problem: make the controlled UI surface operable by browser agents without turning the project into a new framework or test rewrite.

What shipped

• A public template repository: https://github.com/dvnc-labs/agent-ready-ui.
• A single-purpose SKILL.md for Claude Code and Codex.
• A README with install commands for both .claude/skills and .agents/skills.
• A demo GIF and 1280x640 OG image asset committed under assets/.
• A GitHub release: v0.1.0.

The skill asks an agent to build an action map for the target flow before editing. Each action gets a preferred locator, required state, and success signal. Only then does the agent patch labels, roles, scoped names, state semantics, and existing test-id conventions where accessible locators are not enough.

Build notes

The release was scaffolded from omidsaffari/skill-starter and filled only in the starter-approved surface: SKILL.md, README.md, CHANGELOG.md, and assets. The first GitHub clone arrived empty because the template population finished after the repository was created; the scratch clone was recovered by fetching the starter commit, then the release commit was rebased onto the delayed remote initial commit before pushing.

Local hard gates passed: valid SKILL.md frontmatter, no starter placeholders, README and LICENSE present, assets/demo.gif present, and assets/og.png verified at 1280x640 under 1 MB. GitHub Actions passed on the release commit. The markdownlint step remains non-blocking in the starter and only reports the starter's own AGENTS.md inline placeholder.

No runtime service, model key, proxy, app deploy, or background worker is required. The artifact is just a forkable skill.

How to use it

Install for Claude Code:

git clone https://github.com/dvnc-labs/agent-ready-ui ~/.claude/skills/agent-ready-ui

Install for Codex:

git clone https://github.com/dvnc-labs/agent-ready-ui ~/.agents/skills/agent-ready-ui

Then ask it to make a named page or flow agent-ready. A good first prompt is:

Use agent-ready-ui on the checkout flow so a browser agent can add a card,
submit payment, and confirm the receipt without brittle selectors.

The expected output is practical: target surface, files changed, before/after locator examples, verification commands, and any remaining browser-agent risks.