Gemini CLIとADKでエージェントを作った：東北TECH道場レポ

盛岡で開催された東北TECH道場に参加してきた。Gemini CLIでChrome拡張機能を作り、ADK（Agent Development Kit）でコーディングエージェントを自作するハンズオン。めちゃくちゃ楽しかった。

イベント概要

イベント: 東北TECH道場（2026年3月28日）
講師: Yoichiro Tanaka（Tably CTO / Google Developers Expert Web）
内容:
- 前半：Gemini CLIで自作Chrome拡張機能を作る
- 後半：ADK for TypeScriptでコーディングエージェントを作る

前半：Gemini CLIでChrome拡張機能を作る

Chrome拡張って、意外と簡単だった

正直、Chrome拡張機能はもっと難しいものだと思っていた。それがGemini CLIと組み合わせると、自然言語で「こういう拡張を作って」と言うだけで基本的な構造ができてしまう。

拡張機能の仕様を知らなくても、やりたいことを言葉にすれば形になる。私はコードを書かない偽エンジニア(?)なので、ぴったりの体験だった。

Gemini CLIは以前、日本語入力がしにくくて使わなくなったという経緯がある。今回試したらその問題が解消されていて、Macだからなのか、CLI側が更新されたのかはわからない。CursorやClaude Codeと根本的に違う感じはなく、CLIの黒い画面になれてしまえば普通に使える。

サイバーパンクなグリッチ加工

ハンズオンではまずブラウザ上のimg要素(画像とか)をくるくる回す拡張機能を作った。これ好き。皆さんもぜひ作ってみてください！

各自で自由に作る時間、私が作ったのは、ページ内の画像にサイバーパンク風のグリッチエフェクトをかける拡張機能。最近よく見るVHS加工みたいな、あの赤と青の文字がズレる表現をWebページに乗せる感じ。全体がチカチカ点滅したり揺れたりして、「ハッキングされた！」って言ったら信じちゃいそうな画面になる。実用性はゼロ。でも楽しい。

画像生成を数年やっているのだけど、「ブラウザの中で画像を加工する」という発想が新鮮だった。生成するんじゃなくて、既にあるものを壊して遊ぶ。

後半：ADKでコーディングエージェントを作る

エージェント・ツール・ファンクションの三層構造

後半はADK（Agent Development Kit）for TypeScriptを使って、コード生成AIエージェントを自作した。ADKというのは、簡単にいうとAIを動かす仕組みそのものを自分で組むためのキット(たぶん)。ここで学んだ一番大きなことは、エージェント・ツール・ファンクションの考え方だった。

ファンクション: 具体的な処理の実体。ファイルを書く、読む、消す
ツール: ファンクションをラップして、「このツールは何者か」をエージェントに教える定義。ハンズオンで実際に定義したのは Write・Read・Delete の3つのツール
エージェント: ツールをどの場面でどう使うかを判断する主体

重要なのは、ツールに処理を持たせるだけでなく、それがどんなツールなのかをちゃんと説明として定義すること。さらに上の層では、エージェントの定義によって「どんな場面でそのツールを使うか」が変わる。その定義を徹底するか、あるいはわざと幅を持たせるか。そこが設計の大事なところだと思った。

普段使っているものの裏側が見えた

私は普段、CursorやClaude Codeといったコーディングエージェントを使って開発している。自分ではコードをほぼ書かない。

ADKでAIエージェントを自作してみて、こんなことを考えた。

Cursorでよく使う手順は、ツールとして定義してしまった方が出力が安定する。これはまあ、一般的に言われてることだと思うんだけど、ここで言う「安定」は質ではなく再現性の話だ。ある目的を達成するための経路はたくさんある。「ここは必ず経由してほしい」というステップを毎回プロンプトで書くのは大変だし、書き方によってブレる。それをツールとして固めてしまえば、経路が収束する。

ADKで手を動かして初めて、そのやり方の明確な名前と構造を知ることができた。

盛岡にもこういう場があるということをもっと知ってほしいし、もっと仲間を増やしたい。

次にやりたいこと

ADKの活用先を探る — 今の業務自動化（Slack Bot、議事録AI、手順書生成とか）のどこにエージェント設計を入れられるか考えたい
Chrome拡張をGitHubに公開 — グリッチ加工のやつをポートフォリオとして置いておきたい
ブログにもっと技術記事を書く — 今回のレポが2本目。続けていきたい