こんにちは松田です。
ここ1週間、AIツール【Google Antigravity（アンチグラビティ）】に完全どハマりしてました。
「AIでプログラミング」と聞くと、「初心者には関係ない」「難しいコードばかりなんでしょ」と思うかもしれません。が・・・
このツールを使うと「バイブコーディング（Vibe Coding）」が一気に身近になります。「こんな雰囲気（Vibe）のアプリが欲しいな〜」と伝えるだけで、AIが自律的に考え、計画し、作り上げてくれます。（多少のIT知識は必要かな）
プログラミングレベルが超低い私が、面白すぎて没頭したこのツールを、解説してみます。
ヒューマン・イン・ザ・ループとは？
Antigravityの良いところは、「人間がOKを出さないと動かない」ということ。
専門用語で「ヒューマン・イン・ザ・ループ（Human-in-the-Loop）」と呼ばれるこの仕組みは、「注文住宅の家づくり」に例えると良いでしょうか。
これまでのAIは、大工さんがいきなりトンカチを持って現れ、「とりあえず壁作ってみました！」と勝手に工事を始めて結果を見せてくれる感じだったけれど、設計図見せてくれるところから始まります。
AI建築士との共同作業プロセス
- まず、ぼわっとしたイメージを伝えます。「家族5人が暮らせる家（アプリ）考えて！」
- 設計図の提案（Plan）：まずAIが「こういう手順で家（アプリ）を作りますが、いいですか？」と設計図（実装計画）を見せてくれます。
- 確認と承認（Approve）：あなたは施主としてそれをチェック。「ここはもっと広くして」と注文をつけるか、問題なければ「着工（Approve）ボタン」を押します。
- 工事開始（Code）：ここで初めて、AIはコードを書き始めます。
「計画 → 確認 → 実行」というステップを必ず踏むので、知らない間に変なコードを書かれたり、大事なファイルを消されたりする心配がありません。
私たちはコードを書く必要はありませんが、「Goサインを出す責任者」として、安心して計画を進められるのです。
ここがスゴイ！「ブラウザ操作」
実際に使ってみて、「未来きた…」と思う機能があります。それが「Browser Agent（ブラウザ操作）」です。
アプリを作り終えたAIは、なんと自分でブラウザを立ち上げ、自分でボタンをクリックして動作テストを始めます。「あ、玄関ドアの位置変だな」とAI自身が気づき、勝手に修正コードを書き始めます。
さっと2分で、できあがり
ブラウザで確認出来る簡単なモノ（HTML/CSS/JavaScript）を作成依頼してみました。
指示：10ｘ10のマインスイーパー作って、HTML/CSS/JavaScriptだけで動くように。
提示されたプラン
HTML構造 (index.html)
- ヘッダー（タイトル・サブタイトル）
- ゲーム情報バー（フラグ数、リセットボタン、タイマー）
- 10×10のゲームボード
- 勝敗メッセージ表示エリア
- 遊び方の説明
スタイリング (style.css)
- ダークグラデーション背景
- ガラスモーフィズム効果（
backdrop-filter: blur） - セルのホバーアニメーション
- 数字ごとの色分け（1=青、2=緑、3=赤…）
- 地雷爆発・勝利時のアニメーション
- レスポンシブ対応
ゲームロジック (script.js)
| 機能 | 説明 |
|---|---|
| initGame() | ゲーム初期化 |
| placeMines() | 15個の地雷をランダム配置 |
| calculateNeighborMines() | 隣接地雷数を計算 |
| revealCell() | セルを開く（空なら連鎖展開） |
| handleRightClick() | フラグの設置/解除 |
| checkWin() | 勝利判定 |
| startTimer() | タイマー開始 |
承認したらサクッと完成！ここまで2分足らずです。
マインスイーパー これ、AIが作ってくれたファイルをサーバにUPしただけです(^_^)
全人類「作り手」時代… もう来てますね…
この1週間、Antigravityのおかげで「自分のアイデアが形になる喜び」を再確認しました。
必要なのは難しい技術ではありません。「何を作りたいか」という情熱（Vibe）と、AIへのちょっとした指示出しだけ。どんどん仕事が無くなる…かもしれないけれど😭
けれど、大事なのは「作りたいものを指示できる能力」と「是非を判断できる能力」これは人間側がしっかり持つ必要がありますね。
ちょっとした社内システムのご相談お待ちしています(^_^)
次回は、顧客管理ステムを作って紹介してみたいと思います。
コメントを投稿するにはログインしてください。