Punyakrit · Launch Video Breakdown: Hook, Pacing & Motion Design
An indie-built AI product demo video generator: give it a silent screen recording, product site, and prompt, and it returns a narrated demo with captions and an AI host.
Scene-by-scene timeline & spoken transcript
The Hook
OpenWebSearch Launch & Problem Statement
“Hey everyone, today we're launching OpenWebSearch. The thing is, web search indexes are fragmented across tons of providers, and it's really messy to manage all those different structures and billing. So we built a unified gateway to bring them all into a single place. When you run a query, you get results back instantly.”
- On screen
- OpenWebSearch The unified gateway for web search All search indexes, one API key, one structured format and high availability.
- Camera
- Static full-screen browser capture with circular webcam overlay in bottom right corner.
- Motion
- UI element highlights with smooth browser page scrolling.
Product Reveal
Dynamic Query Execution and Unified JSON
“And it's super flexible. If we change this query from open source models to look up a specific person, like Garry Tan, the system processes it right away and pulls in structured summaries and links, keeping the experience pretty consistent across the board for any search. But the real magic is when you look at the raw data. Switching over to the JSON view, you can see exactly what the API returns.”
- On screen
- Garry Tan's LinkedIn Results JSON provider: perplexity
- Camera
- Static browser view centered on interactive demo component.
- Motion
- Tab switching between rendered results and formatted JSON view.
Feature Teaser
Code Integration and Provider Flexibility
“Looking at the code, it's as simple as that. You just make a standard fetch request to our endpoint, pass in your provider of choice, and you're good to go. Change the provider, not your integration as you scale. We also made it super easy to drop this into your AI workflows.”
- On screen
- Switch search without switching code fetch TypeScript Different indexes. Different strengths.
- Camera
- Downwards page scroll to code snippet and provider grid.
- Motion
- Dropdown menu expansion showing ChatGPT and Claude agent integration options.
Feature Teaser
Structured Web Extraction and Transparent Billing
“We also handle structured data extraction. So for example, you can extract a full webpage into structured JSON, which is perfect for deterministic tasks where you need high accuracy and precision. And for billing, you just buy credits once and spend them on any provider. Pricing is totally transparent, so you know exactly what you're paying per thousand requests.”
- On screen
- Extract full webpage Pricing by provider Start searching in three steps
- Camera
- Vertical scrolling through extraction card, schema layout, and pricing table.
- Motion
- Highlighted table rows displaying transparent multi-provider costs.
Call to Action
Dashboard, Docs, and Call to Action
“Our quickstart documentation walks you through the exact search request parameters you need. Because we use a hybrid Mixture-of-Architecture model, we can guarantee that unified response shape every single time... Inside the Interface platform, you manage everything in one place... Basically, OpenWebSearch gives you all search indexes, one API key, and one structured format. Try running a few searches yourself, check out the docs, and let us know what you think.”
- On screen
- OpenWebSearch API Unified response Interface Credits & Usage Try running a few searches yourself
- Camera
- Browser tab navigation across Docs, Interface Playground, API Keys, and back to main hero.
- Motion
- Cross-tab screen navigation and interactive dashboard display.
Motion design primitives
Synthesizable in Remotion · key components of the unified-screencast-walkthrough template.
WebcamOverlayPip
Rounded rectangle webcam feed pinned to the bottom-right corner with subtle border and drop shadow.
+ Code construction recipe
Absolute position div at bottom-right with rounded-2xl, border 1px solid rgba(255,255,255,0.1), housing Video component synchronized with main timeline.
JsonTreeViewer
Monospaced syntax-highlighted code block toggle displaying key-value pairs with smooth scroll.
+ Code construction recipe
Preformatted text component with inline regex syntax highlighting, toggled via spring-driven state transition.
ProviderDropdownMenu
Pop-up agent selector menu transitioning opacity and translateY on button trigger.
+ Code construction recipe
Container div animated using interpolate(frame, [0, 8], [0, 1]) for opacity and [10, 0] for translateY.
Style DNA & aesthetic system
Visual aesthetic
Typography
Motion
Special effects
Pacing & rhythm
Conceptual story rhythm
- 1
Problem Setup
Purpose. Explain fragmentation in search index APIs and billing.
Execution. Static view of OpenWebSearch hero banner.
- 2
Proof of Function
Purpose. Demonstrate instant multi-provider query normalization and schema output.
Execution. Typing query into live UI component and switching to JSON tab.
- 3
Developer Experience
Purpose. Show unified fetch code snippet and agent workflows.
Execution. Scroll down to code example card and open agent menu.
- 4
Business & Admin
Purpose. Validate transparent credit-based billing and dashboard controls.
Execution. Inspect pricing matrix and cycle through dashboard management tabs.
Remix in Animatiq Studio
Master remix prompt · agent-ready
Sample remix
Objective
Unified LLM Inference GatewayHow the recipe adapts
Replace search engine names with LLM providers like Anthropic, OpenAI, and Groq, demonstrating standard completion formats and single credit billing.Remix blueprint · unified-screencast-walkthrough
Scene durations (5 scenes, 60s)
Key Remotion components
Related AI Agents Product Launches
Explore all AI Agents launches →
To ensure that artificial general intelligence benefits all of humanity
Gopuff introduces Go, an AI shopping assistant built with SpaceXAI: say what you need and the order is placed.
Iliad (Troy) trailer made by Grok Imagine 1.5, which was just released