Inspiration
Developers spend countless hours explaining codebases through meetings, documentation, and onboarding materials. We envisioned a solution where any repository could explain itself with a built-in walkthrough—no need for screencasts or static READMEs. Our core question: What if every GitHub repo could become a video in under a minute?
What It Does
GitFlick transforms any GitHub repository into a narrated video walkthrough in about 60 seconds. Simply paste a repo URL, and our AI:
- Analyzes the codebase,
- Produces a professional video featuring syntax highlighting, file navigation, and
- Delivers natural-language narration walking through the system architecture.
There’s no manual editing, scripting, or post-production required.
How We Built It
Our 3-step pipeline:
- Ingestion: A Node/Python server clones the repo, traverses the file tree, and bundles key source files (TypeScript, JavaScript, Markdown, etc.).
- AI Analysis: Google Gemini 3 receives a structured digest, generates 12–18 scenes, writes individual narrations, and selects code highlights.
- Rendering: Remotion creates an IDE-style UI with syntax highlighting and animations; Google Cloud TTS adds voice; Supabase manages storage and authentication. The tech stack is React + TypeScript on the frontend, with Gemini 3 driving narrative logic.
Challenges We Ran Into
- Keeping Gemini 3’s context concise yet meaningful—we designed a compact digest so we could send representational excerpts instead of entire files.
- Syncing scene timing with TTS narration for perfect audio-visual alignment.
- Handling large and messy repos with unclear structure—so we built fallback strategies and smart file filtering for consistently useful videos.
Accomplishments That We're Proud Of
- Automated the entire flow: from URL to shareable video in roughly 60 seconds.
- Deep Gemini 3 integration for script and narration.
- Built a real-time processing UI showing ingestion, analysis, and rendering progress.
- Delivered a polished, IDE-style video layout complete with syntax highlighting and file navigation.
What We Learned
We discovered how to structure prompts so Gemini 3 produces consistent architectural walkthroughs—far better than generic summaries. We also separated the ingestion and manifest layers (extraction vs. interpretation), making iteration and debugging much faster.
What's Next for GitFlick
We're now focusing on B2B and engineering teams. GitFlick streamlines:
- Enterprise onboarding: New hires get video walkthroughs for critical repos, reducing weeks of ramp-up.
- Internal knowledge base: Teams maintain video docs in sync with their code.
- Developer advocacy: Open-source projects and APIs can ship explainer videos with each release.
- Code review & handoffs: Provides faster, clearer context for reviewers and new owners.
Built With
- gemini
- react
- remotion
- supabase
- typescript
- vite
Log in or sign up for Devpost to join the conversation.