Course Trailer showcase — module previews, learning journey progress, completion badges, and student counters for online courses and educational content. Routed from remotion-pro orchestrator.
Status: Stub — Full implementation in Wave 4
This showcase is planned for Wave 4 development. The stub reserves the skill slot, documents the specification, and displays the correct response to users who request it.
The Course Trailer showcase creates promotional and preview videos for online courses, workshops, and educational programs. It sequences through module cards, scrolls through lesson previews, shows a progress journey, and closes with a completion badge and student counter. Designed to communicate value, build desire, and drive enrollment.
Best for: online courses, cohort programs, workshops, masterclasses, certification programs, learning paths.
| Component | Purpose | |---|---| | ScreenScroll | Scrolls through curriculum or module list | | ProgressBar | Shows learning journey progression | | GlassmorphismCard | Frames individual module or lesson cards | | MobileFrame | Wraps mobile app or course platform view | | CounterUp | Animates student count or rating numbers |
Hook (2-3s)
└── Bold promise or outcome headline
(e.g., "Master React in 30 days")
Modules Appear (5-10s)
└── GlassmorphismCard slides in for each module
Module number, title, and duration shown
Cards stack or sequence with stagger animation
Preview Scroll (5-8s)
└── ScreenScroll through curriculum or lesson list
MobileFrame optionally wraps the view
Progress (2-3s)
└── ProgressBar fills to show course completion arc
"Week 1 → Week 4" milestone markers
Badge (2s)
└── Completion badge or certificate preview animates in
CTA (3-4s)
└── CounterUp shows student count ("Join 3,400+ students")
Enrollment CTA with deadline or priceTotal Duration: 30–60 seconds
# From video-profile.yaml or briefing
course:
title: "React Mastery"
tagline: "Go from beginner to job-ready in 30 days"
duration: "30 days"
modules:
- number: 1
title: "React Fundamentals"
lessons: 12
duration: "4h"
- number: 2
title: "State Management"
lessons: 8
duration: "3h"
- number: 3
title: "Real-World Projects"
lessons: 15
duration: "6h"
student_count: 3400
rating: 4.9
badge_image: "assets/badge.png" # optional
cta_text: "Enroll now — limited spots"
enrollment_url: "yoursite.com/course"
primary_color: "#7C3AED"When a user requests this showcase, display:
🎓 COURSE TRAILER SHOWCASE
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
This showcase is coming in Wave 4 of a video pipeline.
What it will produce:
• Module cards with glassmorphism styling
• Curriculum scroll preview with device frame
• Learning journey progress bar
• Student counter and completion badge
• Enrollment CTA closing sequence
• Duration: 30–60 seconds
To be notified when this is ready, check the
changelog or watch the remotion/ directory for updates.
In the meantime, you can use the existing remotion-video skill
for general Remotion composition work.
━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━