textbook機能のコンセプト - fjordllc/bootcamp GitHub Wiki

textbook機能のコンセプト

コンセプト

「わからないをその場で解消し、達成感を刻みながら、最後まで読みきれる教材体験」

従来の教科書（テキスト教材）は「読む人のモチベーション」に依存しすぎている。 bootcamp の textbook（教科書）機能は、AIと学習設計を組み合わせて 「続けられる」「つまずかない」「戻りやすい」 教材体験を提供する。

解決したい課題

教材を最後まで読みきれない原因は、主に以下の3つ。

  1. モチベーションが続かない — 進捗が見えない、達成感がない、再開が面倒
  2. わからない箇所でつまずく — 知らない用語、難しい概念で止まる
  3. 一人で学んでいる孤独感 — 質問できない、フィードバックがない

textbook機能は、この3つすべてに対処する。

主要機能

1. ピヨルド（伴走キャラクター）🐥

  • 画面右下にピヨルドが常駐
  • すべてのAI機能・伴走機能の窓口
  • 普段は静かにいるだけ。邪魔しない
  • 必要なときに吹き出しで話しかけてくる

ピヨルドの役割:

  • 質問に答える — クリックするとチャットが開き、今読んでるセクションについて質問できる
  • 褒める — セクション完了時に吹き出しで声をかける
  • うながす — 久しぶりの訪問時に「おかえり！」、止まってるときに「ここ難しいよね」
  • 難しい箇所を助ける — 止まってるとき「ここ難しいよね。やさしく説明する？」

2. 単語クリック説明（つまずき解消）

  • わからない単語をクリック → tooltip（ツールチップ）で説明を表示
  • 単語説明はキャッシュ（同じ単語 × 同じ教材は再利用）
  • PC: クリック、モバイル: タップ

3. テキスト選択で質問（理解支援）

  • 本文中のテキストを選択すると「ピヨルドに聞く」ボタンが出る
  • 選択した箇所について質問できる
  • どこについて聞いてるかが自動的にコンテキストになる
  • AIの回答は現在のセクションに紐づく（脱線しない設計）

4. 読了位置の記録（継続支援）

  • ブロック単位（段落・コード例など）でどこまで読んだかを自動追跡
  • 「前回の続きから読む」で即再開
  • Chapter・Section の進捗を視覚化
  • 「あと○分でこのセクションが終わる」表示

5. やさしい伴走（モチベーション維持）

  • 進んでいないとき → ピヨルドがやさしく再開を促す（罪悪感を与えない）
  • 進捗があったとき → ピヨルドが行動を褒める（能力ではなく行動を）
  • 「今日はここまででOK」をピヨルドが提案
  • 止まっても戻りやすい空気を作る

良いうながしの例

  • 「前回はここまで読めてるよ。次のセクションは5分くらいで読めるよ」
  • 「今日は1セクションだけ進めてみない？」
  • 「前に進めなくても大丈夫。要点だけ先に見る？」

良い褒めの例

  • 「このセクションまで進めたのいいね！」
  • 「難しい章なのにここまで来たのは大きいよ」
  • 「前回より続きから再開できたのえらい！」

6. 理解度ミニチェック（定着支援）

  • セクション末にAIが1〜3問のミニクイズを自動生成
  • 回答チェックもピヨルドが行う
  • 「テスト」ではなく「確認」— 自信をつけるためのもの
  • 間違えたら該当箇所を読み直す導線を提示

7. AI執筆支援（教材制作）

  • 人が章のテーマと学習目標を設定
  • AIが章構成・セクション構成を提案
  • AIが各セクションの初稿を生成（本文 + 例 + クイズ + 単語リスト）
  • 人が編集・加筆して公開
  • AIは「著者の代替」ではなく「編集アシスタント」

位置づけ

まずは bootcamp の1機能として構築

  • bootcamp の中に textbook（教科書）機能として実装する
  • 既存の受講生・教材で素早く価値検証する
  • まずは Markdown 教材を対象にする
  • よさそうなら将来的にサービスとして切り出す

この方針にする理由

  • 既存ユーザーですぐ試せる
  • 既存の教材資産をそのまま活かせる
  • 課金・認証・テナント管理など、本質ではない実装を後回しにできる
  • 本当に効く機能から検証できる

教材の構造

教材の構造はシステム側で固定する。自由なMarkdownではなく、固定された器にMarkdownを流し込む方式。

コンテンツ構造（著者が設計する）

Textbook（教科書）
  └── Chapter（章）
        └── Section（節）

英語の教科書・論文の標準的な階層（LaTeX: \chapter → \section）に準拠。

レベル 役割 例
Textbook 1つの教材全体 「Ruby入門」
Chapter 大きなテーマの区切り 「第3章: メソッドと引数」
Section 1つの学習テーマ（3〜7分で読める） 「3.1 メソッドとは何か」

読了トラッキング（システムが自動で行う）

コンテンツ構造と読了トラッキングは別の関心事として分離する。

  • 構造 は著者が Chapter → Section で設計する
  • 読了位置 はシステムが Section 内のブロック（段落・コード例等）単位で自動追跡する
  • 進捗表示 は Section 単位で表示する（○/○ 完了）
  • 褒め・うながし は Section 完了をトリガーにする

著者は書くことに集中し、読了追跡はシステムに任せる。Kindleと同じ考え方。

UI設計

セクション読書画面

┌──────────────────────────────────────┐
│  Chapter 3: メソッドと引数            │
│  Section 3.1: メソッドとは何か        │
├──────────────────────────────────────┤
│                                      │
│  [教科書の本文が全幅で表示]            │
│                                      │
│  メソッドとは、処理をまとめて          │
│  名前をつけたものです...              │
│                                      │
│  クリック可能な用語に下線              │
│  テキスト選択 →「ピヨルドに聞く」     │
│                                      │
│                    ┌──────────────┐  │
│                    │ いい調子！    │  │
│                    └───┬──────────┘  │
│                       🐥             │
├──────────────────────────────────────┤
│  ← 前のセクション  [3/12]  次へ →    │
└──────────────────────────────────────┘
  • 本文は全幅表示（サイドカラムなし）
  • ピヨルドは右下に常駐
  • モバイルでもそのまま動く

設計方針

AIを「脱線装置」にしない

  • AIの回答は現在のセクションに強く紐づける
  • 「このセクションの範囲で説明する」
  • 答えの根拠となる段落をハイライトする
  • 自由チャットすぎない設計

クイズは「評価」ではなく「伴走」

  • 1問正解したら「OK、次いける」
  • 間違えたら「この段落だけ読み直そう」
  • 小さな達成感の連続を作る

「止まっても戻りやすい」設計

  • 連続記録を脅しに使わない
  • 「止まっても大丈夫」「ここから1歩だけ」
  • 戻ってきたこと自体を前進として扱う

セクションは短く

  • 1セクション = 1学習テーマ
  • 3〜7分で読める量
  • 短いほうがモチベーション維持に効く

実装フェーズ

Phase 1a（Hotwire化完了前に着手可能）

  1. DB + モデル — textbooks / chapters / sections / reading_progresses / term_explanations
  2. 管理画面 — 教科書・章・セクションのCRUD
  3. セクション読書画面 — Markdown表示（Slim + Stimulus）
  4. 読了追跡 — Stimulus + Intersection Observer → API PATCH
  5. 教科書トップ — 章一覧 + 進捗表示
  6. ピヨルド常駐UI — 右下に表示 + 吹き出し（Stimulus）
  7. 伴走メッセージ — セクション完了時の褒め、再開時のうながし（ルールベース）
  8. 単語クリック説明 — AI生成 + キャッシュ（短い回答なのでストリーミング不要）

Phase 1b（Hotwire化完了後）

  • ピヨルドに質問（AIチャット） — ruby_llm の ai chat generator + Turbo Streams
  • テキスト選択で質問 — 選択箇所をコンテキストにしてAIに質問

Phase 2

  • ミニクイズ自動生成・回答チェック
  • AI執筆支援（初稿生成）
  • 学習ダッシュボード（進捗の視覚化）
  • つまずきやすい箇所の分析

Phase 3

  • 学習履歴に基づくAI提案（「今日はここまで」「ここを復習」）
  • 苦手箇所の検出と再説明
  • 難しい段落の自動言い換え
  • 通知（アプリ内、opt-inで外部通知）

ターゲットユーザー

読者（学習者）

  • bootcamp の受講生
  • 特に、教材を読み始めても途中で止まりやすい人

著者（教材制作者）

  • bootcamp のメンター・管理者
  • 教材を作成・改善する運営メンバー

機能名

  • textbook
  • 画面上の表示名は「教科書」

次にやること

  • bootcamp の React → Hotwire 移行状況を確認
  • Phase 1a の実装開始（DB + モデル + 管理画面 + 読書画面）
  • ワイヤーフレーム作成
  • Phase 1b は Hotwire 化完了後に着手