skills.rest
matthiasn
matthiasnCOMMUNITY
Explore all skills by this author →
Website𝕏@matthiasnehlsenGitHub

tutorial-videos

Builds, debugs, localizes, and publishes automated tutorial videos recorded from the real Linux app.

1.2k|117|Updated Mar 16, 2016
Search Tags:#flutter#Cloudflare R2#xvfb#Screen Recording#TTS narration#OpenMontage#tutorial videos
One-click install
npx skills add https://github.com/matthiasn/lotti --skill tutorial-videos
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: tutorial-videos
Source: https://github.com/matthiasn/lotti/tree/main/.claude/skills/tutorial-videos
Command: npx skills add https://github.com/matthiasn/lotti --skill tutorial-videos

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill requires boto3, pyyaml.

What problem does it solve?

Producing narrated, localized product tutorial videos normally requires manual screen recording, voiceover work, and video editing for every locale and device form factor. This Skill automates the entire pipeline: it drives the real Lotti Linux app under Xvfb with a virtual microphone and live transcription, records the screen, narrates steps with Gemini TTS, fast-forwards waits, composes MP4s via OpenMontage, and uploads results to Cloudflare R2 for docs-site embedding.

Core Features & Use Cases

  • Automated video builds: Run make targets to generate tutorial MP4s per locale and per device form factor (desktop or mobile), with TTS narration, cursor glide, HUD clock, and fast-forwarded waits.
  • Scenario and locale authoring: Add new tutorial scenarios as YAML configs plus Flutter integration tests, and add locales with per-language narration, voice styles, and dictation text.
  • Debugging and publishing: Diagnose failing runs via failure screenshots and diagnostics output, then publish finished videos to Cloudflare R2 with the correct r2.dev URLs for the docs-site TutorialVideo component.
  • Use Case: A maintainer needs a German mobile version of the create-task-from-audio tutorial. They run the build with TUTORIAL_LOCALE=de and TUTORIAL_DEVICE=mobile, verify frames with ffmpeg, then publish to R2 with the matching device flag.

Quick Start

Ask the agent to build the tutorial video for a specific scenario and locale, for example: build the create_task_from_audio tutorial video in German for desktop.

Frequently Asked Questions about tutorial-videos

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build an automated tutorial video for a Flutter app?▼

Run make tutorial_video with TUTORIAL_LOCALE set, optionally adding TUTORIAL_DEVICE=mobile for a phone-shaped window. The pipeline records the real app under Xvfb via flutter drive, narrates steps with Gemini TTS, fast-forwards waits, and composes the MP4 through OpenMontage.

How do I add a new locale to the tutorial video pipeline?▼

Add the locale's title, dictionary, narration, and dictation text to the scenario YAML, add per-stream style lines in config/voices.yaml, then run the validate command before building. The app UI localizes itself through the LOTTI_MANUAL_LOCALE settings row.

Why does a tutorial video run fail or time out?▼

Check the failure screenshot captured at the moment of timeout first, since it usually explains the issue. Common causes are finders matching offstage duplicates, non-vertical scrollables, blocking modals, the agent's automaticUpdatesEnabled flag not sticking, or cloud latency exceeding pumpUntil timeouts.

Can I publish tutorial videos to Cloudflare R2?▼

Yes, run make tutorial_video_publish with matching TUTORIAL_SCENARIO, TUTORIAL_LOCALE, and TUTORIAL_DEVICE values. It uploads the MP4 to the tutorial-videos bucket key and prints the public r2.dev URL used by the docs-site TutorialVideo component; boto3 must be available in the Python environment.

What are the limitations of the tutorial video pipeline?▼

It requires Linux with Xvfb, ffmpeg, pactl, and fvm Flutter, plus a sibling OpenMontage checkout at a pinned commit and API keys in .env. Tests must use flutter drive rather than flutter test, GDK_BACKEND=x11, and Voxtral prompts in the audio's language.

Related Skills

Explore More Software Engineering Skills→
lovon-speclovon-spec
2

recording-e2e

Automate end-to-end validation of display recording and replay pipelines.

Community
Advanced
huangzidahuangzida

vitepress

Generate static Vue-powered documentation sites from Markdown with routing and theming.

Community
Intermediate
Yemomo511Yemomo511
2

flutter-setup-localization

Configure Flutter localization dependencies and l10n.yaml for new projects.

Community
Basic
phoenicisfphoenicisf

ui-demo

Record polished UI demo videos of web applications using Playwright.

Community
Advanced