Back to Details

flick

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

/flick

/flick

Turn a transcript into original scene animations.
将转录文本转换为原创场景动画。

Invocation dispatch — do this first

调用触发——请先执行此步骤

Recognize 
/flick
in Claude Code and 
$flick
in Codex. Flick runs transcription, planning, Remotion building, preview, revision, and reusable-animation saving in one workflow.
识别Claude Code中的
/flick
指令和Codex中的
$flick
指令。Flick可在一个工作流中完成转录、规划、Remotion项目构建、预览、修订以及可复用动画保存的全流程。

What this skill does

该技能的功能

  1. Gets a video, public video link, or pasted transcript.
  2. Creates the timestamped transcript when the source is video.
  3. Asks for aspect ratio, brand assets, and the user's creative opinion.
  4. Writes an approval plan with one proposed animation per transcript scene.
  5. Builds the approved scenes in Remotion with action-matched sound effects.
  6. Opens Remotion Studio for review, revises the affected scene, and saves selected animations for reuse.
  1. 获取视频、公开视频链接或粘贴的转录文本。
  2. 若源内容为视频，生成带时间戳的转录文本。
  3. 询问用户所需的宽高比、品牌资产以及创意想法。
  4. 编写一份审批方案，为转录文本中的每个场景提供一个动画提案。
  5. 在Remotion中构建已获批的场景，并匹配动作音效。
  6. 打开Remotion Studio进行审核，修改指定场景，并保存选定的动画以供复用。

Output directory

输出目录

Create 
flick-output/
in the user's current project. If that directory already exists, create 
flick-output-YYYY-MM-DD-HHmmss/
. Use one output directory consistently for every file in that run.
The completed run contains:
text
flick-output/
  transcript.json
  flick-plan.md
  remotion-brief.md
  scene-spec.json
  brand-assets/
  remotion/
  scenes/[approved-scene-name]/[approved-scene-name].mp4
  scenes/[approved-scene-name]/poster.jpg
在用户当前项目中创建
flick-output/
目录。若该目录已存在，则创建
flick-output-YYYY-MM-DD-HHmmss/
目录。单次运行的所有文件需统一存放在同一个输出目录中。
完成运行后，目录包含以下内容：
text
flick-output/
  transcript.json
  flick-plan.md
  remotion-brief.md
  scene-spec.json
  brand-assets/
  remotion/
  scenes/[approved-scene-name]/[approved-scene-name].mp4
  scenes/[approved-scene-name]/poster.jpg

Reusable animation library

可复用动画库

Flick installs 
<flick-skill>/saved-animations/
automatically. Before planning, read 
<flick-skill>/saved-animations/README.md
. It is Flick's shared library of editable scene templates. Use an entry only when its visual pattern clearly fits the requested scene. If nothing is a strong fit, create a new scene.
Do not open every component. After identifying a strong catalog match, inspect only that component folder and adapt it with the current transcript and approved assets. Do not reuse private or project-specific imagery from a template.
Flick会自动安装
<flick-skill>/saved-animations/
目录。在规划前，请阅读
<flick-skill>/saved-animations/README.md
文件，这是Flick的可编辑场景模板共享库。仅当模板的视觉风格与需求场景高度匹配时，才可使用其中的模板。若没有合适的模板，则创建新场景。
无需打开所有组件。找到匹配度高的模板后，仅查看该组件文件夹，并结合当前转录文本和获批资产进行调整。请勿复用模板中的私有或项目专属图像。

Workspace setup

工作区设置

Run:
text
node <flick-skill>/scripts/bootstrap.mjs --project <output-directory>
Bootstrap creates the workspace and installs Remotion, bundled FFmpeg, Whisper, yt-dlp, and Flick's bundled sound effects. It requires Node.js 20+, Python 3.9+, and network access. If Node or Python is missing, show the install guidance printed by bootstrap and ask before running a system installer.
运行以下命令：
text
node <flick-skill>/scripts/bootstrap.mjs --project <output-directory>
Bootstrap脚本会创建工作区并安装Remotion、打包好的FFmpeg、Whisper、yt-dlp以及Flick的打包音效。该脚本需要Node.js 20+、Python 3.9+以及网络访问权限。若缺少Node.js或Python，请展示Bootstrap脚本输出的安装指南，并在运行系统安装程序前征得用户同意。

Step 1: Create the transcript

步骤1：生成转录文本

Read references/step-1-transcript.md.
Ask exactly:
Send a video/link to transcribe, or paste a transcript.
If the user provides a local video or public video URL, use Flick's bundled timestamped-transcript pipeline:
text
node <flick-skill>/scripts/transcribe.mjs --source <file-or-url> --project <output-directory>
For a public URL, the extractor downloads its audio with yt-dlp. For either a URL or local video, it uses bundled FFmpeg and Whisper to write 
<output-directory>/transcript.json
with timestamps. If the user pastes text, store it in the same 
transcript.json
format. The transcript is always the script Flick animates.
Then ask exactly, in this order:
  1. What aspect ratio should this be: 9:16, 16:9, 1:1, or custom?
  2. Put any logo, fonts, screenshots, product images, or brand guide into 
    <output-directory>/brand-assets/
    . What should I use?
  3. What do you think? Your opinion will make your animation much better.
Gate: 
transcript.json
exists and the user has answered those three questions.
阅读references/step-1-transcript.md。
精准询问：
请发送需要转录的视频/链接，或直接粘贴转录文本。
若用户提供本地视频或公开视频URL，使用Flick内置的带时间戳转录流程：
text
node <flick-skill>/scripts/transcribe.mjs --source <file-or-url> --project <output-directory>
对于公开URL，提取工具会通过yt-dlp下载其音频。无论是URL还是本地视频，都会使用打包的FFmpeg和Whisper生成带时间戳的
<output-directory>/transcript.json
文件。若用户粘贴文本，则将其保存为相同的
transcript.json
格式。转录文本始终是Flick制作动画的脚本。
然后按以下顺序精准询问：
  1. 动画的宽高比应为：9:16、16:9、1:1还是自定义？
  2. 请将Logo、字体、截图、产品图片或品牌指南放入
    <output-directory>/brand-assets/
    目录。需要使用哪些资产？
  3. 您有什么创意想法？您的意见会让动画效果更好。
准入条件：
transcript.json
已生成，且用户已回答上述三个问题。

Step 2: Plan and get approval

步骤2：规划并获取审批

Read references/step-2-plan.md.
Create the proposed scene plan from 
transcript.json
, the approved format, selected brand assets, and the user's creative opinion. Follow this step's plan format. Do not create components or 
scene-spec.json
before approval.
Write 
<output-directory>/flick-plan.md
. It is the user-facing creative contract. For every transcript scene, include its approved scene name, transcript line(s) and timestamps, what is on screen, text on screen, selected supplied assets, sequential or simulated interaction, sound effect, audio-coupled idea, and transition.
Show the complete plan in chat and ask:
Here are the scenes Flick will build from your transcript. Approve them, or tell me what to change.
Do not write Remotion components before approval.
Gate: 
flick-plan.md
exists and the user has approved it.
阅读references/step-2-plan.md。
根据
transcript.json
、获批格式、选定的品牌资产以及用户的创意想法生成场景提案方案。遵循本步骤的方案格式。在获得审批前，请勿创建组件或
scene-spec.json
文件。
编写
<output-directory>/flick-plan.md
文件，这是面向用户的创意协议。对于转录文本中的每个场景，需包含获批的场景名称、转录文本内容及时间戳、屏幕展示内容、屏幕文本、选定的用户资产、顺序或模拟交互、音效、音频联动创意以及转场效果。
在聊天中展示完整方案，并询问：
这是Flick将根据您的转录文本构建的场景方案。请审批，或告知需要修改的内容。
在获得审批前，请勿编写Remotion组件。
准入条件：
flick-plan.md
已生成，且用户已审批通过。

Step 3: Build the approved scenes

步骤3：构建获批场景

Read references/step-3-compose.md.
Write:
text
<output-directory>/remotion-brief.md
<output-directory>/scene-spec.json
remotion-brief.md
is the approved build handoff. Write it using references/remotion-brief-template.md. 
scene-spec.json
is the structured technical companion: IDs, names, transcript timing, frame ranges, components, assets, visual behavior, and sound effects.
Build from the approved 
flick-plan.md
, 
remotion-brief.md
, 
scene-spec.json
, and selected assets. Create custom components, register independent compositions, verify renders, and open Studio for review.
Use the shared catalog read at the start of the run. Select a compatible entry only when it is a strong fit, then inspect only that entry's component folder before deciding to adapt it. If no entry is a strong fit, build an original scene.
Build one named Remotion composition per approved scene under 
<output-directory>/remotion/src/scenes/
. Register each independently in 
Root.tsx
; do not create an all-scenes composition. Use frame-driven Remotion motion and copy only selected user brand assets into the Remotion public folder.
Do not add background music. Use bundled sound effects only when they match a visible action: typing, click, impact, reveal, counter, or transition.
Render every named scene before review.
Gate: every approved scene has a rendered preview in 
scenes/[approved-scene-name]/
.
阅读references/step-3-compose.md。
编写以下文件：
text
<output-directory>/remotion-brief.md
<output-directory>/scene-spec.json
remotion-brief.md
是获批的构建交接文档，请使用references/remotion-brief-template.md模板编写。
scene-spec.json
是结构化的技术配套文档，包含ID、名称、转录时间线、帧范围、组件、资产、视觉行为以及音效。
根据获批的
flick-plan.md
、
remotion-brief.md
、
scene-spec.json
以及选定的资产进行构建。创建自定义组件，注册独立合成项，验证渲染结果，并打开Studio进行审核。
使用运行开始时读取的共享模板库。仅当模板与需求高度匹配时才选择使用，然后仅查看该模板的组件文件夹，再决定是否调整。若没有合适的模板，则构建原创场景。
在
<output-directory>/remotion/src/scenes/
下为每个获批场景创建一个命名的Remotion合成项。在
Root.tsx
中独立注册每个合成项；请勿创建包含所有场景的合成项。使用基于帧的Remotion动画，并仅将选定的用户品牌资产复制到Remotion的public文件夹中。
请勿添加背景音乐。仅当音效与可见动作（如打字、点击、撞击、展示、计数或转场）匹配时，才可使用内置音效。
在审核前渲染所有命名场景。
准入条件：每个获批场景的渲染预览已存放在
scenes/[approved-scene-name]/
目录中。

Step 4: Preview, revise, and save

步骤4：预览、修订与保存

Read references/step-4-deliver.md.
Start Remotion Studio from 
<output-directory>/remotion/
. Give the user the localhost URL only after Studio starts successfully, then say:
Watch it and tell me what you think. What should change, if anything?
On feedback, revise only the affected scene, render that scene again, and reopen Studio. After acceptance, ask:
Which scene animations should I save as reusable assets?
Save each selected scene's editable component, plus any required local 
.ts
or 
.tsx
companion files, under 
<flick-skill>/saved-animations/[approved-scene-name]/
. Do not save MP4s, posters, or private brand assets in the shared library.
阅读references/step-4-deliver.md。
从
<output-directory>/remotion/
启动Remotion Studio。仅在Studio成功启动后，将本地主机URL告知用户，然后说：
请观看动画并告诉我您的想法。如有需要，请问需要修改哪些内容？
根据反馈，仅修改指定场景，重新渲染该场景，并重新打开Studio。在用户确认接受后，询问：
哪些场景动画应保存为可复用资产？
将每个选定场景的可编辑组件，以及所有必要的本地
.ts
或
.tsx
配套文件，保存到
<flick-skill>/saved-animations/[approved-scene-name]/
目录下。请勿将MP4文件、海报或私有品牌资产保存到共享库中。

Creative laws

创意规则

  • The transcript defines scene timing unless the user explicitly asks to alter it.
  • Every scene must depict a concrete visual animation—not generic text over a background.
  • Use only user-supplied brand assets and source material the user has the right to use.
  • Do not invent generic scene names. Use names approved in 
    flick-plan.md
    .
  • Do not claim a preview, render, or Studio session exists unless its command succeeded.
  • 除非用户明确要求调整，否则转录文本决定场景时长。
  • 每个场景必须呈现具体的视觉动画——而非背景上的通用文本。
  • 仅可使用用户提供的品牌资产以及用户有权使用的源素材。
  • 请勿使用通用场景名称。请使用
    flick-plan.md
    中获批的名称。
  • 除非命令执行成功，否则请勿声称预览、渲染或Studio会话已完成。