Agentation を使ってみた

Claude Code で React の UI を作っていると、「このボタン、もう少し右に…」みたいなフィードバックを言葉だけで伝えるのが意外と難しいんですよね。

そんなときに出会ったのが Agentation というツールです。

どんなツール？

UI の要素をクリックしてメモを書くと、CSS セレクタや React コンポーネントのパスをまとめた構造化フィードバックを生成してくれます。それを Claude Code に貼り付けると、エージェントが「どこを直せばいいか」をすぐ把握してくれる、という仕組み。

インストールも簡単で、以下のコマンドを実行してルートコンポーネントに追加するだけで使えます。

npm install agentation -D

使ってみて良かったところ

UI がシンプルで迷わない。ホバーすると要素名がハイライトされて、クリックしてメモを書くだけ。直感的で余計な操作がありません。