私はコーディングエージェントにスクリーンショットではなくJSONを与えている
著者はSlimSnapというツールを開発し、スクリーンキャプチャを構造化JSONに変換してAIコーディングエージェントに提供している。スクリーンショットを貼り付けるのに比べ、JSON表現はトークン使用量を37~85%削減し、エージェントが毎回ピクセルを解釈せずに要素を直接参照できる。この記事では、トークン節約、構造的利点、スキル統合、オープンスキーマの重要性について詳述している。
AIコーディングエージェント(Claude Code、Cursor、ChatGPTなど)が画像を直接読み取れる時代にあって、著者はあえて逆方向のアプローチを選んだ。スクリーンショットを構造化JSONに変換してエージェントに与えるSlimSnapというツールを開発したのだ。その理由は、画像表現がプログラミング作業にとってコスト高で情報の損失があるからだ。
トークン効率が第一の利点だ。Claude Sonnetで1枚のスクリーンショットは約1,568トークンを消費するが、SlimSnapのJSONは700トークンで済み、約55%の節約になる。長期的な反復セッションでは差が顕著で、20回のスクリーンショットでSonnetが約31Kトークン消費するのに対し、JSONは14Kで済み、コンテキストウィンドウを有効活用できる。
さらに重要なのは構造化情報の利点だ。スクリーンショットはピクセルの集まりであり、エージェントは要素の意味を推測しなければならない。一方JSONは、各要素のタイプ、位置、色、テキストを正確に記述し、エージェントはID(例:e4ボタン)を直接参照できる。これはフロントエンド開発、デザインからコードへの変換、バグ再現などのシナリオで特に有効で、エージェントがユーザーの意図を即座に理解できる。
SlimSnapの統合方法も洗練されている。デスクトップアプリが画面をキャプチャしJSONを生成、設定ファイルに書き込む。Claude Codeのスキルが設定ファイルを読み取り最新JSONを自動読み込みする。ユーザーはショートカットキーを押し、注釈を付け、保存し、エージェントに「ここを修正して」と入力するだけで、エージェントは構造化されたコンテキストを得られる。スキルは自動トリガーされるため、ユーザーは意識せずに利用できる。
著者は、オープンなスキーマこそが真のプロダクトだと強調する。SlimSnapのデスクトップアプリはクローズソースだが、スキーマ定義(JSON Schema)とClaude Code用スキルはMITライセンスで公開されている。これにより、SlimSnapが開発を終了しても、ユーザーのワークフローとデータはロックインされない。誰でもオープンスキーマに基づいて新しい注釈ツールやコンシューマーを構築できる。
SlimSnapはスクリーンショット機能を置き換えるものではない。コーディングエージェントを頻繁に使用し、画面状態を繰り返し提示する必要があるフロントエンド作業に最も適している。単発の質問には、スクリーンショットをそのまま貼り付ける方が簡単で効果的だ。