dsh-figma-to-lottie

使用

用自然语言告诉 agent：

"编译一个 3 秒的加载动画：345×414 画布，浅灰背景，10 根蓝色柱子在 x=215.5 处以 0.48/0.24/0.4/1.4 的缓动上滑，每根错开 100ms。写入 ./loading.lottie.json"

agent 会调用 lottie_compile，传入类似这样的规格：

{
  "frame": { "w": 345, "h": 414, "bg": "#f3f4f6", "name": "loading" },
  "fps": 60,
  "durationMs": 3000,
  "layers": [
    { "type": "rect", "id": "bar-1", "x": 215.5, "y": 112, "w": 57, "h": 13, "r": 6.5,
      "gradient": ["#61adf8", "#8fd1fa"], "slideUp": 15, "startMs": 0 },
    { "type": "rect", "id": "bar-2", "x": 215.5, "y": 137, "w": 57, "h": 13, "r": 6.5,
      "gradient": ["#61adf8", "#8fd1fa"], "slideUp": 15, "startMs": 100 }
  ]
}

产出的 Lottie JSON 可直接用于 iOS / Android / Web（LottieWeb、lottie-ios、lottie-android）。

Usage

Ask the agent in natural language:

"Compile a 3-second loading animation: 345×414 frame, light gray background, 10 blue bars at x=215.5 that slide up with a 0.48/0.24/0.4/1.4 ease, staggered 100ms apart. Write it to ./loading.lottie.json"

The agent calls lottie_compile with a spec like:

{
  "frame": { "w": 345, "h": 414, "bg": "#f3f4f6", "name": "loading" },
  "fps": 60,
  "durationMs": 3000,
  "layers": [
    { "type": "rect", "id": "bar-1", "x": 215.5, "y": 112, "w": 57, "h": 13, "r": 6.5,
      "gradient": ["#61adf8", "#8fd1fa"], "slideUp": 15, "startMs": 0 },
    { "type": "rect", "id": "bar-2", "x": 215.5, "y": 137, "w": 57, "h": 13, "r": 6.5,
      "gradient": ["#61adf8", "#8fd1fa"], "slideUp": 15, "startMs": 100 }
  ]
}

The result is a ready-to-play Lottie JSON for iOS / Android / Web (LottieWeb, lottie-ios, lottie-android).