Build interactive learning experiences that teach by making the learner do something, get feedback, and iterate — using Geist's dark-first, minimal, precise UI language.
| Orient | What you'll learn in 5-10 min | Heading + learning objective | | Attempt | Learner predicts/answers/edits first | QuickCheck, CodePlayground, ParameterDock | | Feedback | Immediate + specific response | Feedback surface (green/red panel) | | Explain | Short explanation anchored to their attempt | Callout, WorkedExample |
| Extend | Variation, edge case, or transfer task | BeforeAfterSplit, ConceptExplorer | | Checkpoint | Quick recall question | QuickCheck with ConfidenceRating | | Reflect | "What changed in your understanding?" | Optional text input or self-rating |
Créez des expériences d'apprentissage exploratoires et interactives sous forme d'applications Next.js à l'aide du système de conception Geist. À utiliser lors de la création de didacticiels, d'explications explorables, de leçons interactives, de bacs à sable de code, de quiz ou de toute interface utilisateur éducative. Couvre la pédagogie Learning Loop, plus de 23 modèles de composants d'apprentissage, le suivi des progrès, la répétition espacée et l'exploration interactive de style Bret-Victor, le tout avec l'esthétique minimale et sombre de Geist. Source : vercel-labs/skill-geist-learning-labs.