VibeSlide | Devpost

Landing page
Sample video generation

🎯 Inspiration

Education deserves innovation. We were moved by the countless hours teachers spend creating lessons, only for students to disengage with uninspiring content. This gap sparked our mission. We imagined a future where any educator—regardless of technical background—could effortlessly transform their lessons into visually rich, emotionally resonant learning experiences using only their voice.

🚀 What it does

VibeSlide reimagines how knowledge is delivered. Educators simply describe what they want to teach, and our AI instantly generates professionally animated video lessons with:

🎞️ Dynamic visuals
✍️ Seamless text transitions
📖 Coherent narrative flow

Our intuitive three-panel interface features:

👀 Real-time previews
🧩 Drag-and-drop timeline
💬 Live conversational editor

This empowers educators to create compelling stories—without the tech overhead.

🛠️ How we built it

We engineered VibeSlide at the crossroads of education and artificial intelligence using:

⚛️ Next.js 15 – for a responsive frontend
🎬 Remotion – for high-performance video rendering
🧠 Groq's LLM – for natural, real-time conversation

Our design philosophy: simplicity with depth

No training needed
Matches the power of pro video tools
Optimized for speed, clarity, and responsiveness

🧩 Challenges we ran into

Our biggest hurdles:

⚖️ Balancing high-quality rendering with instant feedback
🧪 Prompt engineering to ensure educational integrity, not just flashy visuals
🔁 Synchronizing user inputs with dynamic timeline updates
⚡ Optimizing frontend + backend for fast, smooth performance

These pushed us to rethink traditional rendering pipelines.

🏆 Accomplishments that we're proud of

We created a tool that truly levels the playing field for content creation:

👩‍🏫 Real educators turned complex topics into beautiful animations in minutes
🎯 Focus Mode enables distraction-free creativity
🎥 Results rival studio-quality production—no training required

This impact reaffirmed our belief in accessible, intuitive design.

📚 What we learned

Key lessons from building VibeSlide:

🧑‍🤝‍🧑 Great ed-tech enhances human connection
⚙️ Technical insights:
- Rendering optimization
- AI prompt alignment
- State management for complex UI
🔊 Most importantly: the best tools amplify educators' voices—not replace them