mcpField
R
remotion-resemble-ai

remotion-resemble-ai

github.com/resemble-ai创意与媒体9221 次安装40 周前更新
代码仓库

关于 remotion-resemble-ai

remotion-resemble-ai 是用于规划和制作 Remotion 动画视频的技能,面向教程、产品演示和社交推广等创作。它涵盖从调研、脚本、分镜到 Resemble.ai 配音及动画制作的流程。

主要功能

  1. 01视频制作分步流程
  2. 02受众与格式规划
  3. 03脚本和场景设计
  4. 04Resemble.ai 配音
  5. 05音频同步动画
  6. 06多种视频类型指导

适用场景

  1. 01制作教育解说视频
  2. 02演示 SaaS 产品操作
  3. 03制作产品发布短片
  4. 04制作社交媒体推广视频

安装

复制下面的命令,在终端中运行。

$npx skills add https://github.com/resemble-ai/remotion-resemble-skill --skill remotion-resemble-ai

安装后在 Claude Code 中输入/remotion-resemble-ai确认已加载。

包含的文件

除 SKILL.md 外,安装时一起下载的参考资料和脚本。

rules/
resemble-captions.md
resemble-remotion-integration.md
resemble-setup.md
resemble-streaming-tts.md
resemble-sync-tts.md
resemble-voices.md
visual-animations.md

详细介绍

适用场景

在用户想要创建以下内容时使用此技能:

  1. 教育教程视频 - 研究某个主题并制作动画讲解视频

    • 示例:“为三年级学生制作一个关于蝴蝶生命周期的教程”
  2. SaaS 演示视频 - 通过动画 UI 展示软件功能

    • 示例:“制作一个演示视频,展示如何使用 Notion 的数据库功能”
  3. 产品发布公告 - 使用动态图形制作营销视频

    • 示例:“制作一段发布视频,宣布我们的全新 AI 驱动搜索功能”
  4. 教程 / 操作演示视频 - 使用光标动画制作分步指南

    • 示例:“制作一个教程,展示如何在我们的应用中创建项目”
  5. 社交媒体宣传视频 - 用于广告的简短、有冲击力的动态文字视频

    • 示例:“为我们的健身应用制作一则 15 秒的 Instagram 广告”
  6. 应用 / 产品展示视频 - 将动态文字与悬浮 UI 模型相结合

    • 示例:“制作一段宣传视频,展示我们的加密货币交易平台界面”
  7. 落地页揭晓视频 - 采用设计工具美学并配以网页动画

    • 示例:“制作一段视频,展示我们全新的 SaaS 落地页设计”

视频制作工作流

所有类型的视频都遵循此流程:

1. UNDERSTAND → 2. RESEARCH → 3. SCRIPT → 4. SCENES → 5. AUDIO → 6. ANIMATE
第 1 步:了解需求

明确以下内容:

  • 视频类型: 教育教程、SaaS 演示、产品发布、教程 / 操作演示、社交媒体宣传、应用展示、落地页揭晓,还是 AI 讲解视频?
  • 目标受众: 年龄、专业水平、背景
  • 基调: 教育性、专业、活力十足、轻松、戏剧化、简约
  • 时长: 超短(5-15 秒)、短(30-60 秒)、中等(1-3 分钟)或长(3-5 分钟)
  • 格式: 宽屏 16:9(1920x1080)、正方形 1:1(1080x1080)或竖屏 9:16(1080x1920)
  • 视觉风格: 暗色戏剧化、柔和渐变、简洁极简或设计工具美学
第 2 步:研究(适用于教程和演示视频)

对于教育内容:

  • 搜索准确且最新的信息
  • 使用可靠来源(官方文档、教育网站)
  • 收集需要讲解的关键事实、统计数据或步骤

对于 SaaS 演示视频:

  • 探索产品,了解其功能
  • 截取屏幕截图或记录 UI 模式
  • 确定要演示的关键工作流
第 3 步:撰写脚本

在生成音频之前,先写出完整的配音稿。脚本结构会因视频类型而异(见下文)。

第 4 步:规划场景

将脚本拆分为视觉片段:

  • 每个场景对应一个关键概念或步骤
  • 记录每行内容对应的画面
  • 规划场景之间的过渡
第 5 步:生成音频

使用 Resemble.ai 生成配音(见下方设置说明)。

第 6 步:制作动画

构建 Remotion 合成,并制作与音频同步的动画。


视频类型:教育教程

目标: 针对特定受众水平,清晰地解释一个概念。

脚本结构
HOOK (5-10s)
"Have you ever wondered how a caterpillar becomes a butterfly?"

INTRODUCTION (10-15s)
Set context and preview what they'll learn.

BODY (main content, broken into 3-5 key points)
- Point 1: Explain with visual metaphor
- Point 2: Build on previous point
- Point 3: Add detail or example
- ...

RECAP (10-15s)
Summarize the key takeaways.

OUTRO (5s)
Call to action or closing thought.
适配受众
受众语言风格视觉内容
幼儿园至二年级非常简单、轻松,每句 5 个词鲜艳的色彩、可爱的角色、大型图形
三至五年级简单但信息丰富,使用类比清晰的图表、分步讲解、适中的节奏
六至八年级使用更多词汇,讲解因果关系图表、带标签的示意图、更快的节奏
高中及以上可使用专业术语,兼顾细节数据可视化、详细的图形
成人专业、简洁简洁设计、信息图表
教程动画模式
  • 逐步呈现: 随着旁白提及内容,淡入相应元素
  • 变形: 通过形状变换展示变化(毛毛虫 → 蝴蝶)
  • 示意图: 为标签添加动画,并用箭头指向各部分
  • 时间线: 进度条、步骤指示器
  • 对比: 并排展示并突出重点
场景规划示例
Script: "First, the butterfly lays tiny eggs on a leaf."

Scene 1:
- Visual: Leaf appears (slide in from bottom, spring animation)
- Visual: Small eggs fade in on leaf
- Timing: Sync "eggs" word with eggs appearing
- Duration: 4 seconds

视频类型:SaaS 操作演示

目标: 向用户展示如何在软件中完成一项任务。

脚本结构
HOOK (5-10s)
"Let me show you how to [accomplish goal] in [Product]."

CONTEXT (10s)
Why this feature matters, what problem it solves.

WALKTHROUGH (main content)
- Step 1: Navigate to X
- Step 2: Click on Y
- Step 3: Configure Z
- ...

RESULT (10s)
Show the outcome, the finished state.

OUTRO (5-10s)
Recap benefit, suggest next steps.
视觉元素
  • UI 模型图: 界面的风格化呈现
  • 光标动画: 动画指针移动到点击目标
  • 高亮: 为正在讨论的按钮/字段添加发光边框
  • 缩放效果: 聚焦于 UI 的特定区域
  • 标注: 指向 UI 元素的文本标签
演示动画模式
  • 光标移动: 平滑的贝塞尔曲线,点击前稍作停顿
  • 点击效果: 点击时出现涟漪或脉冲效果
  • 字段聚焦: 高亮边框,略微放大
  • 打字动画: 字符逐个显示在输入字段中
  • 转场: 在屏幕之间滑动或淡入淡出
  • 标注箭头: 动画显示,指向元素,然后淡出
场景规划示例
Script: "Click the blue 'New Database' button in the sidebar."

Scene:
- Visual: UI mockup of sidebar
- Animation: Cursor moves to button (0.8s ease-out)
- Animation: Button highlights with glow
- Animation: Click ripple effect
- Animation: New panel slides in from right
- Duration: 3 seconds

视频类型:产品发布公告

目标: 为新产品或功能营造期待感。

脚本结构
HOOK (5-10s)
Bold statement or question that grabs attention.

PROBLEM (10-15s)
What pain point does this solve?

SOLUTION REVEAL (10-15s)
Introduce the product/feature dramatically.

KEY FEATURES (20-40s)
3-5 punchy feature highlights with visuals.

SOCIAL PROOF (optional, 10s)
Stats, testimonials, or credibility markers.

CALL TO ACTION (5-10s)
What should viewers do next?
视觉风格
  • 醒目的排版: 大号文字、动态文字动画
  • 品牌色彩: 始终使用产品的配色方案
  • 图标和图形: 抽象形状、功能图标
  • 高能量: 更快的剪辑、动态运动
  • Logo 揭晓: 结尾处以动画展示 Logo
发布视频动画模式
  • 文字猛击: 文字带冲击感地砸入画面
  • 动态排版: 移动、缩放、旋转的文字
  • 数字递增动画: 数字逐步递增(用户数、收入等)
  • 图标序列: 功能图标以弹跳/弹簧效果依次出现
  • 渐变背景: 缓慢变化的颜色渐变
  • 粒子效果: 微妙的闪光、漂浮形状
  • Logo 揭晓: 放大、淡入或由多个部分组合而成
场景规划示例
Script: "Introducing Smart Search — find anything in milliseconds."

Scene:
- Visual: Dark background with gradient
- Animation: "Introducing" fades in (0.5s)
- Animation: "Smart Search" slams in large, bold (0.3s, with shake)
- Animation: Tagline types out below (typewriter, 1.5s)
- Animation: Search icon pulses
- Duration: 4 seconds

视频类型:教程/操作演示

目标: 通过清晰的逐步视觉引导,教用户完成一项任务。

脚本结构
INTRO (3-5s)
"Here's how to [accomplish goal] in [Product]."

STEP 1 (10-20s)
First action with clear visual demonstration.

STEP 2 (10-20s)
Second action, building on previous step.

STEP 3+ (10-20s each)
Continue through workflow...

SUCCESS STATE (5-10s)
Show completion, celebrate the outcome.

RECAP (optional, 5s)
Quick summary of what was accomplished.
视觉风格
  • 明亮、简洁的背景: 米白色(#fafafa)、奶油色或浅灰色
  • 完整的 UI 上下文: 展示完整界面,而不仅是局部片段
  • 进度指示器: 步骤导航、编号阶段(1 → 2 → 3)
  • 用光标引导: 光标平滑移动,引导观众视线
  • 成功庆祝效果: 绿色对勾、彩纸,或品牌风格的成功界面
  • 减少干扰: 聚焦于任务,避免装饰性元素
教程动画模式
  • 光标编排: 平滑的贝塞尔路径,点击前稍作停顿
  • 点击反馈: 点击时出现微妙的涟漪或高亮效果
  • 表单字段聚焦: 字段激活时边框发光
  • 打字模拟: 文本逐字显示在输入框中
  • 步骤转场: 在屏幕之间轻柔地交叉淡化或滑动
  • 进度更新: 面包屑导航/步骤指示器向前推进
  • 成功爆发效果: 对勾以弹跳效果放大显示,可选配彩纸效果
  • 面板显示: 侧边栏或下拉菜单平滑滑入
视觉元素
  • 面包屑导航: “← 1. 意图 → 2. 种子构想 → 3. 草图板”
  • 表单输入框: 占位文字、标签、验证状态
  • 按钮: 展示清晰的 CTA 按钮及悬停/激活状态
  • 侧边栏/面板: AI 建议、设置或工具面板
  • 成功界面: 全彩背景搭配图标和消息
场景规划示例
Script: "First, enter what your lesson is about."

Scene 1 - Setup (2s):
- Visual: Full app interface, light background
- Visual: Breadcrumb shows "2. Seed Idea" active
- Animation: Screen fades in

Scene 2 - Interaction (4s):
- Visual: Form with "Enter a concept or theme:" label
- Animation: Cursor moves to input field (0.6s ease-out)
- Animation: Field border highlights blue
- Animation: "The Secret Lives of Mushrooms" types in (2s)
- Animation: Cursor moves to "Continue" button

Scene 3 - Transition (2s):
- Animation: Button highlights on hover
- Animation: Click ripple effect
- Animation: Screen slides left, new panel slides in

Scene 4 - Result (3s):
- Visual: Sketchpad view with AI suggestions panel
- Animation: Suggestion cards stagger in (0.15s delay each)
- Animation: "Lesson Flow" section populates

Scene 5 - Success (3s):
- Visual: Green full-screen background
- Animation: White circle scales in (spring)
- Animation: Checkmark draws inside circle
- Animation: "Your lesson is live!" fades in below
- Animation: Subtitle "Ready to inspire wonder and discovery" fades in
教程节奏指南
步骤复杂度时长备注
简单点击2-3s点击并立即显示结果
表单输入4-6s输入并提交
多字段表单8-12s输入多个字段
复杂工作流15-20s包含多个子步骤
成功状态3-5s留出时间,让画面自然呈现
打造高效教程的技巧
  1. 每个场景只展示一个操作 — 不要把多个点击操作挤在一起
  2. 在展示结果时停顿 — 让观众看清结果后再继续
  3. 突出变化之处 — 对新元素使用柔和的辉光或缩放效果
  4. 旁白与操作同步 — 旁白说“点击”时,光标正好点击
  5. 展示完整 UI — 上下文有助于用户了解自己所处的位置
  6. 以庆祝画面收尾 — 成功状态能强化完成感

视频类型:社交媒体宣传片

目标: 用醒目的动态文字迅速吸引注意力,适用于广告和社交内容。

脚本结构
HOOK (1-3s)
Single powerful word or phrase that stops the scroll.

VALUE PROP (3-5s)
What's in it for them? One punchy sentence.

FEATURE FLASH (5-10s)
2-3 key benefits, rapid fire.

CTA (2-3s)
Clear action: "Download now", "Try free", URL
视觉风格
  • 极简背景: 纯色或简单的渐变
  • 高对比度: 深色背景 + 白色文字,或彩色背景 + 白色文字
  • 逐词呈现: 每个词都有专属的展示时刻
  • 颜色过渡: 背景颜色在场景之间变化
  • 方形格式: Instagram/社交动态使用 1080x1080
社交宣传片的动画模式
  • 文字猛击: 单个词以强烈效果出现(缩放 1.2→1 + 轻微抖动)
  • 背景闪变: 在词语/短语之间即时切换颜色
  • 文字缩放: 词语先放大,再缩小,为下一个词留出空间
  • 极简动态: 让醒目的字体承担表达效果
  • 快速剪辑: 每个词语/短语最多 0.5-1s
场景计划示例
Script: "We are ready."

Scene sequence (4 seconds total):
- Frame 1: Black bg, "WE" slams in white (0.8s)
- Frame 2: White bg, "A" appears black, centered (0.8s)
- Frame 3: Red bg, "R" types out, becomes "READY" (1.6s)
- Frame 4: Hold final frame (0.8s)
时长指南
平台理想时长最长时长
Instagram Reels15-30s90s
TikTok15-60s3min
Twitter/X15-45s2min 20s
LinkedIn30s-1min10min
YouTube Shorts15-60s60s

视频类型:应用/产品展示

目标: 结合文字与 UI,以电影感的方式展示产品界面。

脚本结构
HOOK (3-5s)
Problem statement or intriguing question.

INTRODUCE PRODUCT (5-10s)
Show the product name/logo, establish brand.

FEATURE TOUR (20-40s)
Walk through 3-5 key features with UI demonstrations.

BENEFIT SUMMARY (5-10s)
Recap what makes it special.

CTA (5s)
URL, app store badge, or next step.
视觉风格
  • 深色渐变背景: 面向科技产品,采用黑色到紫色/蓝色的渐变
  • 柔和渐变背景: 面向友好型应用,采用粉色、薰衣草色、薄荷绿等柔和色彩
  • 悬浮式 UI 模型: 应用界面以微倾斜的角度呈现,并带有阴影
  • 与 UI 并列的动态文字: 文字出现在界面旁边或上方
  • 光标交互: 展示 UI 内的点击、滚动和输入操作
应用展示的动画模式
  • 输入 URL 栏: 在浏览器地址栏中呈现打字机效果
  • UI 滑入: 应用模型带有弹簧效果,从底部或侧边滑入
  • 透视倾斜: UI 轻微进行 3D 旋转(5-10 度)
  • 辉光效果: 在 UI 元素周围添加柔和的辉光/光晕
  • 光标编排: 使用平滑的贝塞尔曲线移动,并添加点击涟漪
  • 列表逐项呈现: 列表中的项目依次出现(每项延迟 0.1s)
  • 代币/图标网格: 将应用图标或加密代币排列成网格
场景计划示例
Script: "Earn the best yields on your crypto."

Scene 1 (3s):
- Visual: Soft purple gradient background
- Animation: Text "Earn the best" fades in, "yields" appears in accent color
- Timing: Words sync with voiceover

Scene 2 (4s):
- Visual: Browser URL bar appears (rounded rectangle)
- Animation: "jumper.exchange/" types out character by character
- Animation: Cursor blinks at end

Scene 3 (5s):
- Visual: App UI mockup slides up from bottom
- Animation: Token list (USDC, ETH, LINK) reveals with stagger
- Animation: Cursor moves to highlight token row

视频类型:落地页展示

目标: 以富有戏剧性的设计工具美学展示网站设计。

脚本结构
INTRO (3-5s)
Establish the problem or context.

DESIGN REVEAL (10-20s)
Dramatic entrance of the landing page.

FEATURE CALLOUTS (15-30s)
Highlight specific sections of the page.

CTA (5-10s)
"Book a demo", "Get started", with URL.
视觉风格
  • 设计工具美学: 显示网格线、参考线和标尺
  • 中性色背景: 浅灰色(#f5f5f5)或深炭灰色(#1a1a1a)
  • 完整网页模型: 在浏览器框架中展示完整的落地页
  • 光束/镜头光晕: 采用富有戏剧性的揭示灯光
  • 便当盒网格布局: 将 UI 组件排列成网格
落地页展示的动画模式
  • 网格显现: 首先淡入点状参考线
  • 元素构建: 先用蓝色矩形表示元素,再让它们“变成”真实 UI
  • 光线扫过: 对角光束划过设计
  • 缩放和平移: 镜头在页面上移动
  • 组件高亮: 讨论到某个区块时,让其发光或抬起
  • 浏览器框架: 使用 Chrome/Safari 浏览器界面作为上下文
场景计划示例
Script: "Achieve team harmony with TeamFusion."

Scene 1 (2s):
- Visual: Dark background, grid lines appear (dashed, gray)
- Animation: Blue rectangle placeholder at center
- Animation: Cursor enters frame

Scene 2 (3s):
- Visual: Light beam sweeps diagonally
- Animation: Blue rectangle transforms/morphs into webpage mockup
- Animation: Glow effect around the design

Scene 3 (5s):
- Visual: Full landing page visible with bento-style feature cards
- Animation: Cards lift slightly with shadow on hover simulation
- Animation: Text callout points to CTA button

视频类型:AI/科技产品解说

目标: 通过文字和界面演示,解释复杂的 AI 或科技产品。

脚本结构
MEET THE PRODUCT (5-10s)
"Meet [Product] — the [category] that [key benefit]."

PROBLEM (10-15s)
What frustration does this solve?

HOW IT WORKS (20-40s)
Show the interface, demonstrate the magic.

INTEGRATIONS (10-15s)
What does it connect with?

CTA (5-10s)
Try it, sign up, learn more.
视觉风格
  • 深色模式 UI: 深色背景搭配鲜艳的强调色
  • 霓虹强调色: 紫色、青色、洋红色光晕
  • 语音/AI 指示元素: 波形、录音按钮、聊天气泡
  • 应用图标网格: 展示带有辨识度徽标的集成应用
  • 并排布局: 一侧放文字,另一侧放 UI
AI 解说动画模式
  • 语音波形: 动态圆点或条形,表示“正在聆听”
  • 录音指示器: 脉动的红点搭配“停止”按钮
  • 聊天消息输入: 先显示输入指示器,再出现消息
  • 模型选择器: 显示 AI 模型选项的下拉菜单
  • 集成图标: 应用徽标从边缘依次滑入
  • 光晕脉冲: 讨论到某个元素时,该元素发光
场景规划示例
Script: "Meet the AI assistant that lets you talk to all your apps."

Scene 1 (3s):
- Visual: Dark purple gradient background
- Animation: "Meet" fades in gray, holds

Scene 2 (5s):
- Visual: App mockup slides in from right
- Visual: Voice recording UI with waveform animation
- Animation: Red recording dot pulses
- Animation: Text "that lets you talk to all your apps" appears left

Scene 3 (4s):
- Visual: Dropdown opens showing model options (GPT-4, Claude, etc.)
- Animation: List items stagger in (0.1s delay)
- Animation: Cursor hovers, selection highlights

视觉风格参考

根据产品类型和基调选择视觉风格:

深色戏剧风(科技、AI、金融科技、加密货币)
  • 背景: 黑色到紫色/蓝色的渐变,或纯深色(#0a0a0a)
  • 文字: 白色或浅灰色,搭配彩色强调元素
  • 强调色: 霓虹紫(#8b5cf6)、青色(#06b6d4)、洋红色(#ec4899)
  • 效果: 光晕、光束、细微粒子
柔和渐变风(消费级应用、生活方式)
  • 背景: 柔和的渐变色(薰衣草紫→粉色、薄荷绿→蓝色)
  • 文字: 深紫色或海军蓝,以形成对比
  • 强调色: 互补的柔和色彩
  • 效果: 柔和阴影、圆角、轻快动效
简洁极简风(SaaS、效率工具、B2B)
  • 背景: 白色(#ffffff)或浅灰色(#f8fafc)
  • 文字: 深灰色(#1f2937)或黑色
  • 强调色: 用于按钮/高亮的品牌色
  • 效果: 细微阴影、简洁过渡
设计工具风(落地页、设计展示)
  • 背景: 带有可见网格的中性灰
  • 元素: 构图指示元素(蓝色矩形、参考线)
  • 效果: 光线扫过、元素显现
  • 画框: 用浏览器外框提供场景背景

动画术语

描述动画时使用以下术语:

基础动画
术语效果最适合
淡入/淡出(Fade)不透明度从 0→1 或 1→0微妙的进入效果、过渡
滑动(Slide)从屏幕外移入UI 元素、列表项
缩放(Scale)放大或缩小强调、进入效果
弹簧(Spring)弹跳并略微过冲轻快、有活力的感觉
缓出(Ease-out)开始快,结束时放慢自然移动
缓入缓出(Ease-in-out)开始和结束时较慢流畅、精致
打字机(Typewriter)逐个字符出现文字显现、URL、代码
交错(Stagger)各项依次延迟列表、多个元素
变形(Morph)形状变为另一种形状形变、过渡
脉冲(Pulse)有节奏地放大/缩小吸引注意
抖动(Shake)快速水平振动冲击、强调
擦除(Wipe)通过移动的边缘揭示内容场景过渡
高级动画(来自示例)
术语效果最适合
文字猛击(Word slam)文字出现时放大过冲并抖动醒目陈述、社交视频
背景闪变(Background flash)背景颜色瞬间变化场景过渡、增强活力
光线扫过(Light sweep)对角光束扫过画面戏剧性揭示
辉光/泛光(Glow/bloom)元素周围的柔和光晕突出焦点、高级质感
透视倾斜(Perspective tilt)UI 进行 3D 旋转(5-10°)应用模型图、营造景深
光标轨迹(Cursor trail)指针沿平滑的贝塞尔曲线路径移动UI 演示
点击涟漪(Click ripple)点击时出现圆形脉冲按钮交互
倒计时(Countdown)数字逐个递减紧迫感、计时器
网格显现(Grid reveal)内容出现前先显示参考线设计工具美学
徽标组装(Logo assemble)徽标部件组合到一起品牌揭示
时间指南
  • 超快: 0.1-0.2s — 单词砸入、色彩闪现
  • 快: 0.2-0.3s — 干脆利落、充满活力
  • 中: 0.4-0.6s — 平衡、专业
  • 慢: 0.8-1.2s — 戏剧化、优雅
  • 交错延迟: 项目之间间隔 0.1-0.2s
  • 停留时间: 0.5-1s — 给重要文字留出呼吸空间

场景规划模板

对于每个场景,请记录:

SCENE [number]: [title]
Script: "[exact voiceover text]"
Duration: [X seconds]
Visuals:
  - [element]: [description]
  - [element]: [description]
Animations:
  - [timing]: [element] [animation type] ([duration], [easing])
  - [timing]: [element] [animation type] ([duration], [easing])
Transition to next: [type]

必需设置 - Resemble.ai

生成配音前,请确认用户已配置凭据。

检查现有配置

检查 .env 文件是否存在,并包含:

  • RESEMBLE_API_KEY - Resemble.ai API 令牌
  • RESEMBLE_VOICE_UUID - 语音 ID(可选,默认为 7213a9ea)
提示用户提供缺失的凭据

如果缺少 RESEMBLE_API_KEY: 询问:“我需要你的 Resemble.ai API 密钥来生成配音。你可以从 https://app.resemble.ai/account/api 获取密钥——请粘贴你的 API 密钥:”

如果缺少 RESEMBLE_VOICE_UUID: 使用默认语音 UUID 7213a9ea。只有在用户想要更换语音时才询问。

保存凭据
  1. 使用提供的值创建或更新 .env
  2. 确保 .env 位于 .gitignore 中
  3. 在继续之前确认设置已完成
凭据安全
  • 绝不将 API 密钥提交到版本控制中
  • 绝不向用户显示完整的 API 密钥
  • 始终确保 .env 位于 .gitignore 中
  • 仅将凭据存储在 .env 中,绝不硬编码

字幕行为

字幕默认处于禁用状态。 只有在用户明确提出要求时,才生成单词级时间戳和字幕组件。

默认情况(无字幕):
  • 仅生成音频文件
  • 保存基本元数据(时长、fps、durationInFrames)
  • 不要将时间戳处理为单词
用户请求字幕时:
  • 用户必须明确提出“captions”“subtitles”或“word highlighting”
  • 将 audio_timestamps 处理为单词级数据
  • 在合成中加入字幕组件

规则文件

请阅读以下文件,了解详细实现:


快速参考

教育教程:
  1. 深入研究主题
  2. 根据受众水平调整语言
  3. 使用与旁白同步的揭示动画
  4. 加入视觉隐喻和图表
SaaS 演示:
  1. 了解功能工作流
  2. 创建 UI 模型或截取屏幕截图
  3. 使用光标动画和高亮效果
  4. 清晰展示结果/成效
产品发布:
  1. 聚焦“问题 → 解决方案”的叙事
  2. 使用醒目的排版和品牌色彩
  3. 节奏明快——句子简短、快速剪辑
  4. 以明确的行动号召结尾
教程 / 操作演示:
  1. 界面风格轻盈、简洁
  2. 每个场景只展示一个操作——不要操之过急
  3. 用光标引导观众注意力
  4. 展示步骤进度(面包屑、数字)
  5. 在继续之前暂停展示结果
  6. 以成功状态庆祝画面结尾
社交媒体宣传:
  1. 用一个有力的词语/短语开场
  2. 逐词揭示,营造冲击力
  3. 背景色彩过渡增添活力
  4. 为获得最佳互动效果,总时长控制在 30s 以内
  5. 信息流使用方形(1080x1080)格式
应用/产品展示:
  1. 选择渐变风格(深色戏剧感或柔和粉彩)
  2. 以轻微透视/倾斜效果展示 UI 模型
  3. 将动感文字与界面演示结合
  4. 网页产品使用 URL 栏输入效果
  5. 通过光标编排演示点击操作
对于落地页展示:
  1. 以设计工具的美学风格开场(网格、参考线)
  2. 使用扫光效果,打造戏剧性的揭示
  3. 在浏览器框架中展示完整网页
  4. 使用标注突出特定版块
  5. 以清晰的行动号召和 URL 收尾
对于 AI/科技解说:
  1. 采用带霓虹点缀的深色模式美学风格
  2. 展示语音/聊天 UI 交互
  3. 使用应用图标网格演示集成
  4. 采用并排布局:文本 + 界面
  5. 使用波形和输入指示器营造 AI 氛围

评论

支持 Markdown