# 03 Geminiで生成する

所要 [25min] ／ S04ステップ2に対応

---

## 目的

配布プロンプトをそのまま使い、自分の手元に動くHTMLを1つ手に入れます。

実行回数の目安：このステップではAntigravityをまだ使いません。Geminiブラウザ版への送信は基本1回で構いません。出力が途中で切れた場合の「続きを出力してください」の送信を含めても、2〜3回程度が目安です。

---

## 操作

1. `prompts/01_生成プロンプト.md` を開いて読みます。02で書いた「欲しい画面」がどこまで含まれているか確認します。
2. Chromeで Gemini ブラウザ版を開きます。
3. プロンプトを1文字も変えずにコピーして貼り、送信します。改変は生成が成功してからにしてください。
4. 出力されたコードをコピーします。`<!DOCTYPE html>` より前と `</html>` より後に説明文が付いていたら削除します。
5. テキストエディタに貼り付け、`output/meeting-organizer.html` という名前で保存します。
6. 保存したファイルをダブルクリックしてブラウザで開き、画面が表示されることを確認します。
7. 出力が途中で切れた場合は、`hints/Geminiがうまく生成しないとき.md` を見ながら「続きを出力してください」で続けます。

---

## 自分で考える

生成されたHTMLは、02で書いた「欲しい画面」とどこが同じで、どこが違いますか。1行書いてください。

---

## 生成物の名前と場所

`output/meeting-organizer.html`

---

## OK基準

- ダブルクリックで開くとブラウザに画面が表示される
- `docs/議事録_20260710_定例.md` をテキストエリアに貼って「解析する」を押すと、決定事項・課題・ToDoの3分類に何か表示される

---

## 追加と考察

表示が崩れている、ボタンを押しても反応しないなど、気になる点があればそのままメモしてください。ステップ05でまとめて直します。1つ見つかるたびにAntigravityへ送る必要はありません。

---

## 発展課題

`prompts/02_修正依頼テンプレ.md` の書式を先に眺めておき、あとで使う3点セット（症状／期待する動き／該当箇所の見当）の型を頭に入れておいてください。

---

## うまくいかない場合

[20min] 経過してもブラウザで開けるHTMLが手に入らない場合は、講師の案内に従い `answer/prototype.html` を `output/meeting-organizer.html` としてコピーして次に進んでください。手順は `hints/残量が少なくなったとき.md` にあります。
