本技能提供编写与审查 Remotion 动画的准则，尤其适用于需要在 Remotion Studio Visual Mode 中可编辑的动画。
用途：让动画代码对人类和编码智能体都易于推理，同时保留可视化编辑能力。
主要能力与用法：
- 优先使用 interpolate() 而非独立 spring()。interpolate() 更易理解，贝塞尔缓动贴近 CSS，且 Studio Visual Mode 可编辑其关键帧。需要弹簧感时，把可编辑值放在 interpolate() 中，并将 Easing.spring() 作为缓动函数传入，例如 easing: Easing.spring({damping: 200})。Easing.spring() 支持 damping、mass、stiffness、overshootClamping，已归一化到插值进度，不接受 frame、fps、from、to、delay、reverse、durationInFrames、durationRestThreshold。仅当动画确实需要无法用缓动表达的帧驱动物理弹簧模拟时，才使用独立 spring()。
- 优先使用单独的 CSS transform 属性（scale、rotate、translate），而非拼接 transform 字符串；单独属性可在 Studio Visual Mode 中编辑，字符串内的值不可编辑。
- 保持可编辑值内联：把插值直接写在 JSX style 对象中，避免先赋值给常量再引用。效果参数同理，应内联在效果调用中，不要用常量隐藏坐标、颜色、数值控件或插值。
- 保持效果无条件：effects 数组结构应无条件存在，Studio Visual Mode 无法可靠编辑仅在条件表达式后出现的效果。若某版本需要效果、另一版本不需要，应渲染为不同元素。
- 直接插值 rotate 和 translate 的 CSS 单位字符串，例如 rotate: interpolate(frame, [0, 100], ["20deg", "90deg"])，translate 同理，避免围绕分别插值的数字手动拼字符串。
- 对可能被调整的元素使用 remotion 的 Interactive 命名空间，如 import {Interactive} from "remotion"，使用 <Interactive.Div>、<Interactive.Span> 等，它们行为类似普通 HTML 元素，但可在 Studio 中交互，内联样式如文字颜色、字号可被交互式标准化。
适用场景：创建或审查 Remotion 动画，特别是希望动画在 Remotion Studio Visual Mode 中可编辑时。
限制：资料未提供安装命令、收费、价格、平台或效果数据；上述准则为编写约定，不保证具体渲染结果。