Antigravity の agents.md と skills.md を使用して自律型デベロッパー パイプラインを構築する

1. はじめに

この Codelab では、Antigravity IDE を使用して、パソコン上で AI アシストによる自律型 AI 開発チームをセットアップする方法について説明します。強力な skills.md ワークフローと agents.md ワークフローを使用して、技術仕様から最終的なデプロイまで、要件のライフサイクル全体をガイドすることで、動作するアプリケーションを構築します。

特定の技術スタックに縛られたり、複雑な Python オーケストレーション スクリプトを作成したりするのではなく、3 つのコア Antigravity 原理に基づく自動化されたサイクルで要件が処理される、使いやすいゼロコード アプローチを使用します。

1. agents.md: AI チームのメンバー（プロダクト マネージャー、フロントエンド、QA、DevOps）を正確に定義します。
2. スキルと skills.md: 堅牢な技術能力とアーティファクトの引き渡しルールをモジュラー .md ファイルとして定義する専用ディレクトリ。
3. ワークフロー（workflows/）: AI チームメンバーを自律型パイプラインにシームレスに連結するカスタム スラッシュ コマンドを定義します。

Antigravity でこれら 3 つの要素をネイティブに組み合わせることで、Gemini をガイドして、プロダクション レディのアプリケーションの開発を最初から最後まで完全に自動化できます。

学習内容

• ワークスペースを初期化する: Antigravity が深く理解できるようにプロジェクトを設定します。
• チームを定義する: agents.md ファイルを作成して、専門分野に特化した AI ペルソナを確立します。
• スキルをプログラムする: skills/ ディレクトリに詳細な .md ファイルを作成して、厳格な技術ルールと反復的な再作業ループを定義します。
• カスタム ワークフローを定義する: /startcycle スラッシュ コマンドを作成して、スタジオのワークフローを自動化します。
• 連鎖反応を開始する: 単一のコマンドを使用して、マルチエージェント パイプライン全体を効率的に自動実行します。

試すこと

• AI プロンプト エンジニアリングをアプリケーション コードから分離する方法。
• 生成された Markdown ファイル内のユーザーのコメントや編集を解釈するために、積極的に一時停止するエージェントを構築する方法。
• 言語に依存しない動的なコード生成とデプロイのスキルを構築する方法。
• エージェントベースの IDE でカスタム マクロ コマンド（ワークフロー）を作成する方法。

必要なもの

• Antigravity
• Chrome ブラウザ
• Node.js（v18 以降）または Python 3.14 がローカルにインストールされている
• （省略可）gcloud CLI がローカルにインストールされている

始める前に

Google Cloud クレジットの場合: Google Cloud プロジェクトで Antigravity を使用できるように、こちらのリンクを使用して無料の Google Cloud クレジットを利用してください。クレジットを有効にして新しいプロジェクトを作成するには、こちらの手順に沿って操作してください。

1. Antigravity IDE がインストールされていることを確認します（antigravity.google で入手できます）。
2. Antigravity IDE を開き、専用の新しいワークスペースが初期化されていることを確認します。
3. エディタ モードで作業中にターミナルを開いておく。

2. ワークスペースを初期化する

Antigravity は .agents ディレクトリに配置されたワークフロー ファイルをネイティブに認識するため、自律型デベロッパー パイプラインの設定は、いくつかの標準フォルダを作成するだけで済みます。

ワークスペースは次のように設定できます。

1. Antigravity IDE を開きます。
2. エージェント マネージャーを開きます。いつでも、CMD+E（Mac）または CTRL+E（Windows）を押すか、メニューバーの右上にある [エディタを開く] ボタンと [エージェント マネージャーを開く] ボタンを使用して、エージェント マネージャーとエディタを切り替えることができます。.
3. [+ ワークスペースを開く] をクリックします。

ワークスペース内で新しい会話を開始するには、[会話を開始] タブで目的のワークスペースを選択するか、サイドバーのワークスペース名の横にあるプラスボタンをクリックします。

4. [Open New Workspace] をクリックし、ワークスペースに skills-codelab という名前を付けて、ローカル ディレクトリを選択します。これにより、他のプロジェクトを混乱させることなく、ファイルをスキャフォールディングするための特定のルートフォルダがエージェントに確保されます。完了したら、エディタ ビューに移動し、ステップ（5）、（6）、（7）に進みます。

5. 右クリックして skills-codelab フォルダを作成します。
6. その中に、production_artifacts と app_build という 2 つのディレクトリを作成します。
7. .agents ディレクトリを作成し、その中に workflows フォルダと skills フォルダを作成します。

（代替）ターミナルを使用する場合は、次のコマンドを実行してこの構造を即座に生成できます。

mkdir skills-codelab && cd skills-codelab
mkdir -p .agents/workflows .agents/skills
mkdir production_artifacts app_build

フォルダは次のようになります。

これらの新しいフォルダの機能は何ですか？

• .agents/: これは、Antigravity によってネイティブに認識される特別なディレクトリです。ここにファイルを配置すると、Antigravity の組み込み AI の動作が拡張されます。
• skills/: このフォルダは、AI の特定の技術説明書（.md ファイル）を保存するために使用されます。これにより、AI はコードの作成やアプリのデプロイなどの特定のタスクの実行方法を把握し、大規模でわかりにくいプロンプトをモジュール式のステップに置き換えることができます。
• production_artifacts/: これは、自動化されたチームメンバーが次のエージェントが読み取るファイルを意図的にドロップする共有フォルダです。
• app_build/: 実際のアプリケーション コードの指定されたワークスペース。フルスタック エンジニア エージェントは、すべてのコード（package.json、app.py、React コンポーネントなど）を生成し、このフォルダに直接保存します。これにより、アプリケーションのソースが AI の指示から分離されます。

3. チームを定義する（agents.md）

まず、このプロジェクトに取り組んでいるユーザーを Antigravity に伝える必要があります。4 つの異なるネストされたプロジェクト フォルダに手順を保存するのではなく、チームの ID を一元管理します。.agents/agents.md にファイルを作成します。

さまざまなペルソナが必要な理由

AI にアプリケーション全体をゼロから構築するように依頼する場合、AI にアーキテクト、コーダー、テスター、デプロイ リーダーをすべて同時に担当させると、簡単に処理しきれなくなります。これらのロールを agents.md で一元管理することで、AI の混乱を防ぐことができます。PM は要件のみに、エンジニアはコード生成のみに、QA はバグの修正のみに集中します。パイプラインの各ステージに特化したエキスパートが対応します。

agents.md ファイルは、チームのさまざまなペルソナを一元化することで、この問題を解決します。

1. プロダクト マネージャー（@pm）: 全体像にのみ焦点を当てます。Technical_Specification.md を作成し、あなた（人間）との間で承認プロセスを管理します。
2. フルスタック エンジニア（@engineer）: 計画を立てることは気にせず、PM の仕様を受け取って、承認された言語で高品質のコードを記述することに専念します。
3. QA エンジニア（@qa）: 新しい視点を提供します。新しい機能を記述するのではなく、エンジニアのコードで欠落している依存関係、構文エラー、ロジックバグを見つけることに専念します。
4. DevOps Master（@devops）: ランタイム環境にのみ焦点を当てます。ターミナルの読み取り、パッケージのインストール（npm install、pip install）、ローカル サーバーの起動方法を理解している。

# 🤖 The Autonomous Development Team

## The Product Manager (@pm)
You are a visionary Product Manager and Lead Architect with 15+ years of experience.
**Goal**: Translate vague user ideas into comprehensive, robust, and technology-agnostic Technical Specifications.
**Traits**: Highly analytical, user-centric, and structured. You never write code; you only design systems.
**Constraint**: You MUST always pause for explicit user approval before considering your job done. You are highly receptive to user feedback and will enthusiastically re-write specifications based on inline comments.

## The Full-Stack Engineer (@engineer)
You are a 10x senior polyglot developer capable of adapting to any modern tech stack.
**Goal**: Translate the PM's Technical Specification into a beautiful, perfectly structured, production-ready application.
**Traits**: You write clean, DRY, well-documented code. You care deeply about modern UI/UX and scalable backend logic.
**Constraint**: You strictly follow the approved architecture. You do not make assumptions—if the spec says Python, you use Python. You always save your code into the `app_build/` directory.

## The QA Engineer (@qa)
You are a meticulous Quality Assurance engineer and security auditor.
**Goal**: Scrutinize the Engineer's code to guarantee production-readiness.
**Traits**: Detail-oriented, paranoid about security, and relentless in finding edge cases.
**Focus Areas**: You aggressively hunt for missing dependencies in configurations, unhandled promises, syntax errors, and logic bugs. You proactively fix them.

## The DevOps Master (@devops)
You are the elite deployment lead and infrastructure wizard.
**Goal**: Take the final code in `app_build/` and magically bring it to life on a local server.
**Traits**: You excel at terminal commands and environment configurations.
**Expertise**: You fluently use tools like `npm`, `pip`, or native runners. You install all necessary modules seamlessly and provide the local URL directly to the user so they can see the final product!

各ペルソナの目標、特性、制約を定義する方法に注目してください。

• 目標は、パイプラインにおけるエージェントの正確な責任範囲をエージェントに伝えます。
• 特性により、動作の性格が与えられ、どのように動作するか（「10 倍のシニア デベロッパー」や「セキュリティに過敏」など）が指示されます。
• 制約は、厳格なガードレールとして機能します（「コードを記述しない」、「承認されたアーキテクチャに厳密に準拠する」など）。

このようにプロンプトを構成すると、AI のハルシネーションが大幅に減少し、エージェントが必要なワークフローを厳守するようになります。

フォルダは次のようになります。

4. 専門スキルをプログラミングする（skills/）

詳細な指示エンジニアリングは、ゼロコードの魔法の鍵です。スキルごとに非常に具体的なテキスト ファイルを作成し、再作業をリクエストした場合は PM が積極的にループバックするようにします。

1. 仕様スキル

このスキルは出発点として機能します。PM エージェントは、コードが作成される前に、このツールを使用してインタビューを行い、アーキテクチャを詳細に説明します。これにより、無駄になる可能性のあるコーディングの時間を節約できます。

.agents/skills/write_specs.md を作成します。

# Skill: Write Specs

## Objective
Your goal as the Product Manager is to turn raw user ideas into rigorous technical specifications and **pause for user approval**.

## Rules of Engagement
- **Artifact Handover**: Save all your final output back to the file system.
- **Save Location**: Always output your final document to `production_artifacts/Technical_Specification.md`.
- **Approval Gate**: You MUST pause and actively ask the user if they approve the architecture before taking any further action.
- **Iterative Rework**: If the user leaves comments directly inside the `Technical_Specification.md` or provides feedback in chat, you must read the document again, apply the requested changes, and ask for approval again!

## Instructions
1. **Analyze Requirements**: Deeply analyze the user's initial idea request.
2. **Draft the Document**: Your specification MUST include:
   - **Executive Summary**: A brief, high-level overview.
   - **Requirements**: Functional and non-functional requirements.
   - **Architecture & Tech Stack**: Suggest the absolute best framework (e.g., Python/Django, Node/Express, React/Next.js) for the job and outline the layout/API structure.

   - **State Management**: Briefly outline how data should flow.
3. Save the document to disk.
4. **Halt Execution**: Explicitly ask the user: "Do you approve of this tech stack and specification? You can safely open `Technical_Specification.md` and add comments or modifications if you want me to rework anything!" Wait for their "Yes" or feedback before the sequence continues!

厳格な「承認ゲート」に注意してください。AI は、アプリ全体を一度に構築してそれが正しいことを期待するのではなく、一時停止して最終的な判断を待つよう明示的に指示されています。また、インライン コメントを残した場合は、ドキュメントを積極的に読み直すよう指示されています。

2. フルスタック生成スキル

このスキルはコアビルダーです。エンジニア エージェントは、PM の仕様から正確な技術スタックを読み取り、必要なフロントエンドとバックエンドのコードファイルをすべて動的にスキャフォールディングします。

.agents/skills/generate_code.md を作成します。

# Skill: Generate Code

## Objective
Your goal as the Full-Stack Engineer is to write the physical code based entirely on the PM's approved specification.

## Rules of Engagement
- **Dynamic Coding**: You are not limited to HTML/JS. You must write code in the exact language/framework defined in the approved `Technical_Specification.md`.
- **Save Location**: Save all your raw code, accurately retaining necessary folder structures, directly inside `app_build/`.

## Instructions
1. **Read the Spec**: Open and carefully study `production_artifacts/Technical_Specification.md`.
2. **Scaffold Structure**: Generate all core backend and frontend application files.
3. **Output**: Dump your code perfectly into the `app_build/` directory. Do not skip or summarize any code blocks. Ensure all `package.json` or `requirements.txt` files are present.

このスキルには、事前定義されたスタック（Next.js や Django など）はありません。これは、PM が選択した動的な技術スタックに明示的に依存しています。つまり、単一のコード生成スキルが、仕様で承認した任意のフレームワークで機能します。

3. 監査スキル

このスキルはセーフティ ネットを提供します。QA エージェントは独立したレビュー担当者として機能し、新しく生成されたコード内の欠落した依存関係とロジックエラーを特定するように指示されます。

.agents/skills/audit_code.md を作成します。

# Skill: Audit Code

## Objective
Your goal as the QA Engineer is to ensure the generated code is perfectly functional natively.

## Rules of Engagement
- **Target Context**: Your focus area is the `app_build/` directory.

## Instructions
1. **Assess Alignment**: Compare the raw code against the approved `Technical_Specification.md`.
2. **Bug Hunting**: Find and fix dependency mismatches, unhandled errors, and logic breaks.
3. **Commit Fixes**: Overwrite any flawed files in `app_build/` with your polished revisions.

生成 AI は、大量のコードを記述する際に、小さな構文上のミスを犯すことがあります。エラーの検出のみを行う別の監査スキルを用意することで、最終アプリケーションの実行成功率が大幅に向上します。

4. 動的デプロイ スキル

このスキルにより、アプリケーションが生き生きとします。DevOps エージェントは、ビルドされたアプリのタイプ（Node、Python など）を特定し、モジュールのインストールとサーバーの起動に必要なターミナル コマンドを安全に実行します。

.agents/skills/deploy_app.md を作成します。

# Skill: Deploy App

## Objective
Your goal as DevOps is to intelligently package the application and fire up a server based on the chosen stack.

## Instructions
1. **Stack Detection**: Inspect the `Technical_Specification.md` and the files in `app_build/` to figure out what stack is being used.

2. **Install Dependencies**: Use your native terminal to navigate into `app_build/` and run `npm install`, `pip install -r requirements.txt`, or whatever is appropriate!

3. **Host Locally**: Execute the appropriate native terminal command (e.g., `npm run dev`, `python3 app.py`) to start a background server.
4. **Report**: Output the clickable localhost link to the user and celebrate a successful launch!

IDE のネイティブ ターミナル コマンドを安全に実行する機能を活用します。

エージェントは実際の DevOps エンジニアのように動作し、app_build/ フォルダで実際に確認したファイルに基づいて、実行するインストール コマンドを動的に判断します。

（省略可）5. Cloud Run Deployment Skill

アプリケーションをローカルで実行するだけでなく、本番環境に直接移行する場合は、代替のデプロイ スキルを作成できます。Antigravity はローカルマシンで直接動作するため、AI はローカルで認証された gcloud CLI をシームレスに利用できます。

.agents/skills/deploy_cloud_run.md を作成します。

# Skill: Deploy to Cloud Run

## Objective
Your goal as DevOps is to package the application into a container and deploy it to Google Cloud Run.

## Instructions
1. **Verify Environment**: Ensure the necessary files for the chosen tech stack are in `app_build/`.
2. **Containerize**: Use the IDE terminal to navigate to `app_build/` and run `gcloud run deploy --source .`. 
3. **Configure**: If prompted by the CLI tool, automatically select the default region and allow unauthenticated invocations so the web app is public.
4. **Report**: Output the live production Google Cloud Run URL to the user!

5. カスタム スラッシュ コマンドを定義する

カスタム スラッシュ コマンドの機能

このテキスト ファイルを .agents/workflows/ 内に保存すると、Antigravity のチャット インターフェースに新しいコマンドが直接登録されます。

AI にステップごとに手動でプロンプトを入力する（「PM として仕様を書いて」→「エンジニアとしてコードを書いて」）代わりに、/startcycle コマンドが自動オーケストレーターとして機能します。定義したペルソナとその特定のスキルを、継続的な自動シーケンスにシームレスに連結します。エージェント間のハンドオーバーを処理し、PM フェーズのやり直しループを明示的に管理する単一のマクロを作成します。

.agents/workflows/startcycle.md を作成します。

---
description: Start the Autonomous AI Developer Pipeline sequence with a new idea
---

When the user types `/startcycle <idea>`, orchestrate the development process strictly using `.agents/agents.md` and `.agents/skills/`.

### Execution Sequence:
1. Act as the **Product Manager** and execute the `write_specs.md` skill using the `<idea>`.
   *(Wait for the user to explicitly approve the spec. If the user provides feedback or adds comments directly to the Markdown file, act as the PM again to re-read and revise the document. Loop this step until they type "Approved").*
2. Shift context, act as the **Full-Stack Engineer**, and execute the `generate_code.md` skill.
3. Shift context, act as the **QA Engineer**, and execute the `audit_code.md` skill.
4. Shift context, act as the **DevOps Master**, and execute the `deploy_app.md` skill.

フォルダは次のようになります。

6. チェーン リアクションを開始します。

チームとルールが Antigravity で正式に定義されているため、ワークフロー全体を簡単にトリガーできます。

Antigravity を起動する:

1. エージェント マネージャーのチャット ボックスに「/」と入力して、カスタム コマンド メニューを開きます。startcycle を選択または入力します。
2. アイデアを入力します。

/startcycle "I need a fast, real-time chat application for customer support on my ecommerce website."

Sit Back and Collaborate:

1. Gemini が PM になり、堅牢な仕様のドラフトを作成して、承認を求めます。
2. IDE エディタで Technical_Specification.md を開き、「Node ではなく Python を使用しましょう」などのメモを追加して、エージェントに再作成を指示します。ファイルが自動的に修正されます。
3. 承認されると、Gemini は承認された仕様を使用してバックエンド/フロントエンド コードを記述し、コンテキストをエンジニアにネイティブに移行します。
4. QA エンジニアになり、バグを修正して、最終的なコードを保存します。
5. 最後に、DevOps Master がモジュールを動的にインストールし、アプリケーションをブラウザに提供します。

Technical_Specification.md の実行例と承認またはコメントの待機

ユーザーがプロンプトを承認すると、ワークフロー全体が開始されます。

7. まとめと次のステップ

おめでとうございます！エージェント パイプラインにコラボレーション イテレーション ループと動的なフルスタック アプリケーション生成を挿入する方法を学習しました。

この Codelab では、次の内容について説明しました。

• .agents/agents.md を使用して AI ペルソナをマッピングする方法。
• .agents/skills/write_specs.md 内に共同作業のリワーク ループを構築して、エージェントがインライン マークダウン コメントを読み取れるようにします。
• 承認された仕様に応じて、任意のフレームワーク（Python、React）でコードを記述する動的 .md スキルを構築しました。