Patshaala - Sarvam Educational Video Generator

Patshaala generates short educational video lessons in Indian languages. Enter a topic, pick a language, and the app builds a scene-based lesson with translated voiceover and synced visuals.

What it does

• Generates a structured lesson script from a topic using an LLM.
• Translates narration and on-screen text with Sarvam Translate (Mayura).
• Synthesizes dialogue audio with Sarvam TTS (Bulbul v3).
• Computes clip durations from WAV audio and syncs them to scene timing.
• Plays the lesson instantly in-browser with Remotion Player.

Tech stack

• Next.js (App Router) + React + TypeScript
• Remotion + @remotion/player
• Sarvam APIs (Translate + TTS)
• OpenRouter via Vercel AI SDK for script generation
• Tailwind CSS

How the pipeline works

1. POST /api/generate receives { topic, language }.
2. LLM generates scene JSON (title -> summary) with dialogue.
3. Text is translated to the selected language.
4. Each dialogue line is converted to speech.
5. WAV duration is converted to frames (fps = 30).
6. Client renders LessonVideo with synchronized audio + visuals.

Supported scene types

• title
• bullets
• definition
• steps
• comparison
• timeline
• example
• quiz
• highlight
• summary

Supported languages

hi-IN, bn-IN, ta-IN, te-IN, gu-IN, kn-IN, ml-IN, mr-IN, pa-IN, od-IN, en-IN

Getting started

Prerequisites

• Node.js 20+ (LTS recommended)
• npm
• API keys for Sarvam and OpenRouter

Installation

npm install

Environment variables

Create .env.local in the project root:

SARVAM_API_KEY=your_sarvam_key
OPENROUTER_API_KEY=your_openrouter_key
TTS_CONCURRENCY=6

Notes:

• TTS_CONCURRENCY is optional and defaults to 6.
• .env.local is gitignored.

Run locally

npm run dev

Open http://localhost:3000.

Production build

npm run build
npm run start

API

POST /api/generate

Request body:

{
  "topic": "Photosynthesis for class 8",
  "language": "hi-IN"
}

Response shape:

{
  "scenes": [
    {
      "type": "title",
      "data": {},
      "dialogueClips": [
        {
          "role": "teacher",
          "speakerVoice": "gokul",
          "translatedText": "...",
          "audioUrl": "data:audio/wav;base64,...",
          "durationInFrames": 120
        }
      ],
      "durationInFrames": 240
    }
  ],
  "totalDurationInFrames": 1800,
  "fps": 30,
  "language": "hi-IN"
}

Project structure

src/
  app/
    api/generate/route.ts      # Main generation endpoint
    page.tsx                   # UI + Remotion Player
  lib/
    llm/                       # LLM prompt + script generation
    pipeline/                  # Topic -> translated scenes + audio clips
    sarvam/                    # Translate and TTS API clients
  remotion/
    LessonVideo.tsx            # Root composition
    SceneRenderer.tsx          # Scene component switch
    scenes/                    # Individual scene UIs
    components/                # Shared remotion components

Notes and limitations

• The app currently plays generated videos in-browser (no MP4 export flow).
• Generation latency depends on LLM + translation + TTS API response times.
• API limits and billing are controlled by your Sarvam/OpenRouter accounts.