@thanh01.pmt/curriculum-kit 1.0.3 → 1.0.4

package/dist/index.mjs

@@ -10183,21 +10183,27 @@ footer: "Curriculum OS \u2022 ${lessonCode} (${pedagogyLabel})"
 
 MANDATORY 12-14 SLIDE MICRO-CYCLE STRUCTURE (Delimited by '---'):
 1. **Slide 1 [Title & Mission]:** ${lessonCode}: ${lessonTitle} + Real-world inquiry hook
-2. **Slide 2 [Agenda & Roadmap]:** Timing and milestone breakdown (${pedagogyLabel})
-3. **Slide 3 [Warm-Up / Prior Knowledge]:** Prerequisite recall and mental model activator
-4. **Slide 4 [High-Stakes Hook Scenario]:** Authentic engineering/domain crisis scenario
-5. **Slide 5 [Core Concept 1: Mental Model]:** Principle definition, core terminology, and analogy
-6. **Slide 6 [Architecture & Visual Flow]:** Clean Mermaid diagram (flowchart or sequenceDiagram)
-7. **Slide 7 [Core Concept 2: Syntax / Mechanism Anatomy]:** Breakdown of mechanics and key rules
-8. **Slide 8 [Executable Blueprint / Demonstration]:** Annotated runnable code or structured domain walkthrough
-9. **Slide 9 [Guided Practice: Try It Now]:** 3-5 minute active check (I Do -> We Do)
-10. **Slide 10 [Integrated Hands-On Lab]:** 3-tier differentiated challenge (Bronze / Silver / Gold)
-11. **Slide 11 [Traffic Light Checkpoint & Pitfalls]:** Formative self-check & top 2 student misconceptions
-12. **Slide 12 [Exit Ticket & Metacognition]:** Scenario-based check + 1 reflection question
-13. **Slide 13 [Summary & Next Steps]:** 3 core takeaways and preview of next milestone
-
-Rules:
-- No empty slides or shallow bullet lists. Every slide must contain substantive pedagogical value, diagrams, or runnable snippets.
+2. **Slide 2 [Agenda & Roadmap]:** Timing and milestone breakdown table (${pedagogyLabel})
+3. **Slide 3 [Warm-Up / Prior Knowledge]:** 2-column recall + 60-second diagnostic challenge card
+4. **Slide 4 [High-Stakes Hook Scenario]:** Authentic engineering/domain crisis card + dilemma constraint
+5. **Slide 5 [Core Concept 1: Mental Model]:** Definition, intuitive everyday analogy, and golden rule card
+6. **Slide 6 [Architecture & Visual Flow]:** Clean Mermaid diagram (flowchart or sequenceDiagram) + 3 flow steps
+7. **Slide 7 [Core Concept 2: Syntax / Mechanism Anatomy]:** Side-by-side 6-10 lines runnable code + anatomy breakdown & syntax trap card
+8. **Slide 8 [Guided Practice: Try It Now]:** 3-minute active desk task card with starter hint and success criteria
+9. **Slide 9 [Integrated Hands-On Lab]:** 3-tier differentiated challenge cards (Bronze / Silver / Gold) + gotcha alert card
+10. **Slide 10 [Traffic Light Checkpoint & Pitfalls]:** Formative self-check cards (\u{1F7E2}/\u{1F7E1}/\u{1F534}) & diagnostic test question
+11. **Slide 11 [Exit Ticket & Metacognition]:** 2 scenario-based check questions + 1 metacognitive reflection prompt
+12. **Slide 12 [Summary & Next Steps]:** 3 core golden rules + preview card of next upcoming milestone
+
+Mandatory Canvas & Presentation Invariants:
+- A slide is an INTERACTIVE PROJECTION CANVAS, NOT a textbook! Absolutely NO dense paragraphs or walls of text.
+- Follow the 6x6 rule: Maximum 4-6 bullet points per slide, maximum 8-12 words per bullet.
+- Structure slides using \`<div class="columns"><div>...</div><div>...</div></div>\` and \`<div class="card">\`, \`<div class="card highlight">\`, \`<div class="card warning">\`, \`<div class="card success">\`.
+- MANDATORY PRESENTER NOTES ON EVERY SLIDE: Every slide MUST end with \`<!-- Presenter Notes: ... -->\` containing:
+  * SCRIPT: 60-90s teacher talk track with intuitive analogies.
+  * COLD CALL / CHECK: Specific diagnostic question to ask students.
+  * SCAFFOLDING / GOTCHA: Guidance for students who get stuck.
+  * PACING: Recommended minutes for the slide.
 - Output 100% valid Marp Markdown.`;
     const rawSlide = await runCurriculumAIInference(
       [{ role: "user", content: slidePrompt }],
@@ -10935,20 +10941,25 @@ function getArtifactSpecializedInvariants(type, req) {
    - Pacing: Target total duration is ${presentationDuration} minutes (~${Math.round(Number(presentationDuration) / Number(slideCount))} mins per slide).
    - Visual Style: "${presentationStyle.toUpperCase()}". Maintain high visual clarity, contrasting accents, and executive polish.
 2. **STRICT CONCISENESS & 6x6 RULE (ABSOLUTELY NO TEXT WALLS)**:
-   - A slide is a VISUAL PROJECTION CANVAS, NOT a textbook or lesson plan!
+   - A slide is an INTERACTIVE PROJECTION CANVAS, NOT a textbook or lesson plan!
    - Maximum 4\u20136 bullet points per slide.
    - Maximum 8\u201312 words per bullet point. Forbid dense multi-sentence paragraphs on the slide surface.
 3. **SPEAKER NOTES FOR ALL SPOKEN WORDS (<!-- Presenter Notes: ... -->)**:
-   ${includeSpeakerNotes ? "- MANDATORY: Every single slide MUST contain comprehensive presenter notes in `<!-- Presenter Notes: ... -->` at the bottom, giving the teacher the exact verbal talking points, analogies, and pacing tips." : "- Optional brief presenter notes."}
-4. **CLICK-TO-REVEAL SYSTEM**:
+   ${includeSpeakerNotes ? `- MANDATORY: Every single slide MUST contain structured presenter notes in \`<!-- Presenter Notes: ... -->\` at the bottom:
+     - SCRIPT: 60-90s teacher talk track with intuitive analogies.
+     - COLD CALL / CHECK: Diagnostic question to ask students.
+     - SCAFFOLDING / GOTCHA: How to resolve student misconceptions.
+     - PACING: Recommended minutes for the slide.` : "- Optional brief presenter notes."}
+4. **2-COLUMN & CALLOUT CARD LAYOUTS**:
+   - Use \`<div class="columns"><div>...</div><div>...</div></div>\` for comparisons, code vs. mechanics, or side-by-side tasks.
+   - Use \`<div class="card">\`, \`<div class="card highlight">\`, \`<div class="card warning">\`, and \`<div class="card success">\` for scannable chunking.
+5. **CLICK-TO-REVEAL SYSTEM**:
    - Use \`<!-- clicks -->\` before bulleted lists (\`<ul>\` or \`<ol>\`) for incremental click-to-reveal.
    - Use \`<!-- click -->\` before answers, code reveals, or key callouts.
-5. **2-COLUMN / SPLIT LAYOUT**:
-   - Use <div class="columns"><div>...</div><div>...</div></div> for side-by-side concept vs. code or problem vs. solution comparisons.
 6. **CONCISE CODE SNIPPETS**:
    - Maximum 6\u201310 lines of clean code per snippet with inline comments. Never paste whole files.
 7. **MERMAID VISUALS**:
-   - Use Mermaid flowcharts or sequence diagrams for workflows and control loops.`;
+   - Use Mermaid flowcharts (\`graph TD\` or \`graph LR\`) or sequence diagrams for workflows and control loops.`;
     }
     case "tiered_practice": {
       const techStack = cfg.techStack || (req.hardwarePlatform?.[0] || "Modern Programming Language");