「AIエージェントキャッチアップ #39 - OpenHands-Versa」を開催しました

ジェネラティブエージェンツの大嶋です。

「AIエージェントキャッチアップ #39 - OpenHands-Versa」という勉強会を開催しました。

connpass.com

アーカイブ動画はこちらです。

www.youtube.com

OpenHands-Versa

今回は、マルチモーダルなブラウジング機能を持つコーディングエージェント「OpenHands-Versa」をキャッチアップしました。

OpenHands-VersaのGitHubリポジトリはこちらです。

github.com

今回のポイント

OpenHands-Versaとは

OpenHands-Versaは、OpenHandsをベースにブラウジング機能を追加したエージェントです。 「Coding Agents with Multimodal Browsing are Generalist Problem Solvers」という論文のリファレンス実装とされています。

arxiv.org

OpenHands-Versaは、SWE-Bench Multimodal・GAIA・The Agent Companyといったベンチマークで高い性能を示しています。

なお、OpenHands-Versaのブラウジング機能は、現在はOpenHands自体にも実装されています。

OpenHands-Versaを動かした様子

OpenHands-Versaを実際に動かしてみました。

README.mdに書かれているインストールと設定の手順を実施したあと、make runコマンドで起動することができました。

例として、ちょっとしたコードを書く指示を出してしばらく待つと、コードが実装されました。 (このとき、Dockerでの環境構築にしばらく時間がかかりました)

その後、ブラウザでアクセスして操作してみるよう指示すると、ボタンをクリックしたりする様子を確認できました。

OpenHands-Versaで使われているツール

OpenHands-Versaはいくつかのエージェントで構成されています。

参考: https://github.com/adityasoni9998/OpenHands-Versa/tree/316e2d7890e066150d0ec9d3eafbf173653fc749/openhands/agenthub

そのうちCodeActエージェントには、ファイル編集やブラウザ操作のツールに加えて、Anthropicのブログで紹介されている「think」ツールも実装されていました。

www.anthropic.com

ThinkTool = ChatCompletionToolParam(
    type='function',
    function=ChatCompletionToolParamFunctionChunk(
        name='think',
        description=_THINK_DESCRIPTION,
        parameters={
            'type': 'object',
            'properties': {
                'thought': {'type': 'string', 'description': 'The thought to log.'},
            },
            'required': ['thought'],
        },
    ),
)

コード引用元: https://github.com/adityasoni9998/OpenHands-Versa/blob/316e2d7890e066150d0ec9d3eafbf173653fc749/openhands/agenthub/codeact_agent/tools/think.py

OpenHands-Versaのブラウザ操作の実装

OpenHands-VersaのCodeActエージェントのブラウザ操作について、もう少し掘り下げてみました。

LLMに与えるツールの実装は以下のようになっていました。

BrowserTool = ChatCompletionToolParam(
    type='function',
    function=ChatCompletionToolParamFunctionChunk(
        name='browser',
        description=_BROWSER_DESCRIPTION,
        parameters={
            'type': 'object',
            'properties': {
                'code': {
                    'type': 'string',
                    'description': (
                        'The Python function that interacts with the browser.\n'
                        + _BROWSER_TOOL_DESCRIPTION
                    ),
                }
            },
            'required': ['code'],
        },
    ),
)

コード引用元: https://github.com/adityasoni9998/OpenHands-Versa/blob/316e2d7890e066150d0ec9d3eafbf173653fc749/openhands/agenthub/codeact_agent/tools/browser.py

LLMがこのツールを呼び出す際のパラメータはcodeのみです。 codeには、fill('a12', 'example with "quotes"')click('a51')click('48', button='middle', modifiers=['Shift'])といったコードが出力されることになります。

codeというパラメータのdescriptionはとても詳細に記述されています。

この実装では、Anthropicなどの組み込みのComputer use機能とは異なる方法で、ブラウザ操作の指示を出力させているということになります。

BrowserGymの活用

fill('a12', 'example with "quotes"')click('a51')といったコードがどのように実行されるのか確認していったところ、「BrowserGym」というライブラリを使用していました。

参考: https://github.com/adityasoni9998/OpenHands-Versa/blob/316e2d7890e066150d0ec9d3eafbf173653fc749/openhands/runtime/browser/browser_env.py

github.com

BrowserGymは、Webエージェントのためのフレームワークであり、BrowserGymを使うとPlaywrightなどを直接使用するよりも簡単にWebエージェントを実装できるようです。

BrowserGymはなかなか面白そうだったので、今後のテーマとして改めて取り上げたいと思います。

次回のご案内

以上、今回は「OpenHands-Versa」をキャッチアップしました。

次回は「AIエージェントキャッチアップ #40 - Motia」ということで、API・イベント・エージェント向けの統合的なバックエンドフレームワーク「Motia」がテーマです!

connpass.com

ご興味・お時間ある方はぜひご参加ください!

また、その次の回以降のテーマも募集しているので、気になるエージェントのOSSなどあれば教えてください!