Type: infographic
**sim-id:** real-world-deployment-patterns<br/>
**Library:** vis-network<br/>
**Status:** Specified
Purpose: Let learners click through three real-world deployment patterns (corporate onboarding, courseware, certification prep) and see which chapter's concepts each pattern relies on most heavily, reinforcing that a case study is a specific, documented instance of the general real-world application category.
Bloom Level: Evaluate (L5)
Bloom Verb: assess, justify, recommend
Learning objective: Given three deployment pattern summaries, the learner can assess which chapters' concepts each pattern depends on most and justify a recommended learning-graph-driven approach for a deployment scenario of their own choosing.
Visual layout: three large clickable cards arranged horizontally, each labeled with a deployment pattern name and an icon (briefcase for corporate onboarding, graduation cap for courseware, certificate for certification prep); selecting a card reveals a connected mini graph below showing which of this book's chapters/concepts that pattern relies on most
Interactive elements:
- Click a pattern card: highlights that card and reveals its mini dependency graph and a 2-3 sentence case-study-style summary
- Hover a node in the mini dependency graph: shows a tooltip naming the chapter and concept
- A text box below the mini graph: "What would you validate first if you deployed this pattern?" with a "Reveal Suggested Answer" reveal-on-click button
Data to display per card:
1. "Corporate Onboarding" — relies most on Chapters 1-5 (graph structure), Chapter 9 (mastery/sequencing), Chapter 18's LMS Integration; suggested first validation: "Confirm no policy depends on a tool introduced in a later training module (a cycle-detection problem, Chapter 5)"
2. "K-12 / Higher-Ed Courseware" — relies most on Chapters 6-10 (learning theory), Chapter 16 (personalization); suggested first validation: "Confirm the taxonomy balances foundational and goal concepts appropriately for the target grade level (Chapter 4)"
3. "Certification Prep" — relies most on Chapter 5 (validation), Chapter 18's Quality Gate; suggested first validation: "Confirm every exam-tested concept has at least one chapter section and one assessment item (Quality Gate coverage check)"
Color coding: corporate card in slate blue, courseware card in green, certification card in gold; selected card gets a highlighted border
Responsive behavior: three cards stack vertically on viewports narrower than 700px; mini graph appears directly below its selected card in both layouts
Canvas size: responsive, 100% width, 520px height
Implementation: HTML/CSS card layout with click handlers revealing a vis-network mini graph per pattern (three small pre-built datasets, 4-6 nodes each); reveal-on-click answer box implemented as a simple hidden/visible div toggle