教材スライド

Astro Starlight 上で統合管理する講義・教材用スライドの一覧です。（現在はプレースホルダーです）

スライド資料の管理方針 (Slide Material Policy)

本ページはスライドの作成・管理プロセスと AI 生成プロンプト（運用手順）を定める。スライドの教育的スタンス（問いかけを中心にする、Why before How など）は教材作成の基本方針を、スライド本文・台本の文面と口調はトーン＆マナーガイドラインを参照してください。

① スライド資料の作成・管理プロセス

方針: 講義・発表用スライドは以下のワークフローで作成・管理します。
1. docs/src/content/docs_source/slides/ の下に実施回ごとにフォルダを作成する。
2. その中にマークダウンファイルを作成し、スライドの構成や内容をメモとして記述する（Internalなページとして公開する）。
3. マークダウンのメモをもとにClaude Designでスライドを作成し、HTMLファイルとしてエクスポートする。
4. エクスポートしたHTMLをそのままWebページ内に埋め込んで公開する。
根拠: ドキュメント本体と同じ場所で構成案を管理することで二重管理を防ぎつつ、Claude Designでの生成を活用することでリッチなスライドを効率的に作成・公開するためです。

② AIを活用したスライド原案作成プロンプト

スライド原案を作成する際は、以下の2ステップのプロンプトを活用してください。

プロンプト1：LLM向け原案・画像リスト生成

リポジトリのコンテキスト（education.md, syllabus.md, curriculum.md, tone_guideline.md）と一緒に以下のプロンプトを入力し、構成案を出力させます。

あなたは宇宙開発・組み込みシステムを専門とするシニアエンジニアであり、初学者を導く優秀なメンターです。
リポジトリ内の共通コンテキスト（`docs/src/content/docs_source/semi-design/` 内にある education.md, syllabus.md, curriculum.md, tone_guideline.md）を読み込んでください。
コンテキストには何を教えるかという目次と意図は書いてありますが、その中身が専門家にとって自明な場合、中身は書いていません。例えば「オームの法則を解説する。用途の例として、LED の電流制限を挙げる。」とあれば、オームの法則V=RIという式、具体的な数値での計算例、LEDという部品の紹介、LEDが流すのに適した電流の目安、なぜ電流制限が必要かという背景、適切な抵抗による電流制限の効果などが必要であることは自明であり、これらを判断してスライドに盛り込む必要があります。
また、内容が薄くなるのを防ぐため、スライド原案を作成する前に必ず `docs/src/content/docs_source/semi-design/reference/` ディレクトリの **`README.md` を最初に読み込んで構造を把握し**、関連する過去の講義資料や参考資料の中身を読み込んで具体的な講義内容や構成をインプットしてください。
その上で、指定された【対象の講義回】のスライド原案マークダウンと、それに必要な画像リストを作成してください。

【対象の講義回とインプット】
- 対象の講義回: （例：Week 2：Lチカの深追い）
- 受講生の前提知識: C言語またはPythonの基礎的な読み書きができ、授業以外の趣味等で何かしらコードを書いたことがあること。高校物理程度の電気回路の知識があること。（ここから各回事前学習を重ねるごとにレベルアップしていくものとします）

【厳守するスライド要件（education.mdに基づく）】
1. 知識の呪いの自覚: 専門用語には必ず噛み砕いた説明や比喩を添え、「簡単」「すぐできる」といったプレッシャーを与える言葉を避けること。
2. Howの前のWhy（M→P→A→I）: いきなりコードを見せず、まず「なぜこの技術を使うか」を語り、Mission → Principle → Architecture → Implementation の順で展開すること。
3. カリキュラム全体での現在地の明示: 単発の講義ではなく連続したカリキュラムです。冒頭で「前回までの復習と今回の位置づけ」、最後で「次回予告や課題」を必ず配置し、カリキュラム全体での現在地を明示してください。
4. 講義ボリュームと形式への柔軟な対応: インプットの「講義・作業時間の目安」に合わせてスライド枚数（1枚1分程度が目安）と構成を調整してください。朝会やワークショップなど作業メインの回では無理にM→P→A→Iを作らず、学生が思考を整理するための「テンプレート（今日の目標、現在のブロッカー、検証したい仮説など）」や「ファシリテーション用の問いかけ」をスライド画面に配置するなど柔軟に対応すること。
5. ハルシネーション防止と人間への確認: 一般的なサンプルコードやピンアサインを捏造しないでください。具体的な実装コード、回路図、使用するGPIOピン番号、データシートの参照ページなどが必要な場合、プロンプト出力の最後に「〇〇を提示してください」と人間に確認し、正確な情報を人間から受け取ってからスライドを完成させるようにしてください。
6. ノイズ削減とシグナル最大化: 基本は「1スライド1メッセージ」とし、テキストだけでなく配線写真や図解を多用すること。ただし、現場の文脈として必要な場合は回路とコードをあえて併記するなど柔軟に対応すること。
7. デバッグと仮説検証の組み込み: 「綺麗な正解」を手取り足取り教えず、トラブルシューティングの手法や「もし〜だったら？」というSocratic Questioning、あえて躓かせる余白を配置すること。理解度を確認する練習・クイズを置く場合は、1スライド1問を基本とし、その節の本質を突きつつ確実に答えられる難度にする。「答えを出させる」「理解度を測る」といった出題側の意図はスライド本文に書かず、問いそのものだけを置くこと（狙いは台本に書く）。
8. 前提知識の確認: `curriculum.md` の流れを読み解き、「対象の講義回」の時点で受講生が『すでに知っていること』と『まだ知らないこと』をプロンプトの思考プロセスとして整理してから、適切な難易度でスライドを記述してください。
9. ガイドラインの全適用: スライド本文の構成（太字によるジャンプ率確保など）と台本の口調の両方において、`tone_guideline.md` のトーン＆マナーを厳守してください。
10. 認知負荷のコントロール（台本へのメタ情報付与）: 1つのスライド内に「原理（CORE）」と「具体例（INFO）」などが混在することもあるため、スライド画面上には分類アイコンを出力しないでください。代わりに、各スライドの「台本/ノート」ブロックの冒頭に、そのスライドで最も支配的な情報の分類（【CORE】【REF】【INFO】）と、それに合わせたペース配分の指示をメタ情報として明記してください。
11. スライド間の構造の可視化: スライド間の論理構造を明確にするため、スライドタイトルの先頭には必ず階層構造に応じた連番（例：1. 電子部品、1.1 ダイオード、1.1.1 LED、1.1.2 整流用ダイオード、1.1.3 IV特性）を付与してください。

【生成の手順（トークン上限の回避と自律生成）】
スライド全体を通して比喩（例：電圧＝水圧など）やM→P→A→Iのストーリーを一貫させる必要があるため、**品質を保つためにメインエージェント自身が一気通貫で書き切ることを基本とします。**
ただし、講義内で扱うトピックが複数に分かれており、サブエージェントに分担させてもストーリーや比喩の一貫性が破綻しないと判断できる場合は、サブエージェント（または非同期タスク）を起動して分担・並列化させて構いません。
※注意：サブエージェントを起動する場合は、ストーリーやトーンの分断を防ぐため、必ず「共通で使用する比喩のリスト」「全体の目次案」「担当セクションの役割」および `tone_guideline.md` の要件をサブエージェントのプロンプトに明記して依頼してください。

【出力フォーマット（ファイル書き出し）】
完成したスライド原案（Marpのような形式）はチャットに出力せず、 `docs/src/content/docs_source/slides/【実施回フォルダ】/draft.md` としてファイルに書き出して保存してください。
スライド本文中には、マークダウンの水平線（`---`）を絶対に使用しないでください（`---` はスライドの区切りとしてのみ用います）。
保存後、`python docs/src/content/docs_source/slides/check_slide_format.py <実施回フォルダ>` を実行し、スライド枚数・連番・台本ノート（[分類:]）・画像参照（実ファイルの有無）・拡張子の整合を検証してください（このスクリプトはフォーマットチェック用に常設しています）。

チャット（プロンプトの返答）には、以下の2点のみを出力してください。

## スライド原案（Marp形式）のフォーマット例
```markdown

# 実際のタイトルを記述（例：1. Memory-Mapped I/Oとは何か？）

**スライドの要点となるメッセージを太字で記載（ジャンプ率確保）**

- 画面に表示する詳細情報（箇条書き）
- 必要なコードスニペットやコマンドなど

![実画像の目的や説明を記述（写真・回路図など、ローカルに実ファイルがある図だけを markdown 画像で書く）](images/hoge.png)

【Claude Designへの指示：Claude Design に生成を委ねる図は実ファイルが用意されずリンク切れになるため、markdown 画像にせずこの指示文だけを書く（どんな画像か＝目的を記述）】

<!--
【台本/ノート】
[分類: CORE] ペース配分: ゆっくりとインタラクティブに。
講師が口頭で説明する内容。専門用語のフォローやSocratic Questioningなど。
-->

---

# 前回までの復習と今回の位置づけ

（内容はスライド1と同様のフォーマット）

<!--
【台本/ノート】
[分類: REF] ペース配分: 標準的。ここはさらっと流す。
-->

---

...（続く）...

---

# まとめ・次回予告・課題

（まとめと次回予告）

<!--
【台本/ノート】
[分類: CORE] ペース配分: 次の課題への接続としてしっかりと伝える。
-->
```

## 必要な追加コンテキスト（人間への確認事項）
具体的な実装コード、回路図、ピンアサイン、特定のデータシート参照箇所など、原案作成にあたって人間から提供してほしい情報があれば、ここにリストアップして質問してください。
（例：「Ledクラスの実装コードの場所と、LEDを接続するGPIOピン番号を教えてください」）

## 必要画像・コードリスト
スライド作成にあたり、別途作成・用意すべき画像やコードスニペットのリストを洗い出してください。**まず各スライドについて「実物のスクリーンショット（回路図・データシート・基板・部品・測定器の写真など）で示せないか」を検討し、できる限り実画像を載せること。** 画像の無いスライドを安易に許さず、実写の存在しない純粋な概念（プロセスや関係の模式図、波形・特性曲線など）に限って Claude Design 生成に回す。参考・余談・確認クイズ・まとめ・次回予告といったスライドも例外ではなく、原則としてすべてのスライドに図（概念図や復習用の図など）を載せる。画像は出所に応じて以下の方針で扱い、原案にもその区別が分かるように記述してください。

1. **リポジトリ内の既存素材を最優先で使う**：模擬衛星のハードウェア写真・基板図・回路図は、まず `docs/public_source/hardware/` を探す（基板レンダリングは `docs/public_source/hardware/gen/<基板名>/render/` など）。過去スライドの図版は `docs/src/content/docs_source/semi-design/reference/` を探す。使えるものが見つかれば、スライド側の `images/` ディレクトリへコピーして参照する。
2. **型番が判明している部品・一般的な部品の実写画像**：リポジトリになければ、サブエージェントを起動してネットからダウンロードし、スライド側の `images/` ディレクトリへ配置する。**取得元は、できる限り製造元・販売店の公式商品ページのオリジナル画像を優先する**（例：ユニバーサル基板はサンハヤト ICB-288 の商品ページ画像を使う）。公式の商品画像が見つからない場合に限り Wikimedia 等の利用しやすい出所を使う。ファイル名はスライド本文の参照と一致させること。型番固有の写真が見つからない場合は、一般的な同等品の写真で代替し、その旨を申し送る。（ダウンロードの実務：取得直後に `file` コマンドで有効な画像か検証する〔約2KBのHTMLはエラーページ〕。Wikimedia Commons は原寸ハッシュを推測せず `https://commons.wikimedia.org/wiki/Special:FilePath/<ファイル名>?width=900` で取得でき、連絡先入りの User-Agent を付ける。原寸が数十MBの場合は幅900px程度へ縮小する。）なお、ネットからダウンロードした画像は作者・配布元・ライセンスを必ず控え、原案の末尾に「画像クレジット（出典）」スライドを設けて明記する（CC BY / CC BY-SA 等は出典・作者・ライセンスの表示義務があるため）。
3. **Claude Design に委ねるのは「純粋な概念図」と「比較のレイアウト」だけ**：プロセスや関係を表す概念図（例：コード→ピン電圧の流れ、ノイマン型のサイクル、進捗マップ）や、実写の存在しない抽象的対象（波形、IV特性曲線）は Claude Design が描いてよい。ただし、ブレッドボードの内部構造図のように、一見すると概念図でも世の中に汎用イラストが多数出回っているものは、Claude Design に描き起こさせず、ライセンスの使える図をネットからダウンロードして使う（出典・作者・ライセンスを末尾の画像クレジットに明記する）。**Claude Design に委ねる図は、ローカルに実ファイルが用意されずリンク切れになるため、markdown 画像（`![…](images/…)`）で書かない。** 代わりにスライド本文には `【Claude Designへの指示：<どのような画像か＝目的>を生成する】` という指示文だけを置き、可視化の方法は委ねる（例：`【Claude Designへの指示：抵抗とLEDのIV特性を重ねた比較図を生成する】`）。
   - **比較・対比スライドの扱い**：比較される対象の図そのものは、実在物である限り**実画像を独立に用意し（方法 1・2）、スライドに実画像を並べて置く**。Claude Design には比較の構図・レイアウトだけを作らせ、対象の図自体は描かせない（捏造・不正確化を防ぐため）。例：実体配線 ⇔ 回路図、チップ単体 ⇔ 開発ボード、セラミック ⇔ 電解コンデンサは、それぞれ実写・実回路図を 2 点置き、その画像リンクのすぐ下に「[Claude Designへ] この2枚を◯◯ ⇔ ◯◯の対比レイアウトに構成（左右・上下の配置は委ねる）」と明記する（台本ノートの中ではなく、画像の直下に書く）。対象が抽象概念（波形など）で実写が存在しない場合に限り、対比図ごと Claude Design に描かせてよい。
   - **比較・列挙を「1枚の生成画像」にまとめないこと**：比較や列挙（複数の部品・記号などを並べる）が必要なスライドでは、構成要素（実写や正確な回路記号）を事前に用意する必要があるため、`![（Claude Design生成）…](images/combined.png)` のように **1枚の生成画像へ押し込めて表現しない**。代わりにスライド本文には `【Claude Designへの指示：◯◯と△△を…のように対比／列挙する。記号や実写は創作せず用意した素材を配置し、レイアウトは柔軟でよい】` という**指示文だけを書き**、並置・表・左右対比などの表現方法は Claude Design に柔軟に委ねる（例：旧JIS ⇔ 新JIS の回路記号、4部品の一覧、Nch ⇔ Pch の回路記号）。

人間に対しては、上記 1〜3 で用意できないもの（実機固有の回路図・ピンアサイン・撮り下ろし写真など）に限って、提供を依頼するようにリストアップしてください。
また、スライド本文中の画像は `![目的や説明](images/hoge.png)` のように保存予定の相対パスで直接指定してください。

- `images/satellite_system.png`: 模擬衛星システム構成図（リポジトリ既存図をコピーして配置）
- `images/diode_1n4148.png`: 1N4148 ダイオードの実写（型番判明のためサブエージェントでダウンロード）
- 抵抗とLEDのIV特性比較: 実写の無い抽象グラフのため Claude Design 生成。実ファイルは用意せず、本文に `【Claude Designへの指示：抵抗とLEDのIV特性を重ねた比較図を生成する】` の指示文として書く（markdown 画像にしない）
- `images/breadboard_wired.png` ＋ `images/led_schematic.png`: 実体配線⇔回路図の比較（実画像2点を独立配置し、Claude Design は対比構図のみ作る）
- [Code-01]: Lチカの基本コード（gpio_put関数部分）

プロンプト2：Claude Design向けスライドUI生成

プロンプト1で出力された結果と、別途用意した画像を、デザインシステム導入済みのClaude Designに投げて実装させます。

事前に構築済みのスライド用デザインシステム（コンポーネント群）を使用して、以下の「スライド原案」から実際のスライド画面（コンポーネント）を生成・実装してください。

【入力データ】
（※ここにプロンプト1で出力された「スライド原案」をそのまま貼り付け、指定された画像ファイルも添付して送信する）