Task prompt · Websites & Apps
Clone a UI flow from a screen recording
by Agent Yard TeamGemini turns an app screen recording into a step-by-step UI spec and starter code.
You'll attach
Needs video
Works with
GeminiUse cases
- Gemini turns an app screen recording into a step-by-step UI spec and starter code.
- When you already have a video and want the AI to work from it instead of starting from scratch.
- Reuse it as often as you like: fill in the blanks (react, swiftui or flutter; product name) with new details and copy again.
- With Gemini, the AIs that support what this prompt needs.
Featured in: Best Gemini prompts for analyzing videos.
How to use it
- Open Gemini (gemini.google.com or Google AI Studio). Of the major assistants, it is the one that can watch an uploaded video.
- Upload the video file (or paste a YouTube link where the prompt allows). Shorter clips give more precise results.
- Fill in the highlighted blanks ([REACT, SWIFTUI OR FLUTTER], [PRODUCT NAME]) below, or edit them after pasting.
- Copy the prompt, paste it into the chat and send.
- Paste the result into Cursor or Claude Code to keep building.
Fill in the blanks (optional)
Prompt
The attached video is a screen recording of an app flow. Recreate it. 1. List every screen in order with a timestamp, its components, and what triggers the next screen. 2. Note animations and transitions with durations you estimate. 3. Write starter code for the flow in [REACT, SWIFTUI OR FLUTTER], one component per screen, with navigation wired up and placeholder data. 4. Use my product's name [PRODUCT NAME] instead of any brand in the video.
One email a week
The Weekly is presented byyour brandSponsored · openThe best new prompts and personas, nothing else.
