Agentation

Dev Tools

Free

AI 에이전트를 위한 시각적 UI 피드백 도구.

https://github.com/benjitaylor/agentation ↗2026-04-05 기준

플랫폼

Web

가격

오픈소스, 완전 무료.

장점

+"파란 버튼 왼쪽에 있는 거" 대신 정확한 CSS 셀렉터를 에이전트에 전달
+클릭, 텍스트 선택, 영역 선택 등 다양한 어노테이션 방식
+Agent Skill로도 제공 — Claude Code에서 /agentation으로 바로 호출 가능

단점

−아직 초기 단계 프로젝트
−브라우저에서 페이지에 직접 주입하는 방식이라 환경에 따라 구성 필요

무엇인가

Agentation은 AI 에이전트에게 UI 피드백을 줄 때 생기는 모호함을 해결하는 도구다. 페이지에서 요소를 클릭하면 그 요소의 CSS 셀렉터, 위치, 계층 구조를 자동으로 추출해 구조화된 텍스트로 출력한다. 에이전트는 이 텍스트를 받아 코드베이스에서 정확히 어떤 부분을 수정해야 하는지 바로 파악할 수 있다.

주요 기능

• 클릭 어노테이션 — 요소 클릭 시 셀렉터·위치 자동 추출 • 텍스트·영역 선택 — 드래그나 영역 지정으로 범위 피드백 • 멀티 선택 — 여러 요소를 한 번에 선택해 일괄 전달 • 애니메이션 일시정지 — 동적 UI 검사 시 유용 • Agent Skill 제공 — Claude Code에서 /agentation으로 호출

이런 사람에게 유용

Claude Code나 Cursor로 프론트엔드 작업을 할 때 에이전트가 엉뚱한 요소를 수정하는 문제를 줄이고 싶은 경우. 복잡한 컴포넌트 트리에서 "이 요소"를 정확하게 짚어 전달하고 싶을 때 유용하다.