modern-short-video

用途：使用 Remotion 与 React 制作现代化产品发布/路演短视频，适用于 App 推广、SaaS 发布、产品演示与创业 pitch 视频。\n\n前置要求（强制）：必须先加载 /remotion-best-practices，阅读其 SKILL.md，并识别与产品相关的规则（地图、图表、文字动画、3D、lottie 等）。跳过此步会缺少丰富表现手法。\n\n工作流：1) 分析产品并选择丰富表现，尽量用动态内容替代静态截图（地图 App→动画地图路线绘制，仪表盘→动画图表，文字 App→打字机效果），并读取对应规则文件；2) 通过 AskUserQuestion 询问设备类型（SP 用手机样机、PC 用浏览器/桌面样机）、截图主题（深色推荐、浅色对比更高）与 BGM（可从 Pixabay 下载免费音乐）；3) 收集截图，放入 public/：mockup.png（必需）、feature-1.png（必需）、feature-2/3.png（可选）；使用丰富表现场景无需截图；4) 收集内容：产品名、一句话标语、各功能标题与简介、CTA 文案、URL；5) 用 ls public/*.png 校验素材；6) 创建 src/remotion/[ProductName]/[ProductName]Intro.tsx；7) 在 Root.tsx 注册并正确计算时长：durationInFrames = 各场景时长之和 -（转场时长 × 转场数量），详见 rules/duration-calculation.md；8) 用 pnpm run dev（或 bun run remotion）预览测试。\n\n场景结构（8 幕，总时长 15-25 秒）：Reveal（2-3s）、Concept（3-4s）、Mockups（3-4s）、Feature 1-3（各 3-4s，可选）、Outro（2-3s）、CTA（3-4s）。使用 TransitionSeries 组织。\n\n设计规则：背景用纯深色 #0a0a0a，不用渐变；单一字体（Inter/Noto Sans JP）；动画用轻微淡入/滑动，不用弹跳闪烁；样机用真实截图或丰富表现；文字精简清晰。\n\n限制：依赖 Remotion 与 React 环境；必须完成前置技能加载；交付前需检查时长、无末尾黑帧、转场 15 帧淡入淡出、CTA 与 URL 清晰可见；BGM 为可选项，音量约 0.25。