Zum Hauptinhalt springen
Daten & ROI

Live-Ausgabe der echten Render-Engine — ändere die Einstellungen und sie aktualisiert sich sofort.

Heldenzahl mit Kamerafahrt

motion design

Eine Zahl springt auf eine Karte (der einzige Überschwinger der Szene), während die Kamera langsam heranfährt; darunter zeichnet sich eine Linie.

Ideal für: Die eine Zahl, um die es im ganzen Film geht.

Einstellungen

Schrift
Theme
Größe
Stimmung

In einem Film verwenden

Was du ändern kannst:kickervaluelabelsupport
Für Entwickler (MCP und JSON)

Das ist genau die Szene für create_animation (MCP): Struktur behalten, Worte ändern und den Sprechertext schreiben — die Stimme bestimmt, wie lange die Szene dauert. Mit set_data in update_storyboard einfügen, um einen fertigen Film zu ändern.

{
  "visual": "motion",
  "heading": "The number",
  "narration": "Write the sentence the voice says over this scene; its length is the scene's.",
  "data": {
    "motion": {
      "spec": {
        "version": 1,
        "name": "Hero number",
        "intent": "one figure that carries the beat",
        "camera": "pushIn",
        "exit": "mirror",
        "params": [
          {
            "name": "kicker",
            "type": "text",
            "label": "Eyebrow",
            "default": "Time to a film",
            "maxLength": 24
          },
          {
            "name": "value",
            "type": "text",
            "label": "Figure",
            "default": "3 min",
            "maxLength": 8
          },
          {
            "name": "label",
            "type": "text",
            "label": "What it measures",
            "default": "from a URL to a finished video",
            "maxLength": 40
          },
          {
            "name": "support",
            "type": "text",
            "label": "Support line",
            "default": "Voice, captions and music included",
            "maxLength": 48
          }
        ],
        "layers": [
          {
            "id": "card",
            "kind": "shape",
            "shape": "rect",
            "fill": "surface",
            "radius": "lg",
            "elevation": 3,
            "box": {
              "col": 0.5,
              "row": 1.6,
              "cols": 11,
              "rows": 8
            },
            "tall": {
              "col": 0,
              "row": 1.4,
              "cols": 12,
              "rows": 7.6
            },
            "enter": {
              "primitive": "fadeUp",
              "spring": "gentle"
            }
          },
          {
            "id": "kicker",
            "kind": "text",
            "text": "{{kicker}}",
            "role": "body",
            "uppercase": true,
            "color": "c1",
            "align": "center",
            "maxLines": 1,
            "box": {
              "col": 0,
              "row": 0,
              "cols": 12,
              "rows": 1.2
            },
            "tall": {
              "col": 0,
              "row": 0,
              "cols": 12,
              "rows": 1.1
            },
            "enter": {
              "primitive": "fadeUp",
              "distance": "nudge"
            }
          },
          {
            "id": "value",
            "kind": "number",
            "value": "{{value}}",
            "role": "hero",
            "color": "gradient",
            "align": "center",
            "box": {
              "col": 1,
              "row": 2.2,
              "cols": 10,
              "rows": 4.4
            },
            "tall": {
              "col": 0.5,
              "row": 2,
              "cols": 11,
              "rows": 3.6
            },
            "enter": {
              "primitive": "scaleIn",
              "order": 1
            }
          },
          {
            "id": "label",
            "kind": "text",
            "text": "{{label}}",
            "role": "title",
            "align": "center",
            "maxLines": 2,
            "box": {
              "col": 1,
              "row": 6.9,
              "cols": 10,
              "rows": 1.6
            },
            "tall": {
              "col": 0.5,
              "row": 5.9,
              "cols": 11,
              "rows": 2.2
            },
            "enter": {
              "primitive": "fadeUp",
              "order": 2
            }
          },
          {
            "id": "rule",
            "kind": "shape",
            "shape": "line",
            "stroke": "gradient",
            "strokeWidth": "bold",
            "box": {
              "col": 4.5,
              "row": 8.75,
              "cols": 3,
              "rows": 0.6
            },
            "tall": {
              "col": 3.5,
              "row": 8.3,
              "cols": 5,
              "rows": 0.6
            },
            "enter": {
              "primitive": "drawOn",
              "from": "left",
              "order": 2
            }
          },
          {
            "id": "support",
            "kind": "text",
            "text": "{{support}}",
            "role": "body",
            "color": "sub",
            "align": "center",
            "maxLines": 2,
            "box": {
              "col": 1,
              "row": 10,
              "cols": 10,
              "rows": 1.8
            },
            "tall": {
              "col": 0.5,
              "row": 9.6,
              "cols": 11,
              "rows": 2.2
            },
            "enter": {
              "primitive": "fadeUp",
              "order": 3
            }
          }
        ]
      },
      "name": "Hero number",
      "params": {
        "kicker": "Average reply time",
        "value": "38 s",
        "label": "from a question to an answer",
        "support": "Across 12,000 support chats"
      }
    }
  }
}

Wiederverwenden: data.motion.spec einmal mit save_motion_spec speichern (geprüft wie mit validate_motion_spec), dann kann jede Szene das Visual „motion“ mit data.motion.specId und eigenen Parametern nutzen. Name der Spec: „Hero number“.

Weitere Daten & ROI-Animationen