AI を利用して与件から要件定義を作成する
こんにちは、暑い日が続きますが今日も元気なよしざわです。
Gaji-Labo では AI 情報のキャッチアップや活用方法の研究を進めており、今回 AI と対話的に与件から要件定義を作成するワークフローが出来たので紹介します。
ポイントは、要件定義書のテンプレートと質問事項のテンプレートを用意し、対話的に進めることです。
全体のステップ
具体的な内容に入る前に、全体のステップを紹介します。
- AI に与件、要件定義書のテンプレート、質問事項のテンプレートを与える
- AI にコードベースを検索させ、要件定義書の項目を埋めるために足りない情報を質問事項ファイルに列挙してもらう
- AI が書いた質問事項に AI との対話で回答し、回答の要約を質問事項ファイルに追記させる
- AI が与件と質問事項ファイルを参考に、要件定義書を完成させる
次の章から具体的な例を紹介します。
例では、開発プロジェクトは Gaji-Labo のホームページ開発プロジェクトとし、与件として「ユーザーが連続して訪問した日数を表示したい」という内容を与えました。
また、 Cursor を利用し、モデルは claude-4-sonnet を利用しました。
AI に与件、要件定義書のテンプレート、質問事項のテンプレートを与える
まず AI に与件、要件定義書のテンプレート、質問事項のテンプレートをコンテキストとして与えることで、やりたいことを理解させます。
今回利用した要件定義書のテンプレート、質問事項のテンプレートは以下のものを与えました。これらは AI で今回のために作成したテンプレートなので、プロジェクトなどによって変更すると良いと思います。 テンプレートが変わっても同じプロセスで要件定義書を作成できると思います。
要件定義書テンプレート
# Issueタイトル: [機能名や開発対象を具体的に記述]
## 1. 何を作りたいか (機能のコア)
**As a** [誰が]
**I want to** [何をしたい/何ができるようにしたい]
**(So that)** [それによって期待されること (もし明確なら記述。不明な場合は省略可。「なぜこれが必要か?」をAIに問いかけるのも有効です)]
## 2. これができればOK (受け入れ条件)
_この機能が「完了」とみなされるためには、以下のシナリオが成功する必要があります。AIに「この機能で他にどんなテストが必要?」「この条件で考慮漏れある?」などと質問しながら具体化しましょう。_
---
**Scenario 1: [シナリオの簡潔な説明]**
`Given` [前提条件]
`And` [別の前提条件]
`When` [ユーザーが行う操作やイベント]
`And` [別の操作やイベント]
`Then` [期待される結果やシステムの振る舞い]
`And` [別の期待される結果]
---
**Scenario 2: [シナリオの簡潔な説明]**
`Given` [前提条件]
`When` [ユーザーが行う操作やイベント]
`Then` [期待される結果やシステムの振る舞い]
---
**(ここから下に、思いつく限りのシナリオ (正常系・異常系・境界値など) をGherkin形式で記述、または箇条書きでアイデアを列挙。AIがGherkin化や追加提案を支援します)**
-
-
-
## 3. 開発スコープ (影響範囲・対象コンポーネントなど)
_このIssueを実現するために、開発・修正が必要になると考えられる機能、コンポーネント、モジュール、APIエンドポイント、データベーステーブルなどを列挙します。分かる範囲で記述し、AIに「この機能を作るにはどんな技術要素やコンポーネントが必要そう?」と相談するのも良いでしょう。_
- **新規作成が予想されるもの**:
-
-
- **修正が必要になりそうな既存のもの**:
-
-
- **その他検討事項・技術的メモ**:
-
-
# タスクタイトル
## 質問事項1
- 詳細
- 解答の要約
- 詳細
- 解答の要約
## 質問事項2
### 結論
AI にコードベースを検索させ、要件定義書の項目を埋めるために足りない情報を質問事項ファイルに列挙してもらう
今回与えたプロンプトは以下です。
ユーザーが連続して訪問した日数を表示できるようにしたいという依頼が来ました。
issueテンプレートとissueのサンプルをもとに今回の予見をissueに落とし込んで欲しいと考えています。
まずはテンプレートを読んで書きたい内容を把握して、コードベースを検索してください。
その上で、要件に落とし込むために詰めたい内容をquestion.mdをベースに別ファイルを作って記入してください。
質問事項と要件定義書のテンプレートはあらかじめ渡しています。このプロンプトを渡すことで、 AI がコードベースを参照してプロジェクトの内容を把握し、疑問点を整理してくれます。コードベースが膨大なプロジェクトでは、ユーザーが検索させる情報をある程度限定する必要があるケースがあります。
ポイントとして、なるべく多くのコンテキストを利用できる AI モデルを使うことで高い効果が得られます。
このステップで AI が生成した質問事項の一部を添付します。
# 連続訪問日数表示機能に関する質問事項
## 1. 連続訪問の定義
- 「訪問」とは具体的に何を指しますか? (例: アプリケーションの起動、特定のページへのアクセス、ログイン成功など)
- 連続とみなす期間の単位は何ですか? (例: 日単位、時間単位など)
## 2. 対象ユーザー
- この機能は全てのユーザーを対象としますか?特定のユーザーセグメントのみですか?
本来はこの3倍ほどの質問事項が記入されました。
AI が書いた質問事項に AI との対話で回答し、回答の要約を質問事項ファイルに追記させる
このステップでは、 AI と対話的に質問事項ファイルに回答していきます。 その際、以下のようなプロンプトを利用して、質問事項ファイルに回答を要約して追記させるようにします。
これから質問事項ファイルの質問に回答するので、回答を要約して質問事項ファイルに追記してください。
このステップによって完成した質問事項ファイルの一部が以下です。
# 連続訪問日数表示機能に関する質問事項
## 1. 連続訪問の定義
- 「訪問」とは具体的に何を指しますか? (例: アプリケーションの起動、特定のページへのアクセス、ログイン成功など)
- **結論:** 任意のページへのアクセス
- 連続とみなす期間の単位は何ですか? (例: 日単位、時間単位など)
- **結論:** 日単位
## 4. 対象ユーザー
- この機能は全てのユーザーを対象としますか?特定のユーザーセグメントのみですか?
- **結論:** 全てのユーザー
AI が与件と質問事項ファイルを参考に、要件定義書を完成させる
ここまできたらあとは要件定義書を完成させるだけです。
検索したコードベースと質問事項ファイル、要件定義書のテンプレートを参考に、要件定義書を作成してください。
上記のようなプロンプトを与えることで AI が枠を全て埋めた要件定義書を作成してくれます。今回の例で完成した要件定義書を以下に添付します。
# Issueタイトル: 連続訪問日数表示機能の実装
## 1. 何を作りたいか (機能のコア)
**As a** 全てのユーザー
**I want to** 連続してサイトを訪問した日数を、常に画面右上に分かりやすく表示したい
**(So that)** 自分の継続的な利用状況を直感的に把握でき、モチベーション向上やリテンション向上につなげたい
## 2. これができればOK (受け入れ条件)
---
**Scenario 1: 連続訪問日数のカウントと表示(正常系)**
`Given` ユーザーがサイトにアクセスした
`When` 前回の訪問日(UTC基準)が前日である
`Then` 連続訪問日数が1日増加して表示される
---
**Scenario 2: 連続訪問日数のリセット**
`Given` ユーザーがサイトにアクセスした
`When` 前回の訪問日(UTC基準)から1日以上間が空いている
`Then` 連続訪問日数が1日目としてリセットされる
---
**Scenario 3: 初回訪問時の表示**
`Given` ユーザーが初めてサイトにアクセスした、またはCookieが存在しない
`When` サイトにアクセスする
`Then` 連続訪問日数が「1日」として表示される
---
**Scenario 4: 1日に複数回訪問した場合**
`Given` ユーザーが同じ日(UTC基準)に複数回アクセスした
`When` サイトにアクセスする
`Then` 連続訪問日数は1日分のみカウントされ、増加しない
---
**Scenario 5: 連続訪問日数が0日の場合**
`Given` ユーザーがサイトにアクセスしていない
`When` サイトにアクセスする
`Then` 1日目として表示される(0日は表示されない)
---
- 連続訪問日数は常に画面右上に表示される
- 0日の場合は非表示(ただし、訪問時点で1日目なので通常0日にはならない)
- 上限は設けない
- デザインは既存コンポーネントや実装に調和するようエンジニア裁量で実装
## 3. 開発スコープ (影響範囲・対象コンポーネントなど)
- **新規作成が予想されるもの**:
- 連続訪問日数表示用のUIコンポーネント(画面右上に常時表示)
- 連続訪問日数を管理するロジック(Cookie操作、日付判定、カウント処理)
- **修正が必要になりそうな既存のもの**:
- 画面右上のレイアウトやヘッダー部分の既存UI
- 既存のCookie管理やユーティリティ関数
- **その他検討事項・技術的メモ**:
- サーバーサイドの実装は不要(全てフロントエンドで完結)
- 日付の判定はサーバーUTC基準
- オフラインやタイムゾーンの考慮は不要
- 著しくパフォーマンスが落ちるようなことは許容できないが、特別な計測や監視は行わない
- Cookieのキー名は `consecutive_visit_days` にする
まとめ
今回は、AI を利用して与件から要件定義書を作成するワークフローをご紹介しました。今回の例はあくまでも例として、これを応用して GitHub の issue を作成したり、質問事項に回答する部分を応用して AI にタスクを依頼するためのタスク依頼書を作成するなど、様々な使い道を模索しています。
ぜひこの記事をご覧になったみなさんにも、このワークフローの一部だけでも抜き出して活用いただけたら嬉しく思います。
Gaji-Labo Culture Deck
Gaji-Laboでは、 Next.js 経験が豊富なフロントエンドエンジニアを募集しています
弊社では Next.js の知見で事業作りに貢献したいフロントエンドエンジニアを募集しています。大きな制作会社や事業会社とはひと味もふた味も違う Gaji-Labo を味わいに来ませんか?
Next.js の設計・実装を得意とするフロントエンドエンジニア募集要項
もちろん、一緒にお仕事をしてくださるパートナーさんも随時募集中です。まずはお気軽に声をかけてください。お仕事お問い合わせや採用への応募、共に大歓迎です!