VibeShot Studio

Turn raw script ideas into structured video briefs, moodboards, and BSON-compatible storyboards in 60 seconds. Powered by Gemini & MongoDB MCP.

Comment

💡 Inspiration

Creating short-form video campaigns (TikTok, Instagram Reels, YouTube Shorts) is highly lucrative, yet creative directors and video strategists spend hours manually drafting scripts, finding visual references, and aligning scene frames. We wanted to build an agentic engine room that turns raw, messy script ideas into crystal-clear production briefs, moodboards, and interactive storyboards in under 60 seconds.

⚙️ What it does

VibeShot Studio is a premium, glassmorphic storyboard orchestrator. Here is how it works:

  1. Choose Your AI Engine Mode: Users select Hybrid Strategist (blends USP inputs with manual pacing) or Instant Clone Engine (clones the structural pacing of any viral YouTube video).
  2. AI Brief Orchestration: Powered by Gemini 3.5 Flash, the system digests multimodal inputs (text descriptions, YouTube URLs, or visual screenshots) to compile concept narrative premises and storyboard timelines.
  3. Multi-Model Image Generation: Generates 9:16 storyboard frames massal (or individually) using FLUX Schnell/Dev, Recraft V4 Pro, or Ideogram V3 via Fal.ai.
  4. Export & Share: Storyboards can be shared instantly via links or exported as PPTX slide decks & spreadsheets.
  5. Web3 & Database Integration: Features a Web3 sub-dashboard connecting Solana wallets and converting relational storyboards into structured BSON/JSON formats optimized for Google Cloud Agent Builder and MongoDB MCP Server.

🛠️ How we built it

We chose a modern, high-performance web stack:

  • Runtime & Meta-Framework: Bun runtime, React, and TanStack Start (TS/Vite).
  • Backend & Storage: Supabase (PostgreSQL with RLS policies) for Auth and campaign briefs database.
  • Edge Deployment: Cloudflare Workers for processing billing checkouts, YouTube transcripts, and Gemini prompts.
  • APIs & Integrations: Fal.ai (FLUX & Recraft), RapidAPI SMVD (Social Video Scraper), Stripe (international payments), and Mayar (IDN local checkout).
  • Product Telemetry: Pendo SDK and Novus.ai for real-time user interaction mapping.

🚧 Challenges we faced

  • Cloudflare CPU limits & ReDoS: Dealing with heavy base64 images on Cloudflare edge workers initially caused CPU limit overruns (10ms limit) and ReDoS risks. We resolved this by building a custom, non-backtracking, memory-efficient data URL parser helper.
  • API Cost Scaling: High-quality AI image generation and search grounding are expensive. To prevent financial drain, we implemented a dual-layer caching system (fast in-memory cache + Cloudflare Edge Cache API) and instituted user credits limits (400 credits for Pro, 1000 credits for Studio, 2000 credits for Agency) that align with our profit margins.

🎓 What we learned

We learned how to design robust, cost-aligned SaaS architectures, optimize LLM token limits through context compaction, and bridge relational database shapes into BSON document adaptors that are ready for next-gen agent builders and MCP networks.

Built With

  • bun
  • cloudflare-workers
  • fal.ai
  • gemini-api
  • mayar
  • mongodb-mcp
  • pendo-sdk
  • react
  • solana-web3
  • stripe
  • supabase
  • tanstack-start
  • typescript
  • vite
Share this project:

Updates