SaaS onboarding video series generation from product documentation

Introduction Your product documentation gets updated weekly.

Your onboarding videos get updated never. That gap costs you real money: support tickets pile up, trial users bounce without understanding your core features, and your product team wastes time answering the same questions in Slack. The problem isn't lack of intent. Your team knows videos drive engagement and reduce churn. The bottleneck is production. Recording, editing, and publishing a single onboarding video takes 4-6 hours of specialist time. When you ship a feature, the last thing anyone wants is another project: book studio time, brief a presenter, wait for editing. So the docs get updated and the videos don't. What if your documentation could automatically become video? Not generic text-to-speech nonsense, but proper onboarding videos with a professional presenter, narration, and visual polish, generated in minutes rather than weeks. That workflow exists now. This piece shows you how to wire it together.

The Automated Workflow The end-to-end system works like this: your product documentation triggers a workflow, which extracts and structures the content, generates a script and UI mockups, synthesises professional narration, composes them into video, and publishes the result.

No human touches the project after the initial setup. Why this stack, why these tools ElevenLabs handles voice synthesis; Hour One turns that voice and a script into video with a virtual presenter; v0 generates polished UI visuals from text descriptions; and an orchestration layer ties it all together. You pick the orchestration tool based on your existing infrastructure. If you're already deep in Zapier, stick there. If you run self-hosted workflows, use n8n. For tighter integration with your own backend, Make or custom code via Claude Code works better. Setting up the trigger Your documentation lives somewhere: GitHub, Notion, Confluence, a custom CMS. You need a webhook that fires when content updates. For GitHub, create a workflow file that triggers on pushes to documentation:

Copyyaml
name: Video Generation Trigger
on: push: paths: - 'docs/onboarding/**'
jobs: trigger-workflow: runs-on: ubuntu-latest steps: - name: Call orchestration webhook run: | curl -X POST https://your-orchestration-endpoint.com/trigger \ -H "Content-Type: application/json" \ -d '{ "doc_path": "${{ github.event.head_commit.modified[0] }}", "doc_content": "${{ env.DOC_CONTENT }}", "timestamp": "'$(date -u +'%Y-%m-%dT%H:%M:%SZ')'", "repo": "main-product-docs" }'

For Notion or Confluence, use their native webhooks or set up a polling trigger via your orchestration tool that checks for changes every 6 hours.

Step 1: Content extraction and script generation

Once the workflow starts, you need to convert raw documentation into a video script. This is where Claude Opus 4.6 shines. It understands context, can restructure dense technical writing into conversational narration, and maintains accuracy. Use this approach with your orchestration tool:

Copyjson
{ "model": "claude-opus-4.6", "max_tokens": 2000, "messages": [ { "role": "user", "content": "Convert this product documentation into a 90-second onboarding video script. The script should be conversational, explain the feature in plain English, include a clear call-to-action at the end, and note where visual transitions should happen (marked as [VISUAL: description]). Documentation:\n\n${doc_content}" } ]
}

Store the output script in a variable for the next step.

Step 2: UI mockup generation

While the script is being generated, run v0 in parallel to create visual assets. v0 takes a text description of what the UI should show and generates actual component code and mockups. Call v0 with a prompt like this:

CopyGenerate a Vercel UI component showing the ${feature_name} interface. The component should match this description: ${visual_description_from_script}. Return production-ready React code with Tailwind CSS. Include interactive elements that match the feature's actual functionality.

v0 outputs React component code. You have two options: render it directly in a headless browser to capture screenshots, or use its built-in image output if you're on the Pro plan.

Step 3: Voice synthesis

Feed the generated script to ElevenLabs Turbo v2.5. This is where the production quality jumps. ElevenLabs' voices are natural, with proper pacing and emotion.

CopyPOST https://api.elevenlabs.io/v1/text-to-speech/{voice_id} { "text": "${generated_script}", "model_id": "eleven_turbo_v2_5", "voice_settings": { "stability": 0.5, "similarity_boost": 0.75 }
}

Store the returned audio file URL.

Step 4: Video composition

Hour One takes a script, voice track, and visual assets, then assembles them into a finished video with a virtual presenter. You provide a JSON payload describing the video structure:

Copyjson
{ "script": "${generated_script}", "audio_url": "${elevenlabs_audio_url}", "presenter": "professional-presenter-1", "visuals": [ { "type": "ui_screenshot", "url": "${v0_rendered_screenshot_url}", "start_time": 0, "duration": 30 }, { "type": "ui_screenshot", "url": "${second_ui_screenshot_url}", "start_time": 30, "duration": 45 } ], "branding": { "logo_url": "https://your-domain.com/logo.png", "accent_colour": "#0066FF" }
}

Hour One returns a video file. Depending on your plan, this takes 5–15 minutes.

Step 5: Upload and publish

Once the video is ready, upload it to your video host (YouTube, Vimeo, or your own CDN) and update your documentation page with an embedded player. Here's a sample n8n workflow structure to orchestrate all this:

CopyWebhook Trigger ↓
Claude Script Generation ↓
Parallel: [v0 UI Generation | Wait for Claude] ↓
ElevenLabs Voice Synthesis ↓
Hour One Video Composition ↓
YouTube Upload (via API) ↓
Slack Notification (success/failure)

In n8n, set up error handlers at each step. If Claude fails, retry with a fallback prompt. If ElevenLabs hits rate limits, queue the job. If Hour One times out, log it and send an alert to your Slack channel rather than silently failing. Connecting the pieces in n8n or Make Use HTTP request nodes to call each API in sequence. Store outputs in variables and pass them forward. For ElevenLabs and Hour One, both have native n8n nodes, so use those instead of raw HTTP calls; they handle authentication and retries automatically. Here's pseudocode for the n8n workflow:

Copy1. Webhook (receives doc_content)
2. HTTP Node: POST to Claude API, pass doc_content
3. Set Variable: script = response.content[0].text
4. HTTP Node: POST to v0 API with visual prompt
5. Wait Node: 60 seconds (let v0 render)
6. HTTP Node: GET rendered screenshot from v0
7. Set Variable: ui_url = screenshot_url
8. ElevenLabs Node: synthesise script to audio
9. Set Variable: audio_url = response.audio_url
10. Hour One Node: compose video with script, audio, ui_url
11. Set Variable: video_id = response.video_id
12. HTTP Node: POST video_id to your CMS/docs webhook
13. Slack Node: send success message with video link

If any node fails, attach an error handler that logs to your database and posts to Slack so you notice it immediately.

The Manual Alternative Not everything needs automation.

If you're updating documentation once every two weeks, or if you want tighter creative control over each video, a semi-automated approach works better. Use the same tools, but manually trigger the workflow and review the generated script before it goes to voice synthesis. Claude Opus 4.6 will generate a solid script, but you might want to adjust tone, add specific product terminology, or include company-specific messaging. Build in a review step: the script lands in a Google Doc or Notion page, your team reviews it for 24 hours, then a manual button click sends it forward. This trades some efficiency for safety and control, which makes sense when you're building brand voice and don't want inconsistencies in your onboarding narrative.

Pro Tips

1. Plan for rate limits and quotas

ElevenLabs allows 10,000 characters per month on the free tier. Hour One's API limits depend on your plan. Set up proper queuing in n8n: if you hit a limit, the job waits 60 seconds then retries, rather than failing outright. Monitor your usage weekly so you catch quota issues before they block production.

2. Version your generated assets

Every video should be tagged with the documentation version it was generated from. If your docs change and the video becomes stale, you want to know which docs produced which video. Store metadata in your video host's description or in a simple database: { video_id, doc_version, generated_at, script_hash }.

3. A/B test presenter styles

Hour One supports multiple presenter options. Try a couple different presenters across your first batch of videos and track engagement. Some audiences prefer a more formal presenter, others connect better with casual styles. You can parameterise this in your workflow, so different feature categories get different presenters.

4. Cache v0 outputs

UI mockups for common patterns (login screens, dashboards, tables) don't change much. Cache the v0 output for 30 days. If the same visual description appears again, reuse the screenshot instead of regenerating.

5. Use Claude Sonnet 4.6 for cost-sensitive runs

Claude Opus 4.6 is more capable but also more expensive. For straightforward feature documentation with clear structure, Claude Sonnet 4.6 produces equally good scripts at roughly half the cost. Try Sonnet first; only upgrade to Opus if you get poor results on complex or highly technical features.

Cost Breakdown