Templit

Agentic Video Production Team

Comment

Inspiration

Video creation today is either painfully manual (hours in Premiere Pro or After Effects) or overly simplified (one-click generators with zero creative control). We wanted something in between — a tool where anyone can go from an idea to a polished video through a natural conversation with AI, while still having full control over every creative decision. Think Cursor, but for video editing. That's Templit.

What it does

Templit is an AI-powered video editing platform where users chat with an AI agent to create videos from scratch. You start by typing a prompt describing your video idea, and the agent walks you through a 6-step pipeline:

  1. Project Overview — Define your topic, duration, and aspect ratio
  2. Artistic Style — Choose a visual tone (3D animation, cinematic, casual, comedic)
  3. Character Generation — Upload reference photos and get AI-generated multi-angle character sheets (front, back, left, right views)
  4. Script & Scenes — AI generates a full storyboard broken into scenes, which you can edit before approving
  5. Scene Thumbnails — AI generates thumbnail images for each scene with your characters placed in them
  6. Final Video — Scene clips are generated and stitched together on a timeline-based editor with playback controls

At every step, you can approve, reject, edit, or regenerate — the AI never moves forward without your sign-off.

How we built it

  • Frontend: Next.js 15 with App Router, TypeScript, and Tailwind CSS v4. The editor uses react-resizable-panels for a 3-panel layout (chat on the left, video preview and timeline on the right).
  • State Management: Three isolated Zustand stores (playback, timeline, chat) to keep concerns separated and prevent unnecessary re-renders.
  • Video-Timeline Sync: A custom hook with a directional flag (seekSourceRef) to enable bidirectional sync between the HTML video element and the playback store without infinite loops. Playhead updates run on a requestAnimationFrame loop for 60fps smoothness.
  • AI Pipeline: Google Nano Banana for image generation (character sheets and scene thumbnails), Gemini 3 for script/storyboard generation and agent orchestration, and Sora 2 for final video generation using frame-to-frame fill from approved scene thumbnails.
  • API Routes: Next.js API routes handle calls to each AI model (character generation, scene generation, scene thumbnails, video generation).

Accomplishments that we're proud of

  • A fully functional conversational video creation pipeline — from a text prompt all the way to a stitched video on a timeline editor.
  • Smooth 60fps playhead scrubbing with bidirectional video-timeline sync.
  • A clean, intuitive editor layout that feels like a real creative tool, not a chatbot wrapper.
  • User approval gates at every step so the AI assists without taking over — you stay in creative control the entire time.

What we learned

  • How to orchestrate multi-step AI pipelines with user-in-the-loop approval at each stage.
  • The importance of state isolation — separating playback, timeline, and chat stores made the app far more maintainable and performant.
  • Prompt engineering for visual consistency across multiple AI-generated images is an art in itself.
  • Building real-time, synced media interfaces (video player + timeline + playhead) requires careful attention to update sources and frame-rate-aware rendering.

What's next for Templit

  • Real-time collaboration — Multiple users editing and chatting with the agent simultaneously.
  • Voice-to-video — Speak your idea instead of typing it, with AI transcription feeding directly into the pipeline.
  • Advanced timeline editing — Drag-and-drop clip reordering, transitions, text overlays, and audio mixing directly in the editor.
  • Export & sharing — One-click export to MP4 and direct sharing to social platforms.
  • Custom model fine-tuning — Let users train character models on their own assets for even more consistent results across scenes.

Built With

Share this project:

Updates