用途:端到端搭建产品文档体系,包括应用内帮助页、AI 生成插图、带旁白的 Remotion 产品导览视频,以及 GitHub README 的视觉化文档。
主要能力:帮助页采用 React 组件,含可折叠分区、编号步骤、Tip 提示与截图占位;插图通过 GenerateImage 工具生成并放入 public/help/;视频用 Remotion 组合场景,配合 GSAP 风格动画(interpolate、spring、交错滑入)、旁白字幕、TTS 音频与背景音乐;结尾卡片用 qrcode.react 渲染二维码。
必要用法:需 Node.js 20+,安装 npm install remotion @remotion/cli @remotion/player、npm install qrcode.react、npm install -D tsx。可选 ElevenLabs API key(写入 .env 的 ELEVENLABS_API_KEY)、ffmpeg(brew install ffmpeg)、macOS say + afconvert 作为回退 TTS、Suno API key。渲染命令为 npm run remotion:render。默认语音为 Daniel(onwK4e9ZLuTAKqWW03F9),可在 scripts/generate-narration.ts 修改 VOICE_ID。
适用场景:为产品制作面向低技术背景用户的帮助文档与宣传导览视频,并同步到 README。
限制:ElevenLabs 免费额度约每月 10,000 字符,完整旁白约 600 字符;浏览器自动截图不可靠,故改用 AI 插图;具体价格、平台支持范围等资料暂未提供。