Zenn
🥰

ChatGPT × bolt.new × windsurf で実践する「AI駆動開発」

に公開
zennfes2025ai
tech

AIをエンジンにした新しい開発スタイル

AIがコードを書く時代が現実のものになりました。
本記事では「AI駆動開発（AI-Driven Development）」をテーマに、実際に ChatGPT・bolt.new・windsurf を組み合わせて開発を進めたプロセスをまとめます。

AI駆動開発とは？

「AI駆動開発」とは、開発の初期段階からAIをアクティブに利用し、要件定義 → 設計 → 実装 →修正の各ステップをAIとの協働で進めるスタイルを指します。
従来の「AIはコーディングの補助」から一歩進み、プロジェクト全体をAIに“駆動”させることが特徴です。

今回利用したのは以下の3つ：

  • ChatGPT：プロンプト設計・仕様の叩き台・疑似コードの生成

  • bolt.new：AI生成コードの即時プレビューと修正ループ

  • windsurf：開発環境での実際の実装・デバッグ・ビルド調整

プロセスの流れ

1. ChatGPTでプロンプト駆動設計

最初のステップはChatGPTへのプロンプト作成です。
「福岡の神社を観光として検索するアプリ。名前「福岡三社詣り」仕様：検索条件として願い事カテゴリ（金運、仕事運、恋愛運、縁切りなど）、位置、移動手段（徒歩、公共機関、車）。出力された神社の由緒やご利益を表示。同時に３社詣りにつながるように近隣の神社を表示し、観光回遊を狙うアプリ。色は目に優しいパステルピンク文字はジェットブラック。AIを必ず利用したアプリになるようにしてください。」

するとChatGPTは以下を返します：

アプリ名: 福岡三社詣り
ビジネスニーズ:
福岡エリアの神社観光ニーズ（ご利益目的＋回遊性）を取り込み、地域滞在時間・消費を拡大。
断片的な口コミや地図検索では難しい「願い事カテゴリ×位置×移動手段」最適化を、AIでパーソナライズ。
三社詣り（3社巡礼）を自然に促すレコメンドにより、複数スポット訪問を増やす。
主なユーザー:
週末の観光客・出張者（短時間で”効く”コースを回りたい人）
地元住民（新年・縁日・節目の参拝先を探す人）
カップル/友人グループ（恋愛運・縁結び等の体験を重視）
海外旅行者（英語UI経由で文化体験を求める人）
コア機能:

  1. 願い事カテゴリ検索＋NLP拡張検索（AI）
    カテゴリ（例: 金運、仕事運、恋愛運、縁切り、学業、厄除け、安産など）と自由記述の願い事を入力。
    LLMで自由記述をカテゴリに自動マッピングし、同義語・曖昧表現も意図解釈。
    Embeddingsで神社の由緒/ご利益テキストを意味検索→関連度スコアで並べ替え。
  2. 三社詣りレコメンダー（AIルート最適化）
    現在地 or 指定地点を起点に、移動手段（徒歩/公共機関/車）を考慮した3社セットを自動提案。
    目的（例: “恋愛運重視で徒歩30分以内”）に応じ、
    願い事の一致度、
    所要時間、
    参拝動線（回りやすさ）を多目的最適化（スコアリング）し、候補セットを提示。
    候補ごとに合計移動時間・距離・各社の由緒/ご利益をカードで表示。
  3. 詳細ページ：由緒・ご利益・参拝情報の表示
    各神社の由緒、主祭神/ご利益、見どころ（写真・季節の花）、御朱印情報、例祭日、参拝作法のポイント。
    アクセス（公共交通/駐車場）、バリアフリー、混雑の傾向（推定）、所要時間見込み。
    近隣の神社セクション：選択中の社に相性の良い神社をAIでレコメンドして回遊を促進。
  4. 交通モード別ルート案内
    徒歩：歩行者優先ルート、勾配/階段の注意。
    公共機関：最寄り駅/バス停、時刻/乗換の概算（GTFS等からの推定）。
    車：所要時間・駐車場案内・混雑時間帯の注意（推定）。
  5. 会話型参拝コンシェルジュ（AI）
    チャットで「仕事運を上げたい。午前中だけ」「雨でも行きやすい？」など自然言語の相談に応答。
    合わせて三社コースを提案し、保存・共有が可能。
    ページロード/検索条件変更のトリガーでランダム切替。CTR計測（表示/クリックイベント）。
    ユーザー ジャーニー:
  6. トップ/検索：位置許可→願い事カテゴリ選択＋移動手段＋範囲（時間/距離）設定→検索→結果リスト＋マップ、同時にランダムバナー表示。
  7. 結果閲覧：カードで由緒/ご利益/距離/所要時間を確認→「三社セットを見る」をタップ→AIが3社候補を生成→1セットを保存→ルート開始。
    デザインの好み:
    ブランドカラー: パステルピンク（#F6D1E7 推奨）／アクセント（#F8C8DC 併用可）、文字色ジェットブラック（#0A0A0A）。
    スタイルの説明: 柔らかい和モダン、余白広め、視認性重視。角丸・淡いレイヤー・繊細な罫線。
    デザインの参考資料: Material 3の柔色テーマ、shadcn/uiのカード設計、地図系SaaSのパネルレイアウト（参考レベル）。
    データ要件:
    収集する情報：
    神社マスタ：名称、住所/緯度経度、主祭神、由緒、ご利益カテゴリ（複数可）、公式サイト、拝観時間、御朱印有無、例祭、写真URL、バリアフリー、駐車場、最寄り駅/バス停、タグ（桜/紅葉/夜間ライトアップ等）。
    交通データ：徒歩経路、公共交通（駅/バス停、路線、時刻GTFSからの便数/概算所要）、車（道路距離、駐車場位置）。
    利用者設定：願い事意図（自然文/カテゴリ）、移動手段、最大所要時間または距離、現在地（同意時）、言語、デバイス。
    行動ログ：検索条件、表示/クリック/保存、ルート開始、完了、バナー表示・クリック。
    表示する情報：
    検索結果：関連度スコア、距離/所要時間、アイコン（願い事一致度）、混雑推定（低/中/高）。
    三社セット：総移動時間・距離、各社カード（由緒/ご利益/写真）、地図上のルート可視化。
    詳細：参拝マナー、注意事項、季節イベント。
    ビジネスルール:
    三社セットは「起点からの総移動時間」「願い事一致度」「回遊性（円環ルート等）」でスコア化し上位を提示。デフォルトは徒歩30–60分圏、車は90–120分圏の候補（設定で変更可）。
    路上運転中の操作禁止の警告を常時表示。公共交通/時刻は推定である旨の免責を明記。
    寺社名表記・由緒は出典を保持し、AI生成テキストには「参考・推定」ラベルを付与。
    未成年・夜間ルートの安全配慮（街灯/治安スコアが低い場合は注意表示）。
    位置情報・行動ログは明示同意。個人情報は最小化し、保存期間を設定（例: 13か月）。
    同一神社の重複推奨を防止し、三社候補内で地理的偏りを抑制。
    統合のニーズ:bolt-expoは使用しないでください。
    地図・経路: Mapbox GL JS または Google Maps JavaScript API（徒歩/車ルート）。
    公共交通: GTFS（西鉄バス、JR九州等の一般公開データ）を取り込み、時刻は近似推定。
    検索基盤: ベクトル検索（例えばOpenAI Embeddings + pgvector/MeiliSearch）。
    AI/LLM: 意図理解、意味検索、説明文生成、三社セット最適化の候補生成に利用。
    分析: 解析（GA4等）＋イベント計測（検索/保存/バナーCTR）。
    将来の検討事項:
    混雑予測の強化（季節/天気/行事データ学習）。
    多言語対応（EN/KO/ZH）。
    オフライン簡易モード（保存済みコース/詳細の閲覧）。
    電子御朱印/デジタルスタンプラリー（来訪チェックイン）。
    参拝リマインダー（吉日/六曜/一粒万倍日連動）。
    口コミ/参拝記録の個人用ノート、写真アップロード（モデレーション付き）。

2. bolt.newでAIコード生成と即時試作

次に、ChatGPTで得た仕様をbolt.newにプロンプトとして入れるとコードが生成されます。

bolt.newは即座にプレビュー可能な環境を用意してくれるため、プロトタイプの試行錯誤が数分単位で回せるのが強みです。

3. windsurfで実装とチューニング

ある程度形になったらwindsurfに移行します。
ここでは以下のような作業を実施：
bolt.newからコードをダウンロードし、windsurfでファイルを開きます。
『構造チェックをして、おかしなところは修正してください』
『神社一覧csvを更新してください』

windsurfのエディタはAI補完にも対応しており、コード修正の提案も受けながら進められるため、AIとペアプロしている感覚で開発が進みます。

AI駆動開発のメリットと課題

メリット

  • 開発スピードが桁違い：設計からUI試作までを半日で回せる
  • 柔軟な方向転換：検索機能を切ってコンシェルジュ一本化など、判断を即反映
  • 非エンジニアにも開発可能性：ノーコード寄りの試作が容易

課題

  • 検索精度や応答の保証はAI依存
  • APIキーやネット環境など外部要因に弱い
  • チームでの責任分担をAIとどう整理するか

まとめ：AIを「相棒」にする開発

今回の福岡三社詣りアプリ開発では、ChatGPTで要件と設計を素早く固め、bolt.newで実装を叩き台にし、
windsurfで磨き上げる、という流れで「AI駆動開発」を体感しました。

AIはただのツールではなく、プロジェクトを共に推進する相棒になりつつあります。
今後、ハッカソンや短期開発では、このスタイルが当たり前になっていくでしょう。

Discussion