「Stream Deckは便利そうだけど、高いしデスクの場所を取る…」
「手元にあるAndroid端末を、そのままWindowsのショートカットキーとして使えないか？」

そんな思いつきから、WindowsPCを操作するスマホ用マクロパッド『Mobile Macro Pad』を開発しました。

開発期間は約1.5日。
爆速で完成した理由は、ChatGPTを単なるコード生成機としてではなく、 「仕様を決める上司（Reviewer AI）」と「実装する部下（Builder AI）」に分けて管理する開発手法をとったからです。

今回は、そのアーキテクチャの工夫と、AIとの具体的な協業フローについて共有します。

📱 作ったもの：Mobile Macro Pad

仕組みは「Thin Client（シンクライアント）」構成を採用しました。

Windows側（Host / 設定管理）

脳みそとなる部分です。ボタンの配置、色、ラベル、そして実行するアクション（ショートカットキー送信やURLを開くなど）を全て管理します。

ご覧の通り、グリッド上のボタンを選択すると、右側のプロパティパネルでラベル、アイコン、色、アクションを即座に編集できます。この設定はリアルタイムでJSONデータとして保持されます。

スマホ側（Client / Android）

こちらは手足となる部分です。Windowsから受け取ったJSONを元にボタンを描画するだけです。
ロジックを持たず、ボタンが押されたら「ボタンID」だけをWindowsに送り返します。

Windows側の設定（色や配置）が、そのままAndroid側に反映されているのがわかります。
「Disconnect」ボタンや接続ステータスの表示など、実用に必要なUIも実装されています。

🤖 開発プロセス：AI上司と部下の分業

たった1.5日で終わらせるために、「AI駆動開発（V-Model）」という手法を取り入れました。

1. 役割分担

私はコードを書きません。私の仕事は「AI同士の会話の管理」と「動作確認」です。

2. UI微調整の「勝利の方程式」

一番時間がかかる「UIの微調整」は、以下のように進めました。

1. 私：「ボタンの間隔が狭くて押しづらい。もっとマテリアルデザインっぽく、いい感じにして」と雑に投げる。
2. Reviewer AI：「では、Paddingを8dpから16dpへ、Elevation（影）を追加し、Ripple Effect（波紋）を入れる仕様にします」と具体的なパラメータを含む指示書を出力。
3. Builder AI：その数値通りにCSS/Kotlinを書く。

この「指示書を挟む」工程が重要でした。いきなりコードを書かせると修正のたびに別の場所が壊れる（デグレ）のですが、指示書で仕様を固めてから実装させると、一発で通ることが多かったです。

⏱️ 1.5日間のタイムライン

🛠️ 技術的な工夫（ハマりポイント）

AI任せにせず、人間が判断したのは以下の点です。

1. JSONでUIを語る

以下のようなJSONをWindowsから投げるだけで、Android側がGrid Layoutを動的生成するようにしました。

2. 127.0.0.1 問題

エミュレータならlocalhostで通じますが、実機（Wi-Fi）だと繋がりません。Windows側でQRコードを表示し、スマホで読み取って接続する仕様にしました。

📝 まとめ

今回の開発で一番の収穫は、アプリそのものより「Reviewer AI（AI上司）の有用性」でした。

• 雑な要望を、実装可能なスペックに変換してくれる。
• 「その変更をすると、既存の〇〇機能と矛盾しますよ」と警告してくれる。

1.5日で自分だけの左手デバイスが作れる時代。みなさんも、余っているスマホがあったらぜひ挑戦してみてください！