AI Use Case Explainer

Use {{tool}} for X across three cases. Swap the cases array (for/desc/image), tool name, outro CTA and accent.

Type: Video
Format: 1080×1920
Orientation: Portrait
Duration: 17.2s
Scenes: 5
Render cost: $0.0043 / render

VariablesData-driven repeat

Free template · opens in the editor, no account required.

Customize AI Use Case Explainer

AI Use Case Explainer is a ready-to-render AI startup video design formatted for 1080×1920 with 5 scenes and support for variables, data-driven repeat. Open it in the editor to replace its copy and media, then render variations through the Zvid API.

10 variables: Every value below is a variable you can override — send them in the variables field of the render request (or edit them in the editor) to generate on-brand versions at scale.

toolNameText

COPILOT X

kickerText

3 WAYS TO USE IT

hookLeadText

Use

hookTailText

for everything.

outroTitleText

One tool. Every workflow.

ctaTextText

Get COPILOT X free

ctaHandleText

copilotx.ai

accentColorColor

#FF4FA3

casesList · 3

numUSE 01

forWriting

descDraft emails, posts and docs in your voice — then polish in one tap.

imagephoto-1522071820081-009f0129c71c

numUSE 02

forResearch

descAsk a question, get sourced answers pulled from the whole web in seconds.

imagepexels-photo-9665181.jpeg

numUSE 03

forCoding

descDescribe a feature and watch it write, test and ship the code for you.

imagephoto-1614741118887-7a4ee193a5fa

musicUrlMedia URL

audio_3f375fdf97.mp3

The exact JSON payload

This is the full render config — POST it to the API, or open it in the editor to tweak.

Open in editor ↗

{
  "name": "ai-use-case",
  "resolution": "instagram-reel",
  "frameRate": 30,
  "backgroundColor": "#0C0710",
  "outputFormat": "mp4",
  "scenes": [
    {
      "id": "hook",
      "duration": 3.6,
      "backgroundColor": "#0C0710",
      "transition": "slideleft",
      "transitionId": "case",
      "transitionDuration": 0.45,
      "visuals": [
        {
          "type": "SVG",
          "svg": "<svg width='1080' height='1920' viewBox='0 0 1080 1920' xmlns='http://www.w3.org/2000/svg'><defs><radialGradient id='ucHook' cx='0.5' cy='0.4' r='0.95'><stop offset='0' stop-color='#1E0A19'/><stop offset='1' stop-color='#0C0710'/></radialGradient></defs><rect width='1080' height='1920' fill='url(#ucHook)'/><circle cx='860' cy='420' r='260' fill='rgba(255,79,163,0.1)'/><circle cx='230' cy='1500' r='200' fill='rgba(255,79,163,0.08)'/><path d='M90 1080 H360' stroke='#FF4FA3' stroke-width='6' stroke-linecap='round'/></svg>",
          "width": 1080,
          "height": 1920,
          "exitEnd": 3.6
        },
        {
          "type": "TEXT",
          "html": "<div style='display:inline-block; border:1.5px solid rgba(255,79,163,0.6); color:#FF4FA3; border-radius:999px; padding:14px 32px; font-size:23px; font-weight:800; letter-spacing:5px;'>{{kicker}}</div>",
          "x": 90,
          "y": 320,
          "anchor": "top-left",
          "track": 1,
          "enterBegin": 0.2,
          "enterEnd": 0.6,
          "exitEnd": 3.6,
          "enterAnimation": "fade",
          "style": {
            "fontFamily": "Sora"
          }
        },
        {
          "type": "TEXT",
          "html": "<div style='color:#FFFFFF; font-size:96px; line-height:1; font-weight:800; letter-spacing:-3px;'>{{hookLead}}<br><span style='color:{{accentColor}};'>{{toolName}}</span><br>{{hookTail}}</div>",
          "width": 920,
          "x": 90,
          "y": 771,
          "anchor": "top-left",
          "track": 2,
          "enterBegin": 0.45,
          "enterEnd": 0.95,
          "exitEnd": 3.6,
          "enterAnimation": "smoothup",
          "style": {
            "fontFamily": "Sora"
          }
        }
      ]
    },
    {
      "id": "case",
      "duration": 3.8,
      "backgroundColor": "#0C0710",
      "transition": "slideleft",
      "transitionId": "outro",
      "transitionDuration": 0.45,
      "visuals": [
        {
          "type": "IMAGE",
          "src": "{{c.image}}",
          "width": 900,
          "height": 900,
          "x": 540,
          "y": 560,
          "anchor": "center-center",
          "resize": "cover",
          "track": 1,
          "enterEnd": 0.5,
          "exitEnd": 3.8,
          "enterAnimation": "smoothright",
          "radius": {
            "tl": 40,
            "tr": 40,
            "bl": 40,
            "br": 40
          },
          "zoom": true
        },
        {
          "type": "SVG",
          "svg": "<svg width='1080' height='1920' viewBox='0 0 1080 1920' xmlns='http://www.w3.org/2000/svg'><defs><linearGradient id='ucCase' x1='0' y1='0' x2='0' y2='1'><stop offset='0' stop-color='#0C0710'/><stop offset='0.55' stop-color='#150A12'/><stop offset='1' stop-color='#0C0710'/></linearGradient></defs><rect width='1080' height='1920' fill='url(#ucCase)'/></svg>",
          "width": 1080,
          "height": 1920,
          "exitEnd": 3.8
        },
        {
          "type": "TEXT",
          "html": "<div style='display:inline-block; background:{{accentColor}}; color:#0C0710; border-radius:8px; padding:8px 22px; font-size:22px; font-weight:800; letter-spacing:3px;'>{{c.num}}</div>",
          "x": 150,
          "y": 1170,
          "anchor": "top-left",
          "track": 3,
          "enterBegin": 0.35,
          "enterEnd": 0.75,
          "exitEnd": 3.8,
          "enterAnimation": "smoothleft",
          "style": {
            "fontFamily": "Manrope"
          }
        },
        {
          "type": "TEXT",
          "html": "<div style='color:#FFFFFF; font-size:76px; line-height:1; font-weight:800; letter-spacing:-2px;'>{{c.for}}</div><div style='margin-top:22px; color:#CBB4C4; font-size:33px; line-height:1.45; font-weight:500; font-family:Manrope, sans-serif;'>{{c.desc}}</div>",
          "width": 780,
          "x": 150,
          "y": 1250,
          "anchor": "top-left",
          "track": 4,
          "enterBegin": 0.5,
          "enterEnd": 0.95,
          "exitEnd": 3.8,
          "enterAnimation": "smoothup",
          "style": {
            "fontFamily": "Sora"
          }
        },
        {
          "type": "TEXT",
          "html": "<div style='color:rgba(255,255,255,0.55); font-size:24px; font-weight:800; letter-spacing:5px;'>{{toolName}}</div>",
          "x": 540,
          "y": 130,
          "anchor": "center-center",
          "track": 2,
          "exitEnd": 3.8,
          "style": {
            "fontFamily": "Sora"
          }
        }
      ],
      "iterate": "cases",
      "iterateAs": "c"
    },
    {
      "id": "outro",
      "duration": 4,
      "backgroundColor": "#0C0710",
      "visuals": [
        {
          "type": "SVG",
          "svg": "<svg width='1080' height='1920' viewBox='0 0 1080 1920' xmlns='http://www.w3.org/2000/svg'><defs><radialGradient id='ucEnd' cx='0.5' cy='0.4' r='0.9'><stop offset='0' stop-color='#22091B'/><stop offset='1' stop-color='#0C0710'/></radialGradient></defs><rect width='1080' height='1920' fill='url(#ucEnd)'/><circle cx='540' cy='620' r='150' fill='none' stroke='rgba(255,79,163,0.8)' stroke-width='2.5'/><circle cx='540' cy='620' r='60' fill='#FF4FA3'/><circle cx='430' cy='500' r='16' fill='rgba(255,79,163,0.7)'/><circle cx='660' cy='740' r='16' fill='rgba(255,79,163,0.7)'/></svg>",
          "width": 1080,
          "height": 1920,
          "exitEnd": 4
        },
        {
          "type": "TEXT",
          "html": "<div style='text-align:center; color:#FFFFFF; font-size:78px; line-height:1.05; font-weight:800; letter-spacing:-2px;'>{{outroTitle}}</div>",
          "width": 920,
          "x": 540,
          "y": 900,
          "anchor": "top-center",
          "track": 1,
          "enterBegin": 0.25,
          "enterEnd": 0.7,
          "exitEnd": 4,
          "enterAnimation": "smoothup",
          "style": {
            "fontFamily": "Sora"
          }
        },
        {
          "type": "TEXT",
          "html": "<div style='display:inline-block; background:{{accentColor}}; color:#0C0710; border-radius:999px; padding:26px 64px; font-size:38px; font-weight:800;'>{{ctaText}}</div>",
          "x": 540,
          "y": 1180,
          "anchor": "top-center",
          "track": 2,
          "enterBegin": 0.7,
          "enterEnd": 1.15,
          "exitEnd": 4,
          "enterAnimation": "circleopen",
          "style": {
            "fontFamily": "Sora"
          }
        },
        {
          "type": "TEXT",
          "html": "<div style='text-align:center; color:#9C7E91; font-size:27px; font-weight:600; letter-spacing:2px;'>{{ctaHandle}}</div>",
          "x": 540,
          "y": 1340,
          "anchor": "top-center",
          "track": 3,
          "enterBegin": 1,
          "enterEnd": 1.4,
          "exitEnd": 4,
          "enterAnimation": "fade",
          "style": {
            "fontFamily": "Manrope"
          }
        }
      ]
    }
  ],
  "audios": [
    {
      "src": "{{musicUrl}}",
      "volume": 0.16
    }
  ],
  "variables": {
    "toolName": "COPILOT X",
    "kicker": "3 WAYS TO USE IT",
    "hookLead": "Use",
    "hookTail": "for everything.",
    "outroTitle": "One tool. Every workflow.",
    "ctaText": "Get COPILOT X free",
    "ctaHandle": "copilotx.ai",
    "accentColor": "#FF4FA3",
    "cases": [
      {
        "num": "USE 01",
        "for": "Writing",
        "desc": "Draft emails, posts and docs in your voice — then polish in one tap.",
        "image": "https://images.unsplash.com/photo-1522071820081-009f0129c71c?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w3MDgwMTZ8MHwxfHNlYXJjaHwxfHxtb2Rlcm4lMjBzdGFydHVwJTIwb2ZmaWNlJTIwdGVhbXxlbnwwfHx8fDE3ODMyNjg1NDV8MA&ixlib=rb-4.1.0&q=80&w=1080"
      },
      {
        "num": "USE 02",
        "for": "Research",
        "desc": "Ask a question, get sourced answers pulled from the whole web in seconds.",
        "image": "https://images.pexels.com/photos/9665181/pexels-photo-9665181.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940"
      },
      {
        "num": "USE 03",
        "for": "Coding",
        "desc": "Describe a feature and watch it write, test and ship the code for you.",
        "image": "https://images.unsplash.com/photo-1614741118887-7a4ee193a5fa?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w3MDgwMTZ8MHwxfHNlYXJjaHw4fHxwcm9ncmFtbWluZyUyMGNvZGUlMjBzY3JlZW4lMjBkZXZlbG9wZXJ8ZW58MHx8fHwxNzgzMjY4NTM4fDA&ixlib=rb-4.1.0&q=80&w=1080"
      }
    ],
    "musicUrl": "https://cdn.pixabay.com/audio/2026/02/24/audio_3f375fdf97.mp3"
  }
}

More AI startup templates

AI Agent Daily Recap

AI Agent Daily Recap

AI startup$0.00415

AI Model Comparison

AI Model Comparison

AI startup$0.00302

Daily AI Tip Card

Daily AI Tip Card

AI startup$0.0027

AI Marketplace Preview

AI Marketplace Preview

AI startup$0.004

Model Update Announcement

Model Update Announcement

AI startup$0.00415

AI App Onboarding

AI App Onboarding

AI startup$0.00505

AI Prompt Result Showcase

AI Prompt Result Showcase

AI startup$0.00309

AI Report Summary

AI Report Summary

AI startup$0.00435

Generated Result Gallery

Generated Result Gallery

AI startup$0.00478

AI Generated Result Video

AI Generated Result Video

AI startup$0.00298

Ready to ship video at scale?

Start free — your first render is only a JSON payload away.

Explore the API ↗