楽しく楽したい
私、ClaudeのTeamライセンスを会社から与えられておりまして、
日々5時間利用制限と戦いながらClaudeとイチャイチャさせていただいております。
AIは同僚、楽しく会話してなんぼな、え～すけさんですよ。
そんなこんなで会社としての直接的な指示ではないですが、
AI推進に入らされてる人間の同僚に、
「せっかく使ってるんだから、なんか成果とか出してほしいって言われたんだが。。。」
って言われたので「社内で唯一Qiitaに記事書いて貢献してるからそれでよくね？」と思いつつ、
AIで普通にシステム作っても何番煎じだよ感が合ったので、
AIに「〇〇に特化したAIエージェント」とか作らせてみるか
ということで、VSCodeの拡張機能を作ってみたので、その企画～現在までのフローをご紹介（日記
※ソースは会社専用のGitに入れてるので、ちょっと公開は出来ないのであくまでやったフローを書いてきます。
警告
あくまで個人的な使い方を紹介しているだけなのでコレが正解とかではないです。
こんな進め方も有るのかぐらいの軽い気持ちで読んでいってね！
同じ進め方をして出来たシステムの不具合などについては当方は責任を負いかねます（決まり文句
個人的な考え方
わたくし、基本的にどんな仕事も「なんとなく楽しくやりたい」と思っています。
なのでAIに命令だけ言って終わりじゃ、ただの昭和迷惑クソ上司に成り下がる気がしたので、AIを何でも気さくに話せる同僚と見立てて、コチラの考えに対して色々と意見「も」するよう振る舞ってくれる物を作っていければと思い、自分が使うチャットや作るシステムやアプリは常に
「AI(君)はツールじゃなく同僚、君と楽しく仕事したい！」
をコンセプトとして伝えています。
ド◯えもん、コ◯助、まほ◯まてぃっく、ちょ◯っツ…と言った、ロボット・アンドロイドと共に人が成長する系のアニメを見てきた世代なので、どうしてもAIを道具として見れないだよね。。。
アトム世代だったらAI(ロボット)が何でもこなしてくれる道具みたいな扱いが出来るんだろうけど（偏見
最初作ろうとしていたプラン
ウチはAI導入が進んでるとはまだ言えないため、Claudeのライセンスは選ばれし猛者にしか振り分けられていないので、選ばれなかった方々が「AIを使ってなにか作る」と言ったきっかけになればいいなと思い、最初はお手軽なHP作成のAI補助ツールを作る予定でした。
クライアントアプリにしても良かったのですが、出力されたファイルを修正したい・Git管理したい・リモートに上げたいを、1ツールで全部できたら**ステキやん？**って考えた時に、ファイル編集・Git連携・外部接続まで出来るアプリを作るには、規模が大きすぎてとてもじゃないけど1日やそこらで作れんと言うことで、生成以外の部分の機能が既に用意されていて、職業から業務でもよく使っているVSCodeの拡張機能として入れたら解決じゃね？ということで、提供先をVSCode拡張機能にしました。
Eclipseにもプラグインという機能がありますが、このプラグイン・拡張機能って考えマジでよく出来てるなと感心します。
→ミニマムで製品出して、後は有志のプラグインでイイカンジに拡張できるんだもん。ベース部分を作れるのは凄い。
AIにお金はかけたくない
AIがこんなにも日常に溶け込んできたのは、ある程度無料で使えるChatGPTをみんなが使い出したおかげなのかなと。
AIってとっつきにくいんでしょ？をチャット形式で話すだけだよレベルまで引き下げてくれたので、ここまで爆発的に伸びたんじゃないかと推測してます。
ホント、クソどうでもいい適当なブレストを嫌な顔せず・否定せずに付き合ってくれるので、心のオアシスです（闇
そんなこんなで、この拡張機能はClaudeを呼び出すとかではなく、ある程度無料でModelも選べるOllamaをローカルに入れて、そのAPIを使ってユーザがやりたいことを実現させるみたいなことをすることを目指して作り出しました。
※今後、Claudeやその他AIにも切り替えられるようなものに出来ればと（誰かが
開発時にローカルは汚したくない！
PCにNodeやDBやOllamaを直接インストールしたくない！
複数プロジェクトにアサインされてる人あるあるだけど、色んなバージョンのNodeやDBとか入れたりしなきゃならないような場合はローカルにバージョンごとのツールを入れる・切り替えるとかがもうめんどくさくてしょうがない。
なので開発環境（Node）はDockerで構築してローカルを汚さないようにした。
→相手に環境作らせる煩わしさを引き継がないようにするため
AIとブレスト
まずは以下の事項を人間とAIの間で取り決めます。
- ヤりたい事（作りたいもののざっくりゴール）
- MVP（Minimum Viable Product：価値を最小限に絞った製品）を決める
- 制限・制約
自分の場合、コレに＋αで「とりあえずこう作って欲しいけど、ゆくゆくはこうしたい」「で、この考えどう？」「他になんかいい案ない？」を入れて、
自分の未来を見据えた考え＋AIの考え・指摘・提案
を融合させていくような方向でブレストしてます。
更に最後に「MDに落として」と付け加えることで、人間とAIが会話を遡ることなくやりたいことの確認が取れる物を作る。
途中でClaude側から質問が飛んできたりしますが、選択肢の中で選びたいものに少しでも相違があるなら、その他の自由入力でちゃんと伝えることも忘れずに。
正直ココでのやり取りでプロダクトのイメージが変わってくるため、ある程度の妥協は惜しまずって感じですね。
例：「1番がいいけど、〇〇じゃなくて▢▢にして欲しい」
以下、スタート時の原文やり取り
え～すけさん（以下、え）：
Claudeとかの有料AI使えない勢がAI使って開発体験できるようなVSCode拡張機能があったらステキじゃね？
ただ「いきなりシステム作りましょう」だとAIバブちゃんには敷居高いから、とりあえず「HP作ります」ぐらいから始められるものを作りたい。
きっと何入れたらいいかわからんだろうから、基本情報となる部分はフォームで入れさせて、足りない情報はAIから聞き返して自由入力させるみたいな感じとか良くね？
AIにコストかけたくないので、とりあえずOllamaをローカルPCに入れてもらう前提で、そことAPIでやり取りしてHTMLを出力できるように慣ればいいかなと思ってる（途中でClaudeやGeminiに切り替えもできるようにしたい
要望的に過不足・考慮足りてないとか、こんな事も実現できたらいいながあったら教えてプリーズ。
このやりたいことをMDに落とし込んで、以降のやり取りも決まったことはMDに反映していって。
Claude（以下、C）：
めちゃくちゃ良いアイデアですね！🎉 整理しながら考えてみます。
要望の整理と評価
✅ すでに良い点
Ollama（無料・ローカル）ベースで始められる → コスト0
フォームで基本情報入力 → 敷居低い
AIが不足情報を聞き返す → 自然な対話体験
Claude/Geminiへの切り替え → 将来の拡張性
🤔 ちょっと足りないかも？な点
観点課題提案出力の確認HTMLが生成されても「どこに保存されたの？」ってなりそうプレビューパネル＋ワンクリック保存AIモデル選択Ollamaのどのモデル使えばいいかわからないモデル一覧を自動取得して選ばせる生成後の修正「ここだけ変えたい」がチャットだけだとツライ「もう一度生成」「部分修正」ボタンOllama未起動接続エラーで詰まる人が続出しそう起動確認＋セットアップガイドの内包HTMLの限界CSSもJSも欲しいよね普通HTML/CSS/JSをセットで出力
💡 あったら嬉しいかも？
テンプレート選択 → 「ポートフォリオ系」「店舗系」「イベント系」など、フォームの質問内容をテンプレで分岐させる
生成履歴 → 「さっきのやつの方が良かった」に対応
VSCode上でそのままファイルとして開く → 生成 → エディタに展開 → 自分で微調整、という流れが自然
多言語対応 → 英語でも使えると海外ユーザーにも届く
このあとも仕様を決めるためのブレストは続いていくんだけど、自分がここで大事と思ってやってることは1つのMDに集約せず複数のMDに分割をしてます。
例えばMVPではやらないけど今後の改修に入れたいものに関してはTODO.mdだったり、開発環境や開発に必要な情報はdevelop.mdなどに振り分けてもらって、メインとなるMDには基本的にこのアプリで何が出来る・何をしたい・現状どこまで終わってるぐらいにするようにしています。
→メインMDからのリンクでtodoやdevのMDへの導線は入れてもらってます。
設計なんかクソくらえ
人間がプロジェクト回すんであれば、要件決めが終わったら基本・詳細設計やってようやく実装みたいな流れになるかと思うけど、AIと開発をするのであれば上のようなしっかりとしたブレストをやっている時点で、ある程度の構想・開発言語・DB構成などの取り決めも終わっているはずなので、正直タスク化する必要はないとすら思っている。
ブレスト＝要件定義～設計
なのでココから先は如何にちゃちゃっとモノが作れるかをAIとネルネルネルネ（ﾃｰﾃｯﾃﾚｰ
タスクの洗い出し
ブレストで作りたいものが決まったら、作るための道筋をAIと考える時間です。
自分はチャットをしている子をプロジェクト統括とし、サブエージェントを作成してもらって一気に同時進行でタスクをこなしてもらうようにしています（いわゆるオーケストレーションって言うやつ？
同時進行で作業が進みますが何も考えずにやらせると色々とアレなので、まずサブエージェント毎に振り分けるための、エージェント間で資源が被らないようにするとかエージェント同士で作るもののインターフェースを決める、どのタスクが終わるまでコレは進めないなどを考慮したタスク割をしてもらいます。
※人間でも資源被りでコンフリクトとかメンドイっしょ？
もちろんココでもタスク表のMDファイルを出力してもらい、相違がないかなどは確認しましょう。
もはやココまで出来ればほぼ終わりです。
やるべきことまで決まっているので、後はそれをこなすだけだよ。
実装開始（要注意
チャットしてる子を指揮者としてサブエージェントを作って作業をしてもらうわけですが、ココで普通に
君が指揮官となり、サブエージェントを作って、一気に仕上げて
と言ってしまうと、色々と詰みます。
サブエージェントのモデルはタスクによって決めさせる
ClaudeのモデルにはOpus、Sonnet、Haikuがあるよと以前の記事で書いたかと思いますが、
すべての作業をOpusでやろうとしたら直ぐに5時間制限に引っかかって詰みます。
Opusは賢いけどめっちゃ利用量喰います。Sonnetは普通の子です。Haikuは単純作業系が得意な子で利用量少なめです。
タスクの内容によっては難易度が高かったり、単純作業だったりがあるかと。
難易度が高いタスクは賢いOpusでやってほしいし、単純作業やレベルが低い作業はSonnetやHaikuでやってほしい！
なので指揮官がサブエージェントを作るときには、タスクの内容に合ったモデルを選択して作ってもらうようにして下さい。
ココからは君が実装の総指揮官となり、タスクMDの内容に従いサブエージェントを作って、一気に仕上げて夜露死苦。
ただ利用制限の壁が有るので、タスクの難易度や内容によってサブエージェントの利用モデルをSonnet、Haikuなどコストのかからない物を選択して進めて下さい。
選定の指標は以下とします。
- 難易度高・重要タスク：Opus
- 単純作業（EntityやDDL作成などの）：Haiku
- それ以外：Sonnet
制限との戦い
実装はアホほどコストを喰うので、ココからは5時間利用制限との戦いになります。
1回の命令で使い切る（途中で止まる）こともあれば、一気にやり切ることもあります。
コレばかりは使っての感覚を掴むのかなって感じがしています（単純に言語化できない
自分はタスク一覧を見てじゃあ、今回はココまでやってみてと言う感じで、
使い切るギリギリを攻めるようにしています。
制限で作業が途中で止まると、制限解除後の再開する時にどこで止まったかなどの確認で無駄にコスト使っちゃうので、なるべく使い切らないようにするような調整をしながら使っています。
またなんとなくわからんなぁと思う時は正直に今利用がXX%なんだけど、このタスクいけそう？イケるならやってほしい、難しいなら途中で止めてMDに次に進める時の目印入れておいてっていって進めてもらってます。
→まぁ大体制限超えてきます（ダメじゃん
その後
その後は単体テストやったり、E2Eでやったりして、ドキュメント形を整えて終わりです（適当
MVPが出来てから
ここからは保守・運用として動かします。
まずはTODO.mdを今後の対応に書き直してもらう。
何をするかと言うと…
AIとブレスト
結局この流れをループするだけなんです。
何をすればいいか分からなくなったら、それすらAIに聞けばいいんです。
今ココまで出来てるけど、オススメの追加機能とかをTODO.mdに追加してプリーズ。
自分は「〇〇が出来る機能」があったらいいかなと思ってるけどどう？
何個か候補を優先度別に上げて欲しい。
こうすれば候補がいくつか出てくるので、
そのなかから人間がやるべきことを決めて、
ブレストで仕様を詰めて、
実施タスクを洗い出して、
マルチプロセスで一気に作る。
この流れがちゃんと出来れば、なんとなくいいものが出来ていくんじゃないかなと思っています。
まとめ
AIに言い切りの命令を伝えて終わりもいいけど、
アレもしたい、コレもしたい。コレどう？アレどう？って相談しながら進めたほうが、
結局いいのが出来るんじゃないかなと思って使っていければと思ってます。