How to Wire a Real Smart Agent into Your App Demo Video Workflow

By the end of this tutorial, you’ll have a real AI agent wired into your app demo video workflow — from code and iOS Simulator flows all the way to finished…

Macro field of rivet heads symbolizing many small agent tools forming one app demo workflow.

By the end of this tutorial, you’ll have a real AI agent wired into your app demo video workflow — from code and iOS Simulator flows all the way to finished launch reels generated with Reely.

You’ll be able to:

  • Pick the right AI agent for app launch videos
  • Connect it via MCP or API to Reely and other tools
  • Let it orchestrate “build feature → build demo reel” in one workflow
  • Prompt it correctly, validate outputs, and keep a human in the loop for narration, pacing, and brand

Prerequisites

Before step 1, make sure you have:

  • macOS machine capable of running Xcode and Reely
  • Xcode + iOS Simulator installed and working with your app
  • Reely installed and licensed (paid Mac app, no free trial)
    – Download + install: getreely.co
    – Activate license in the app
  • Git repo for your iOS app (GitHub, GitLab, or local)
  • One supported AI agent, e.g.:
    – Claude Code, Cursor, Windsurf, VS Code + MCP client, Gemini CLI, Cline, OpenCode
  • Basic comfort with JSON and CLI (for MCP tool wiring)

Optional, but recommended:

  • A dedicated "demo" branch in your repo for App Store / Product Hunt assets
  • A simple Apple App Store preview spec checklist (15–30s, max 500 MB, 30 fps, device-specific)

Step 1: Choose the right AI agent for app launch videos

Goal: Select an AI agent that can both work with your code and orchestrate tools like Reely.

What you’re selecting for

You want an agent that:

  • Understands code and repos (reads your app, flows, and component names)
  • Supports tools via MCP or functions (Model Context Protocol or JSON-schema tools)
  • Keeps you in the loop with approval prompts before side effects

Today, solid choices for agent-first workflows include:

  • Claude Code / Cursor / Windsurf / Cline / OpenCode for dev-centric MCP tooling
  • VS Code with an MCP client for maximum flexibility
  • Gemini CLI or OpenAI Agents API if you prefer scriptable agents

These agents all follow the same pattern described in modern tool specs: models discover tools defined by JSON schema and call them automatically to access external systems.

Concrete selection checklist

Pick an agent that can answer "yes" to all of these:

  1. Can it attach to your repo?
    – Example: "Can you read this Xcode project and identify the main onboarding flow?"
  2. Can it call tools via MCP or functions?
    – Example: It supports tools defined with JSON schemas (MCP server or function calling).
  3. Does it allow human approval on tools?
    – MCP spec says there SHOULD always be a human in the loop for trust and safety.

If your current agent can’t call external tools, that’s the common failure here. Solve it first, or switch to an MCP-capable agent.

Step 2: Install Reely and connect it as an MCP tool

Goal: Make Reely discoverable and callable from inside your agent’s workflow.

2.1 Install and activate Reely

  1. Download Reely for macOS from getreely.co.
  2. Drag it into Applications and launch.
  3. Activate your license key inside Reely.
    – Reely is a paid Mac app; once licensed, recording, rendering, and exports are unlocked.

Common failure: forgetting to activate your license before wiring tools. Reely won’t record or render until the license is active.

2.2 Connect Reely to the iOS Simulator

  1. Open Xcode and run your app in the iOS Simulator.
  2. In Reely, confirm it detects the active simulator device.
    – You should see options to capture from that simulator.

Reely is built for local macOS + iOS Simulator workflows. No cloud uploads; all rendering is on-device.

Common failure: running the app on a physical device only. Reely’s automation works with the simulator; make sure you have it running.

2.3 Register Reely as an MCP tool

The exact commands depend on your MCP client, but the pattern is:

  1. Install the Reely MCP server (from Reely docs): npm install -g @reely/mcp-server reely-mcp-server --config ~/.config/reely-mcp.json
  2. Define tools in the MCP config with JSON schema, e.g.: { "tools": [ { "name": "generate_feature_teaser", "description": "Record an iOS Simulator flow and generate a 10–20s feature teaser in Reely.", "input_schema": { "type": "object", "properties": { "flow_name": { "type": "string" }, "entry_point": { "type": "string" }, "max_duration_seconds": { "type": "integer", "maximum": 20 } }, "required": ["flow_name", "entry_point"] } }, { "name": "generate_launch_promo", "description": "Create a 30–60s launch promo reel in Reely from a defined multi-scene script.", "input_schema": { "type": "object", "properties": { "script_markdown": { "type": "string" }, "target_duration_seconds": { "type": "integer", "minimum": 30, "maximum": 60 } }, "required": ["script_markdown"] } } ] }
  3. Attach the MCP server to your agent (example: VS Code client config): { "servers": { "reely": { "url": "http://localhost:7777", "tools": ["generate_feature_teaser", "generate_launch_promo"] } } }

Now your agent can discover and call Reely’s tools automatically.

Common failure: leaving max_duration_seconds or spec constraints out of the schema. If you want App Store-compliant previews, those constraints are important (15–30 seconds, max 500 MB, 30 fps).

Step 3: Wire the agent to your repo and build artifacts

Goal: Let the agent see your app’s source of truth and use it to construct demo flows.

3.1 Attach the repo

  1. Open your project in the agent’s environment (e.g. Cursor workspace, Claude Code sandbox, VS Code folder).
  2. Confirm the agent can read files:
    • Ask: "List all SwiftUI views related to onboarding."
    • Ask: "Show the navigation flow from HomeView to SettingsView."

If it can’t, fix repo access first — that’s the blocking failure at this step.

3.2 Expose build and test tools

Use MCP or function tools for build/test commands, for example:

{
"name": "run_ci_build",
"description": "Run the CI build and tests for the iOS app.",
"input_schema": {
"type": "object",
"properties": {
"branch": { "type": "string" }
},
"required": ["branch"]
}
}

This allows flows like:

  1. Agent updates a feature branch.
  2. Calls run_ci_build.
  3. On success, calls generate_feature_teaser in Reely.

3.3 Connect build signals to demo generation

In a CI pipeline (GitHub Actions example):

jobs:
build-and-demo:
runs-on: macos-latest
steps:
- uses: actions/checkout@v4
- name: Run tests
run: xcodebuild -scheme MyApp -destination 'platform=iOS Simulator,name=iPhone 15' test
- name: Call agent to generate demo reel
run: node scripts/agent-generate-demo.js --branch ${{ github.ref }}

scripts/agent-generate-demo.js can:

  • Call your AI agent API
  • Pass branch, feature name, and desired reel type
  • Let the agent drive Reely via MCP to record simulator flows and render the reel

Common failure: triggering demo generation on failing builds. Add status checks so the agent only calls Reely after a successful CI run.

Step 4: Design the tools the agent will orchestrate (Reely + others)

Goal: Give the agent a clear set of tools for the whole pipeline: code → simulator flow → reel → export.

4.1 Core Reely tools

Design tools around Reely’s outputs:

  • Feature teaser (10–20s)
    – Single flow, one feature beat
    – Ideal for X / Product Hunt teasers
  • Launch promo (30–60s)
    – Multi-scene story: problem → solution → key flows → CTA

Example tools:

{
"name": "reely_record_flow",
"description": "Open the iOS Simulator, navigate through a named flow, and record raw footage.",
"input_schema": {
"type": "object",
"properties": {
"flow_name": { "type": "string" },
"start_route": { "type": "string" }
},
"required": ["flow_name", "start_route"]
}
}

{
"name": "reely_render_teaser",
"description": "Render a 10–20s feature teaser with kinetic typography and device choreography.",
"input_schema": {
"type": "object",
"properties": {
"recording_id": { "type": "string" },
"max_duration_seconds": { "type": "integer", "maximum": 20 },
"output_aspect": { "type": "string", "enum": ["9:16", "1:1", "16:9"] }
},
"required": ["recording_id", "output_aspect"]
}
}

Because Reely auto-removes dead air and handles editorial pacing, your agent doesn’t need to micro-manage cuts — it just needs to specify flows and outputs.

4.2 Brand and narration tools

Create tools for brand and text layers so you can keep a human-in-the-loop:

{
"name": "generate_narration_script",
"description": "Draft on-screen copy and optional voiceover script for a given feature or launch.",
"input_schema": {
"type": "object",
"properties": {
"feature_name": { "type": "string" },
"tone": { "type": "string" },
"max_words": { "type": "integer" }
},
"required": ["feature_name"]
}
}

You can then review and edit these scripts before Reely renders kinetic typography.

Common failure: mixing brand tooling into the same automatic path as build/test. Keep narration and brand tools gated by human approval.

Step 5: Prompt your agent like an incredible demo director

Goal: Give prompts that let the agent plan flows, call tools, and respect App Store and platform constraints.

5.1 Use structured, constraint-rich prompts

Instead of "make a demo video", use:

"You are an AI launch video generator orchestrating Reely for iOS app demos.
Read the repo and identify the new FocusTimer feature.
Plan a 15–20 second feature teaser for X and App Store compatible preview that:
  • Shows the main timer start/stop flow
  • Uses our brand voice: concise, confident, builder-first
  • Autoplay-safe: copy must work without audio
    Call tools to:
  1. Record the timer flow in the iOS Simulator.
  2. Draft on-screen copy (max 24 words total).
  3. Render a 9:16 feature teaser in Reely.
    Ask for my approval before final rendering and export."

This gives the agent:

  • Clear feature focus
  • Duration constraints
  • Brand voice
  • Required tools and sequence
  • Explicit human approval gate

5.2 Make App Store constraints explicit

Apple’s App Store preview spec is strict:

  • Max 3 previews per language
  • 15–30 seconds each
  • 30 fps max, 500 MB max per file
  • Must show in-app content only

Embed this into the prompt, e.g.:

"Ensure the final reel is 24–26 seconds, 30 fps max, and uses only footage from the iOS Simulator. No external footage or transparency overlays."

Common failure: vague prompts like "short demo" or "quick promo". These lead to scripts and cuts that don’t match platform limits and require heavy rework.

Step 6: Validate outputs like an incredible agent would

Goal: Apply systematic checks to the agent’s trace and outputs before you ship.

Modern agent guidance emphasizes trace grading: scoring an agent’s sequence of tool calls and responses for correctness and adherence. You can mirror that with a simple checklist.

6.1 Validate the tool trace

When your agent proposes a plan, check:

  • Did it read the relevant files (views, routes, config) before recording?
  • Did it call build/test tools and confirm success?
  • Did it call Reely tools with correct parameters (duration, aspect, flow name)?
  • Did it ask for human approval before final rendering and export?

If any of these are missing, send feedback:

"Revise the plan. Always run tests and get explicit human approval before final Reely render and export."

6.2 Validate the reel itself

For each output reel from Reely:

  • Duration: 10–20s for teasers, 30–60s for promos; 15–30s if App Store preview
  • File spec: 30 fps max, size under 500 MB, H.264 or ProRes 422 HQ
  • Story: clear feature beat and CTA (for promos: problem → solution → flows → CTA)
  • Brand: matches brand voice and visual theme-from-app (Reely can infer colors from UI)
  • Copy: readable in autoplay-muted environments; no jargon that confuses non-devs

You can even codify these as another tool:

{
"name": "grade_demo_reel",
"description": "Assess a rendered reel against duration, spec, story, and brand criteria.",
"input_schema": {
"type": "object",
"properties": {
"reel_id": { "type": "string" },
"channel": { "type": "string", "enum": ["app_store", "product_hunt", "x"] }
},
"required": ["reel_id", "channel"]
}
}

Common failure: trusting the first reel. Even with Reely’s automatic dead-air removal and pacing, you still want at least one review pass focused on the story.

Step 7: Keep a human in the loop on narration, pacing, and brand

Goal: Combine agent-first automation with human judgment where it matters most.

MCP’s design guidance explicitly recommends a human in the loop for sensitive actions. In an app demo workflow, the sensitive parts are narration, pacing, brand voice, and final export.

7.1 Add approval gates in your agent config

Configure your agent client so:

  • All Reely render calls require human approval
  • All narration generation tools return drafts, not auto-applied text
  • Exports to App Store Connect / social are never automated

Many MCP clients support an "approval required" flag for tools with side effects. Use it for:

  • reely_render_teaser
  • reely_render_promo
  • Any upload_to_app_store-style tool

7.2 Create a simple review checklist

For every reel before you ship:

  • Narration: does on-screen copy feel like your brand?
    – Remember: App previews autoplay muted; copy carries the story.
  • Pacing: are beats clear, or rushed/dragging?
    – Reely auto-cuts dead air, but your eye decides if the rhythm fits.
  • Brand: is typography, device framing, and background aligned with your app?
    – Reely can do brand-theme-from-app; verify it matches your design system.
  • Channel fit: is aspect ratio and length right for X, App Store, Product Hunt, or YouTube Shorts?

Common failure: letting the agent publish directly to the App Store or social. Use the agent to draft and assemble, but keep shipping as a human decision.

Step 8: Orchestrate end-to-end: from code to finished reel

Goal: Put all the pieces together into a repeatable workflow.

Here’s a concrete example for a new feature launch.

8.1 Developer flow

  1. Implement FocusTimer feature on a branch: feature/focus-timer.
  2. Push code; CI runs and passes.
  3. CI calls agent-generate-demo.js.

8.2 Agent flow (inside agent-generate-demo.js)

The script passes this system prompt:

"You are an AI agent responsible for generating app demo videos via Reely.
The repo contains an iOS app. A new feature was merged on branch feature/focus-timer.
Your tasks:
  1. Identify the Focus Timer flow in the app.
  2. Plan a 20s feature teaser for X and App Store preview.
  3. Call tools to record the flow from the iOS Simulator.
  4. Draft on-screen copy for a muted autoplay preview (max 24 words).
  5. Ask for human approval on the script.
  6. After approval, call Reely to render 9:16 and 16:9 versions.
    Never upload directly to App Store Connect; output local files only."

The agent then:

  • Reads the repo, finds FocusTimerView
  • Calls reely_record_flow with flow_name="FocusTimer"
  • Calls generate_narration_script and presents it to you
  • After you edit/approve, calls reely_render_teaser for 9:16 and 16:9
  • Returns file paths for you to upload or schedule

That’s "promo from code in minutes" in practice: your agent built the feature, and now it builds the demo reel without you touching a timeline editor.

If you want to go deeper into choosing the right agent for this stack, see this related guide: finding the best AI agent for app launch videos: from real smart agent to world best.

FAQ: Troubleshooting your agent-driven Reely workflow

1. Why isn’t my agent seeing Reely’s tools?

Most often, the MCP server isn’t registered correctly.

Check:

  • Is the Reely MCP server running locally (e.g. on http://localhost:7777)?
  • Did you list Reely under servers in your MCP client config?
  • Do the tool names in the config match the ones you reference in prompts?

Restart the client after changes; many agents only discover tools at startup.

2. My reels are too long or don’t meet App Store preview constraints. What should I do?

Add explicit duration and spec constraints to both:

  • The tool schemas (e.g. max_duration_seconds with a 30-second maximum)
  • The prompts ("Generate a 24–26s reel, 30 fps max, under 500 MB")

Then add a validation step that checks duration and file properties before you accept a reel as "App Store ready".

3. The agent keeps choosing the wrong app flow for the demo. How can I fix that?

Be more concrete in your prompts and tooling:

  • Reference specific views and routes: "Use FocusTimerViewSessionSummaryView"
  • Add a tool parameter like start_route that maps directly to a known screen
  • Include short inline docs in your repo (e.g. docs/demo-flows.md) describing canonical demo paths

You can also have the agent propose 2–3 candidate flows and let you pick one before recording.

4. How do I keep my brand voice consistent across multiple reels?

Create reusable brand instructions:

  • A brand-voice.md file in your repo with tone, phrases, and banned words
  • A narration tool that always ingests brand-voice.md before generating scripts

Then always review and lightly edit copy before rendering. Reely will apply the brand theme visually (colors, UI-driven backgrounds), but words still benefit from human care.

5. Can this workflow stay fully local and private?

Yes. Reely renders locally on macOS and works with the iOS Simulator. If you:

  • Run your MCP server locally
  • Use a local agent client (e.g. VS Code with MCP)
  • Avoid cloud-based CI for sensitive builds

…then all footage, flows, and reels can stay on your machine. This aligns with Reely’s local-first, privacy-respecting stance.

With this setup, your app becomes the brand, your agent becomes the demo director, and Reely becomes the motion studio — all inside your existing build workflow.

← All posts