Antigravity ベストプラクティス集 — 生産性を最大化する20のテクニック

取り組みの背景

Antigravity を使いこなすことで、開発生産性は数倍に向上します。しかし、単に使うだけでなく、正しい使い方を知る点が肝心です。

ワークスペース設定（5つのTips）

Tip 1：プロジェクト構造を事前に計画する

開発を始める前に、プロジェクト構造を明確にしておくと、Antigravity が一貫性のあるコードを生成しやすくなります。

my-app/
├── src/
│   ├── components/     # UI コンポーネント
│   ├── pages/          # ページレベルコンポーネント
│   ├── services/       # API/外部サービス統合
│   ├── hooks/          # カスタムフック
│   ├── utils/          # ユーティリティ関数
│   ├── types/          # TypeScript 型定義
│   └── styles/         # グローバルスタイル
├── tests/              # テストファイル
└── docs/               # ドキュメント

Tip 2：README に技術スタックを記載

# プロジェクト名
 
## 技術スタック
- **言語**: TypeScript
- **フレームワーク**: Next.js 14
- **UI**: Tailwind CSS
- **状態管理**: React Context + useReducer
- **データベース**: PostgreSQL + Prisma
- **テスト**: Vitest + React Testing Library
 
## コーディング規約
- ESLint, Prettier で自動フォーマット
- Functional components のみ
- 関数型プログラミング推奨

Antigravity はこれを参照して、あなたのプロジェクト標準に合わせたコード生成が可能になります。

Tip 3：システムプロンプトを作成して保存

開発開始時に、Antigravity 用のシステムプロンプトを作成し、ファイルとして保存しておきます。

# .antigravity/system-prompt.md
 
あなたは 10 年経験の TypeScript/React 開発者です。
 
以下のルールに従ってください：
1. TypeScript strict mode
2. 関数型コンポーネント
3. Error boundaries を実装
4. アクセシビリティを考慮（WCAG 2.1 AA）
5. 本番対応のコードのみ

Tip 4：既存のコードスタイルを定義ファイルで管理

.eslintrc.json や .prettierrc を作成して、コードスタイルを明確にします。これにより、Antigravity が生成するコードのフォーマットが一貫します。

Tip 5：プロジェクト用語集を作成

あなたのプロジェクト特有の用語や概念をドキュメント化します。

# プロジェクト用語集
 
- **ユーザー**: 登録済みのアカウント所有者
- **リソース**: プロジェクト内で管理されるアイテム
- **キャッシュ戦略**: In-memory キャッシュを使用、TTL は 5 分
- **エラーハンドリング**: 常に try-catch で実装

プロンプト最適化（5つのTips）

Tip 6：段階的にリクエストを分割する

大規模なリクエストを 1 つのプロンプトで送らず、段階的に分割します。

# ❌ 悪い例：全部一度に
> 完全なデータベース設計、API 実装、フロントエンド UI、テスト、デプロイスクリプトを作成してください

# ✅ 良い例：段階的に
> 段階 1: Prisma スキーマを設計してください
> 段階 2: API ルートを実装してください
> 段階 3: UI コンポーネントを作成してください

Tip 7：参照ファイルを明示的に指定

既存のコードを Antigravity に認識させるために、@ 記号でファイルを参照します。

このコンポーネントを @components/ui/Button.tsx のスタイルに合わせて実装してください

Tip 8：制約条件を明確に記述

実装すべき制約を明確に伝えます。

# 実装制約
 
## パフォーマンス
- バンドルサイズ: < 100KB
- First Contentful Paint: < 1.5秒
- Lighthouse スコア: > 90
 
## ブラウザ対応
- Chrome/Edge: 最新 2 世代
- Safari: 最新 2 世代
- Firefox: 最新 2 世代
 
## アクセシビリティ
- WCAG 2.1 Level AA 準拠
- キーボードナビゲーション対応

Tip 9：エラーケースを具体的に指定

単に「エラーハンドリングを実装」と言わず、具体的なエラーシナリオを列挙します。

# エラーハンドリング要件
 
## ネットワークエラー
- タイムアウト: 30秒以上でタイムアウト
- 接続失敗: リトライを 3 回まで自動実行
- 不正なレスポンス: ユーザーに警告を表示
 
## ビジネスロジックエラー
- 不正な入力: バリデーションエラーを表示
- 権限不足: 403 エラーを返す
- リソース未検出: 404 ハンドリング

Tip 10：出力形式を指定する

コードの形式や出力方法を明確にします。

# 出力フォーマット
 
- 言語: TypeScript
- ファイル名: ProductCard.tsx
- Export: export default 関数コンポーネント
- JSDoc コメント: 全パブリック API に記載

エージェント管理（3つのTips）

Tip 11：複数のエージェントで役割を分ける

複雑なプロジェクトでは、複数のエージェント（会話スレッド）で役割を分けます。

エージェント 1: フロントエンド UI 開発
エージェント 2: バックエンド API 開発
エージェント 3: データベース設計

このように分けることで、各エージェントが特定の領域に集中でき、より良い出力が得られます。

Tip 12：エージェント間でコンテキストを共有

エージェント間での一貫性を保つため、共有ドキュメントを作成します。

# 共有コンテキスト
 
## API インターフェース定義
- 認証: Bearer token
- レスポンス形式: JSON
- エラー形式: { error: { code, message } }
 
## データベース設計
- User, Post, Comment テーブル
- 主キー: UUID
- タイムスタンプ: createdAt, updatedAt

Tip 13：エージェント内でチェックポイントを設定

長い会話では、定期的に検証ポイントを設定します。

> これまでのコードで問題はないでしょうか？
> 修正が必要なところはありますか？
> （エージェントの回答を確認）
> 次のステップに進みます...

キーボードショートカットと効率化（2つのTips）

Tip 14：テンプレートコマンドを作成

よく使うリクエストのテンプレートを保存します。

# テンプレート：React コンポーネント生成
コンポーネント名: [INPUT]
Props インターフェース:
  - [INPUT]
Tailwind スタイル: [INPUT]
テスト: [INPUT]

このテンプレートをエディタのスニペットに登録して素早く使用

Tip 15：実装内容をチェックリスト化

完了確認用のチェックリストをプロンプトに含めます。

# 実装チェックリスト
 
- [ ] TypeScript 型定義完了
- [ ] エラーハンドリング実装
- [ ] ユーティリティ関数でロジック分離
- [ ] Unit test 実装
- [ ] Storybook stories 作成
- [ ] アクセシビリティ確認
- [ ] パフォーマンス最適化

ファイル管理とバージョン管理（3つのTips）

Tip 16：生成されたコードに来源を記録

AI 生成コードにコメントで来源を記録します。

/**
 * @generated by Antigravity
 * @date 2026-03-10
 * @prompt "React コンポーネント ProductCard"
 */
 
export default function ProductCard() {
  // ...
}

Tip 17：生成コードの修正を別ブランチで行う

Git の branch を使い分けます。

# Antigravity で生成されたコードを一度作成
git checkout -b feature/generated-components
 
# 必要な修正・改善を加える
git add .
git commit -m "feat: customize generated components"
 
# 本流にマージ
git checkout main
git merge feature/generated-components

Tip 18：廃止予定のコードを記録する

実装の重大な変更が必要な場合、@deprecated を記録します。

/**
 * @deprecated Use useNewHook instead
 * @removal 2026-04-01
 */
function useOldHook() {
  // ...
}

デバッグとテスト（2つのTips）

Tip 19：生成コードを自分で検証してから使用

Antigravity が生成したコードは、必ず自分で検証してから本番コードに含めます。

# コード検証チェックリスト
 
- [ ] ロジックは期待通りか動作確認
- [ ] パフォーマンステストで問題なし
- [ ] 自動テストで 80% 以上のカバレッジ
- [ ] エッジケーズを手動テスト
- [ ] セキュリティ脆弱性はないか確認
- [ ] 他の開発者に見直してもらう

Tip 20：失敗ケースから学ぶ

Antigravity の出力が期待と異なった場合、原因を分析してプロンプトを改善します。

# 失敗分析テンプレート
 
## 何が起きたのか？
[Antigravity が生成したもの、期待と異なる点]
 
## 根本原因
[プロンプトが不足していた内容、曖昧だった点]
 
## 改善方法
[プロンプトをどのように修正するか]
 
## 次のアクション
[次回からどうするか]

カテゴリ別まとめ

ワークスペース設定

1. プロジェクト構造を事前計画
2. README に技術スタック記載
3. システムプロンプト作成
4. コードスタイル定義
5. プロジェクト用語集作成

プロンプト最適化

6. リクエストを段階的に分割
7. 参照ファイルを明示的に指定
8. 制約条件を明確記述
9. エラーケースを具体指定
10. 出力形式を指定

エージェント管理

11. 複数エージェントで役割分担
12. エージェント間でコンテキスト共有
13. チェックポイント設定

キーボード効率化

14. テンプレートコマンド作成
15. チェックリスト化

ファイル・バージョン管理

16. 生成コードに来源記録
17. 修正を別ブランチで行う
18. 廃止予定コードを記録

デバッグ・テスト

19. 生成コードを検証してから使用
20. 失敗ケースから学ぶ

実践シナリオ：これら Tip を活用した開発フロー

準備フェーズ（Tip 1-5）

1. プロジェクト構造を計画
2. README に技術スタック記載
3. .antigravity/system-prompt.md 作成
4. ESLint, Prettier 設定
5. 用語集ドキュメント作成

開発フェーズ（Tip 6-15）

6. 機能をステップに分割
7. 既存ファイルを参照
8. 制約条件を明記
9. エラーケースを定義
10. 出力形式を指定
11-15. 複数エージェント、テンプレート活用

検証フェーズ（Tip 16-20）

16. 生成コードに来源記録
17. 修正を別ブランチ化
18. @deprecated 記録
19. コード検証チェック実施
20. 失敗から学んでプロンプト改善

まとめ

これら 20 のベストプラクティスを実践することで、Antigravity は単なるコード生成ツールから、プロフェッショナルな開発アシスタントへと進化します。

重要なのは、これらを「ルール」としてではなく、「ガイドライン」として柔軟に活用することです。あなたの開発スタイルに合わせて、カスタマイズして使ってください。

継続的に改善と試行を繰り返すことで、Antigravity を使いこなし、開発生産性を最大化できます。