Back to Details

moda-video-motion

Compare original and translation side by side

🇺🇸

Original

English
🇨🇳

Translation

Chinese

moda-video-motion

moda-video-motion

<!-- moda:banner -->
PREREQUISITE — load 
moda-core
once per session (step-0, write contract, free/metered map). Already loaded? Skip ahead. If you cannot load it, the non-negotiables: run 
moda doctor --json
before anything; 
moda brand list
before creating; every write carries the latest revision — on 
stale_revision
, re-read and retry once (it heals); send the canvas link the moment it exists; stuck or failed? 
moda ask "<question>"
— free and fast, never guess.
<!-- /moda:banner -->
<!-- moda:banner -->
前提条件——每个会话仅需加载一次
moda-core
（步骤0，签署协议，免费/按使用量计费映射）。已加载？请跳过此步骤。若无法加载，务必执行以下操作：先运行
moda doctor --json
；创建前先执行
moda brand list
；每次写入操作需携带最新版本号——若出现
stale_revision
，重新读取并重试一次即可解决；画布链接生成后立即发送；遇到卡顿或失败？执行
moda ask "<question>"
——免费且响应迅速，切勿自行猜测。
<!-- /moda:banner -->

Sizes and defaults

尺寸与默认设置

PieceSize
--category
Export
Landscape motion / stinger1920×1080
animation
--format mp4 --page N
Vertical post, story, reel1080×1920
animation
mp4 (gif for a loop)
Square animated post1080×1080
animation
mp4 or gif
Animated banner adthe ad's exact size
animation
gif
Shader-fill backgroundany canvasanymp4/gif — it freezes in stills
Four facts that decide most of the work:
  • Keyframes and clip sequencing apply ONLY on 
    --category animation
    ; on any other canvas every motion call is dropped with a warning. Animated shader fills move anywhere.
  • Static exports (png/jpeg/pdf/pptx) of animation and video-filled nodes render BLANK or frozen — deliver mp4/gif, and say so if a still is requested.
  • mp4/gif REQUIRE 
    --page N
    : one animated page per file. A page with no animation rejects typed 
    no_animation
    — the honest answer is a still + the link.
  • Everything in this recipe is unmetered: iteration costs nothing.
作品类型尺寸
--category
参数		导出设置
横版动效/转场动画1920×1080
animation
--format mp4 --page N
竖版帖子、故事、短视频1080×1920
animation
mp4（循环动作用gif）
方形动态帖子1080×1080
animation
mp4或gif
动态横幅广告广告指定的精确尺寸
animation
gif
着色器填充背景任意画布尺寸任意mp4/gif——静态导出时会冻结
决定大部分工作的四个关键事实：
  • 关键帧和片段序列仅适用于
    --category animation
    ；在其他类型的画布上，所有动效调用都会被丢弃并发出警告。动态着色器填充可在任意画布上生效。
  • 动效和视频填充节点的静态导出（png/jpeg/pdf/pptx）会呈现空白或冻结状态——请交付mp4/gif格式，若用户要求静态图需提前说明。
  • 导出mp4/gif必须指定
    --page N
    ：每个文件对应一个动效页面。无动效的页面会返回
    no_animation
    提示——正确的处理方式是提供静态图加画布链接。
  • 本指南中的所有操作均不计费：反复迭代无需成本。

Recipe — motion on a canvas

指南——画布添加动效

  1. moda canvas create --name "[Piece]" --intent "[one-line brief]" --size [WxH] --pages 1 --category animation --brand [KIT]
    — send the link immediately.
  2. Author the still frame FIRST — real type, brand geometry, layout: 
    moda canvas markup [CANVAS_REF] --file - --page [PAGE_ID]
    (references/markup.md). Motion on a bad frame is a bad piece that moves.
  3. moda canvas screenshot [CANVAS_REF]
    — fix the frame before animating.
  4. Add motion: 
    moda canvas edit [CANVAS_REF] --file motion.js
    — a 
    motion.page(...)
    program with tweens, effects, staggers and recipes. Shapes and named recipes (logo sting, animated stat, kinetic type, shader background) are in references/motion-recipes.md — author from it, don't probe.
  5. Draft-judge the movement: 
    moda export [CANVAS_REF] --format gif --page [N] -o draft.gif
    and look at it. A screenshot shows one frozen frame — it cannot tell you whether the motion works.
  6. Deliver: live link FIRST, then 
    moda export [CANVAS_REF] --format mp4 --page [N] -o [piece].mp4
    . Read 
    warnings[]
    .
  1. moda canvas create --name "[作品名称]" --intent "[一行简短说明]" --size [宽×高] --pages 1 --category animation --brand [品牌套件]
    ——立即发送生成的画布链接。
  2. 先创作静态帧——使用真实字体、品牌几何元素和布局：
    moda canvas markup [画布引用ID] --file - --page [页面ID]
    （参考references/markup.md）。基础帧效果差的话，动效再好看也没用。
  3. moda canvas screenshot [画布引用ID]
    ——在添加动效前先优化静态帧。
  4. 添加动效：
    moda canvas edit [画布引用ID] --file motion.js
    ——编写包含补间动画、特效、stagger效果和预设模板的
    motion.page(...)
    程序。图形和预设模板（Logo转场、动态数据展示、动态文字、着色器背景）可参考references/motion-recipes.md——直接使用预设，无需自行摸索。
  5. 预览动效：
    moda export [画布引用ID] --format gif --page [N] -o draft.gif
    并查看效果。截图只能展示单帧静态画面，无法判断动效是否合适。
  6. 交付：先提供实时画布链接，再执行
    moda export [画布引用ID] --format mp4 --page [N] -o [作品名称].mp4
    。请查看返回的
    warnings[]
    信息。

Recipe — footage under real type (timeline compositing)

指南——文字叠加视频素材（时间线合成）

  1. Get the clip into team files: 
    moda file upload [clip.mp4]
    , or reuse the durable 
    file_…
    a generated render returned (moda-video-clip owns generation).
  2. Animation canvas at the delivery size, then place the clip with 
    <video src="file_…" width="1920" height="1080" fit="cover"/>
    via 
    moda canvas markup [CANVAS_REF] --file - --page [PAGE_ID]
    — the clip is a fill; layer type and brand marks above it.
  3. Sequence and trim in 
    moda canvas edit [CANVAS_REF] --file cut.js
    (
    t.video(node, { startMs })
    ; trim/rate/loop via 
    update()
    — references/edit-code.md).
  4. moda export [CANVAS_REF] --format mp4 --page [N] -o [piece].mp4
    , then read 
    warnings[]
    : server mp4 muxes audible clip audio, and 
    audio_source_dropped
    names anything that did not survive. Relay it — never a silent loss.
  1. 将视频素材上传至团队文件：
    moda file upload [clip.mp4]
    ，或复用生成渲染结果返回的持久化
    file_…
    ID（moda-video-clip负责素材生成）。
  2. 创建对应交付尺寸的动效画布，然后通过
    moda canvas markup [画布引用ID] --file - --page [页面ID]
    命令添加视频素材，代码为
    <video src="file_…" width="1920" height="1080" fit="cover"/>
    ——视频素材作为填充层，在其上方添加文字和品牌标识。
  3. 通过
    moda canvas edit [画布引用ID] --file cut.js
    进行素材剪辑和排序（使用
    t.video(node, { startMs })
    ；通过
    update()
    进行裁剪/调速/循环——参考references/edit-code.md）。
  4. moda export [画布引用ID] --format mp4 --page [N] -o [作品名称].mp4
    ，然后查看
    warnings[]
    信息：服务器端mp4会合并视频原音，
    audio_source_dropped
    提示会列出未保留的音频内容。请告知用户相关情况——切勿隐瞒无声损失。

Examples

示例

  • "an animated banner ad, 300×250" → motion recipe at the ad's exact size → gif.
  • "a stinger from our logo" → motion recipe, 
    recipe-rise
    + a shader backdrop.
  • "make this post move" → import/rebuild the frame on an animation canvas, then animate.
  • "cut these two clips together with our headline over them" → compositing recipe.
  • "a video from these 5 photos" → compositing recipe: place, sequence, export mp4.
  • “制作一个300×250的动态横幅广告”→使用对应尺寸的动效模板→导出gif格式。
  • “基于我们的Logo制作转场动画”→使用动效模板，
    recipe-rise
    加着色器背景。
  • “让这个帖子动起来”→在动效画布上导入/重建原帧，然后添加动效。
  • “把这两个视频素材剪辑在一起，并叠加我们的标题”→使用合成模板。
  • “用这5张照片制作视频”→使用合成模板：放置素材、排序、导出mp4。

Errors

错误处理

Any typed error → load moda-core and read its recovery reference. Edit programs are atomic — a failure means NOTHING applied: re-read, fix the program, re-run. 
no_animation
on export means the page has no motion yet.
任何输入错误→加载moda-core并查看其恢复指南。 编辑程序是原子性的——执行失败意味着没有任何更改生效：重新阅读指南、修复程序后重新运行。导出时出现
no_animation
提示意味着页面尚未添加动效。

Make it recurring

实现自动化复用

The weekly animated post → moda-automate; a stinger or lower-third you will reuse on every future piece → moda-templates.
See also: moda-video — the lane fork, generated clips, cost boundaries · moda-core — the contract, recovery, everything Moda can do.
每周动态帖子→使用moda-automate；需要在未来所有作品中复用的转场动画或下三分之一字幕条→使用moda-templates。
另请参阅：moda-video——分支功能、生成素材、成本边界 · moda-core——协议、恢复机制、Moda的所有功能。

References

参考文档

DocLoad when
references/motion-recipes.mdany named deliverable: logo sting, teaser, animated ad
references/edit-code.mdbefore writing an edit program: batches, revisions, warnings
references/video.mdthe timeline API, canvas video placement, export rules
文档加载时机
references/motion-recipes.md处理指定交付物时：Logo转场、预告视频、动态广告
references/edit-code.md编写编辑程序前：批量操作、版本控制、警告信息
references/video.md时间线API、画布视频放置、导出规则