
AI 技能媒体生成视频【免费下载链接】video-shotcraftAI video skill for Claude Code Codex — cinematic product videos with Remotion: 152 shot recipe cards, 209 motion previews, a production-ready template项目地址https://gitcode.com/gh_mirrors/vi/video-shotcraft点击查看免费下载本篇基于镜头卡 collab-cursor-moves 展开讲解 video-shotcraft 如何把带身份名牌的协作光标从操作工具升格为演员A 式 dialogue-duet 用两枚具名光标在纯暗场上完成一段无 UI 的设计-开发交接叙事B 式 cast-ensemble 用五枚错峰飞入的彩色光标为画布场景铺设团队在场的氛围层。读完本文你可以直接按卡内参数表复刻或调校这两个 30fps / 1920×1080 的 Remotion 组件并理解每个缓动、频率、帧窗口取值背后的可读性判断。意图光标为什么能当演员库内其他镜头如 input-trigger-moves 的 cursor-performance 式里光标一直是操作工具——点击有 payload、按下有反馈。本卡把带名牌的协作光标升格成演员A 式dialogue-duet蓝/绿两枚具名光标在纯暗场用位移编排讲设计→开发交接——画面没有一个 UI 元素观众照样看懂剧情光标的位置关系就是台词B 式cast-ensemble五枚光标错峰入场后持续漂移充当氛围粒子团队在场感全靠它其中一枚还会停下来在便签上打字cameo 戏份。SVG 光标 名牌 chip 的渲染成本极低、叙事密度极高是协作主题最便宜的视觉论证。两式时长均为 140 帧约 4.7s 30fps能量上一高一低A 式叙事密度高中能量B 式是氛围层低中能量可垫在任何时长的画布镜头后面。两式选型式做法适用A dialogue-duet蓝/绿两枚具名光标贝塞尔入场 → 相互靠近对话脉冲呼吸→ 上下弧线绕位交换 → 名牌一亮一暗灯光交接 → 绿光标 easeIn 放大数十倍成巨箭头当转场遮挡双角色交接叙事设计→开发、你→AI需要一段无 UI 的纯叙事呼吸拍B cast-ensemble5 枚具名彩色光标错峰 spring 飞入灰阶画布 → 双频正弦漂移驻场 → 一枚在便签上打字机补全一行 → 结尾全员 easeInOut 聚拢围观画布/白板类产品全片氛围层主内容之外需要别人也在的背景活性A 式 dialogue-duet纯暗场对话双人舞的帧级编排参考实现是 CursorDialogueDuet.tsx全片由useCurrentFrame()驱动所有位移都是显式的三次贝塞尔或圆弧参数方程——没有任何 linear 直线因为从卡的调节手感看直线 linear 立即读作程序在挪图标曲线 缓动才是人在动。四段位移 两枚角色的时间码Designer蓝#4C8DF6与 Developer绿#2FBF71共享中心点CX960, CY520、半径R270各自走独立轨迹段落Designer 帧窗口Developer 帧窗口曲线说明入场0–24f4–28f错峰 4feaseOutCubic三次贝塞尔分别从画外左/右下飞入左右位弹性减速靠近/回应26–56f30–58feaseInOutCubic蓝光标探身靠近绿光标微微后仰再前倾sin(t·π)·70摆动绕位交换60–98f60–98feaseInOutCubic圆弧蓝走上半弧 180°→360°绿走下半弧 0°→180°同步交换左右位退场/转场104–128f easeIn 甩出画面左下100–134f easeIn 冲向中心easeInCubic见下文转场放大绕位段是礼让的身体语言核心两枚各走半圆弧、上下分弧同步交换而不是同弧同向——同弧同向会读作相撞上下分弧才是让路。源码里蓝光标还做了 120ms 级的小衔接混合t 0.08时与上一段终点线性插值避免靠近段终点与圆弧起点出现速度跳变// 绕位从左侧经上方绕到右侧60–98 const t easeInOutCubic(clamp01((f - 60) / 38)); const a Math.PI t * Math.PI; // 180° → 360°(上半弧) dx CX Math.cos(a) * (R - 40) * (1 - t * 0.15); dy CY Math.sin(a) * (R - 110);注意椭圆化参数R-40x 半径与R-110y 半径横轴比纵轴略长绕位轨迹读作椭圆轨道而非正圆更自然。名牌灯光交接话语权移交的量化写法卡里最精妙的一行是名牌亮度公式源码实现为CursorDialogueDuet.tsx 第 45–47 行opacity: badgeOpacity * (0.28 0.72 * badgeLit), filter: saturate(${0.35 0.65 * badgeLit}), boxShadow: badgeLit 0.6 ? 0 0 ${22 * badgeLit}px ${color} : none,压暗态并非全黑opacity保留 0.28 底值、saturate保留 0.35 底色暗侧名牌在场但沉默badgeLit 0.6才加辉光阴影半径随badgeLit线性到 22px避免半亮状态出现模糊光斑交接发生在绕位中段70–84fhandoff easeInOutCubic(clamp01((f - 70) / 14))Designer 的badgeLit为1 - handoff、Developer 为handoff一亮一暗同时反向变化。卡的调节手感是两个都亮读不出主从一亮一暗才是话语权移交。此外靠近对话段26–60f蓝光标叠加了脉冲呼吸1 sin((f-26)·0.5)·0.05给说话中的状态一个微缩放信号。转场放大巨箭头即前景遮挡物100–134f绿光标gScale 2.8 blow * 66easeInCubic34fscale 从 2.8 冲向 68同时interpolate把位置甩向画面外左上角-160, -140名牌同步1 - clamp01((f-102)/12)淡出。卡里点明easeIn 加速是甩出的关键巨箭头成为前景遮挡物正好接 transition-hidden-cut 的语法在遮挡帧硬切下一镜。B 式 cast-ensemble五光标群演的氛围层参数参考实现是 CursorCastEnsemble.tsx。背景是灰阶点阵无限画布 四张灰阶便签环境道具便签的固定随机旋转用mulberry32(88)确定性 RNG 生成——整个组件逐帧确定、无真随机保证渲染可复现。群演表错峰入场与身份编码五枚演员以数据表驱动CursorCastEnsemble.tsx 第 26–32 行这是复用时最值得抄的结构角色颜色画外起点落位入场 delay漂移相位Lisa#4C8DF6(-160, 200)(430, 330)0f0.0Lucas#2FBF71(2080, 160)(1370, 290)5f1.7Marta#F2994A(-160, 900)(560, 760)9f3.1Niko#4C8DF6(2080, 950)(1420, 780)13f4.4Rita#2FBF71(900, -180)(960, 545)17f5.6入场用 Remotionspring({ frame: f - a.delay, fps: 30, config: { damping: 15, stiffness: 90, mass: 0.9 } })从画外弹簧减速到落位。注意Lisa 与 Niko 同为蓝色、Lucas 与 Rita 同为绿色颜色是身份编码而非角色编码且刻意与 A 式的主角配色蓝 Designer / 绿 Developer一致——卡内已知坑要求两式同片共存时A 的两枚主角要从 B 的群演里出同名同色否则读作两拨人。名牌 chip 在delay 12f起用 12f 淡入并伴随translateY((1-badge)·10px)上浮名牌跟光标同帧出现读作贴纸随减速淡入才是人到了自报家门。双频正弦漂移为什么单频读作钟摆落位后settled clamp01((f - delay - 26)/10)渐入叠加两路正弦漂移const driftX Math.sin(f * 0.055 a.phase) * 46 Math.sin(f * 0.021 a.phase * 2) * 30; const driftY Math.cos(f * 0.047 a.phase * 1.3) * 38 Math.cos(f * 0.017 a.phase) * 24;频率 0.055 / 0.021 rad/framex 轴幅度 ±46 / ±30pxy 轴同构0.047 / 0.017±38 / ±24px每枚光标phase不同且第二路频率用phase·2、phase·1.3错相——单频正弦读作钟摆双频不同相才是人手的随机漂移乘在settled上落位前不漂移避免入场路径被污染。打字 cameo 与结尾聚拢Rita 的打字戏原片出处 pitch-app 82–90s并入中央大白便签typedCount在 58–118f 线性吐完Our customers love it共 20 字符光标条Math.floor(f / 8) % 2 0按 8f 周期闪、opacity 在 0.15 与 1 之间跳。卡的调节手感装饰性打字可放到 1f/字符级正文交互打字应回 typewriter-moves 的节奏。结尾 92f 起 26feaseInOut聚拢到围观位GATHER表环绕中央便签一圈且漂移衰减到 25% 而非归零x interpolate(gatherT, [0,1], [x, GATHER[i][0] driftX * 0.25])——完全静止的光标群读作死机保留残余微动是人还在的最后证据。参数速查表卡片原表继承参数典型值调节手感A 位移全部三次贝塞尔入场 easeOut 24f / 靠近 easeInOut 30f / 绕位 easeInOut 38f / 甩出 easeIn 24f无 linear直线linear 立即读作程序在挪图标曲线缓动才是人在动A 绕位两枚各走半圆弧上弧 180°→360° vs 下弧 0°→180°同步交换左右位R≈270px同弧同向会相撞感上下分弧是礼让的身体语言A 灯光交接名牌 opacity 0.280.72·lit、saturate 0.350.65·lit、lit0.6 加辉光交接在绕位中段 70–84f easeInOut 完成一亮一暗是话语权移交两个都亮读不出主从A 转场放大100–134f easeInscale 2.8→68 冲向画外角落名牌同步淡出easeIn 加速是甩出的关键巨箭头即前景遮挡物接 transition-hidden-cut 语法B 入场5 枚 delay 0/5/9/13/17f 错峰spring(damping 15)名牌晚 12f 淡入上浮 10px名牌跟光标同帧出现读作贴纸随减速淡入才是人到了自报家门B 漂移双频正弦叠加0.055/0.021 rad/f每枚相位不同幅度 ±46/30px单频正弦读作钟摆双频不同相才是人手的随机B 打字 cameo落位后 60f 线性吐字 光标条 8f 周期闪装饰性打字可 1f/字符级正文交互打字回 typewriter-moves 节奏B 聚拢92f 起 26f easeInOut 到围观位漂移幅度衰减到 25% 保留聚拢后漂移不能归零——完全静止的光标群读作死机实战坑与协作规则参数是调校起点非实战定稿两个 demo 都在灰阶/占位素材上通过调校B 式依赖 Fixtures.tsx 的G灰阶调色板首次实战须以真实素材回验。名牌颜色 身份编码全片必须一致蓝 Designer 就一直蓝中途换色观众会以为换了人。使用次数受 P4 规则约束见 aesthetic-rules.md 的一种动画手法全片只当一次主角A 式是全片一段的戏≤1 次B 式是可全片驻场的氛围层。两式同片可共存但 A 的两枚主角必须从 B 的群演里出同名同色。氛围层要让戏B 式漂移光标永远不许盖住正在阅读的主内容漂移范围须避开主体安全区。与 input-trigger-moves 的分工那张卡的光标是操作 UI点击有 payload本卡光标是表演给你看位移即剧情光标要点东西时回那张卡。声音设计可对照 sound-design.mdA 绕位配轻 whoosh、交接一声柔和 chime、放大甩出一声重 whooshB 入场每枚一声极轻 pop漂移段静打字段 keyboard 轻声。落地运行复制、注册与验证按 demos/README.md 的规范这两个组件是原生 Remotion 实现用法是 copy 进你的项目30fps / 1920×1080注册成 Composition 即可import React from react; import { Composition, registerRoot } from remotion; import { CursorDialogueDuet } from ./CursorDialogueDuet; import { CursorCastEnsemble } from ./CursorCastEnsemble; export const Root: React.FC () ( Composition idCursorDialogueDuet component{CursorDialogueDuet} durationInFrames{140} fps{30} width{1920} height{1080} / Composition idCursorCastEnsemble component{CursorCastEnsemble} durationInFrames{140} fps{30} width{1920} height{1080} / / ); registerRoot(Root);三个实操注意点手动指定 140 帧时长这两个组件不像 Motion 系 demo 那样导出卡名大写蛇形_DURATION注册时按卡面时长 140f约 4.7s手动传durationInFrames。B 式必须带上 Fixtures.tsx它import { G } from ../../_fixtures/Fixturescopy 后需把 import 路径改成你项目里的位置A 式仅依赖 remotion无额外共享依赖。验证路径新增/修改的 demo 应能通过tsc --noEmit --strict与 CI 的 verify job 一致并可用python3 assets/scripts/smoke-render-demos.py做渲染冒烟自动扫描带_DURATION/_DUR导出的 demo 逐帧渲染首帧断言非空堵住能编译不能运行的问题。参考实现与原片出处A dialogue-duetdemos/interaction/collab-cursor-moves/CursorDialogueDuet.tsx原片出处 figma-devmode 0:16–0:20B cast-ensembledemos/interaction/collab-cursor-moves/CursorCastEnsemble.tsx原片出处 figma-devmode 0:05 miro-promo 全片 cursor-ensemble-ambience pitch-app 82–90s 打字 cameo卡片原文意图/选型/参数表/已知坑的完整出处references/shots/interaction/collab-cursor-moves.md。赞分享AI 技能媒体生成视频【免费下载链接】video-shotcraftAI video skill for Claude Code Codex — cinematic product videos with Remotion: 152 shot recipe cards, 209 motion previews, a production-ready template项目地址https://gitcode.com/gh_mirrors/vi/video-shotcraft点击查看免费下载相关推荐协作光标当演员video-shotcraft 的 dialogue-duet 与 cast-ensemble 两式镜头语法协作光标当演员video shotcraft 的 dialogue duet 与 cast ensemble 两式镜头语法 导读 本文讲解 video shoAI 技能媒体生成视频video-shotcraft 光效三式Spotlight 扫字、Sheen 单点扫光与 Halation 撞停晕染的 Remotion 实现video shotcraft 光效三式Spotlight 扫字、Sheen 单点扫光与 Halation 撞停晕染的 Remotion 实现 本篇聚焦 viAI 技能媒体生成视频video-shotcraft 图标表演两式解析爆花确认与求关注弹跳的帧级 Remotion 实现video shotcraft 图标表演两式解析爆花确认与求关注弹跳的帧级 Remotion 实现 本篇技术文章围绕 video shotcraft 镜头库中AI 技能媒体生成视频上一篇Tom Select高级用法多选、标签、联系人列表的实战案例下一篇终极Claude HUD配置指南3种预设布局自定义元素顺序完全教程创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考