webconsulting-create-documentation

用途：端到端搭建产品文档系统，覆盖应用内帮助页、AI 生成插图、带旁白的 Remotion 产品演示视频，以及 GitHub README 的视觉化文档。

主要能力与流程：

1. 帮助页：在 src/app/(dashboard)/help/page.tsx 创建 React 组件，含可折叠分区、编号步骤、Tip 提示框、截图占位组件、目录锚点、FAQ，并嵌入渲染后的 MP4。写作面向低技术背景用户，使用 Tailwind v4 语法。
2. 插图：因浏览器自动截图不稳定，改用 GenerateImage 工具生成 AI 插图，放入 public/help/ 后在页面引用。
3. Remotion 视频：目录含 index.ts、Root.tsx、ProductTour.tsx；用 Composition 定义时长、fps、分辨率，场景用 useCurrentFrame、spring、interpolate 做动画，并叠加旁白字幕。推荐 7 个场景（约 75 秒），含 1.5 秒片头与 7 秒结尾卡；结尾卡用 qrcode.react 展示 4 个二维码。
4. TTS：ElevenLabs API（默认 Daniel 音色）或 macOS say 回退；可选 ffmpeg 转 MP3。
5. 音乐：可选 Suno AI 背景音乐。
6. 渲染：npm run remotion:render。

依赖安装：npm install remotion @remotion/cli @remotion/player；npm install qrcode.react；npm install -D tsx。需 Node.js 20+。ElevenLabs 密钥写入 .env 的 ELEVENLABS_API_KEY。

限制：ElevenLabs 免费额度约每月 1 万字符，完整旁白约 600 字符；Suno、ffmpeg 等为可选依赖；具体价格、平台支持与效果资料未提供。