Aller au contenu principal
Preuve sociale

Sortie en direct du vrai moteur de rendu — modifiez les réglages et elle se met à jour instantanément.

Mur de logos

motion design

Les noms des clients remplissent une grille sur un panneau pendant que la caméra dérive.

Idéal pour : « Ils nous font confiance » sans une bande de logos minuscules.

Réglages

Police
Thème
Taille
Humeur

L'utiliser dans un film

Ce que vous pouvez changer :kickernames
Pour les développeurs (MCP et JSON)

Voici la scène exacte à envoyer à create_animation (MCP) : gardez la structure, changez les mots et écrivez la narration — c'est la voix qui fixe la durée de la scène. Collez-la dans update_storyboard avec set_data pour modifier un film déjà fait.

{
  "visual": "motion",
  "heading": "Trusted by",
  "narration": "Write the sentence the voice says over this scene; its length is the scene's.",
  "data": {
    "motion": {
      "spec": {
        "version": 1,
        "name": "Logo wall",
        "intent": "the companies that already use it",
        "camera": "drift",
        "stagger": "word",
        "exit": "fadeOut",
        "params": [
          {
            "name": "kicker",
            "type": "text",
            "label": "Title",
            "default": "Trusted by teams at",
            "maxLength": 24
          },
          {
            "name": "names",
            "type": "list",
            "items": "text",
            "label": "Names",
            "min": 4,
            "max": 6,
            "default": [
              "Northwind",
              "Globex",
              "Initech",
              "Umbrella",
              "Hooli",
              "Acme"
            ]
          }
        ],
        "layers": [
          {
            "id": "kicker",
            "kind": "text",
            "text": "{{kicker}}",
            "role": "display",
            "align": "center",
            "maxLines": 1,
            "box": {
              "col": 0,
              "row": 0,
              "cols": 12,
              "rows": 2.6
            },
            "tall": {
              "col": 0,
              "row": 0.4,
              "cols": 12,
              "rows": 2.4
            },
            "enter": {
              "primitive": "maskReveal"
            }
          },
          {
            "id": "panel",
            "kind": "shape",
            "shape": "rect",
            "fill": "surface",
            "radius": "lg",
            "elevation": 2,
            "box": {
              "col": 0,
              "row": 3,
              "cols": 12,
              "rows": 9
            },
            "tall": {
              "col": 0,
              "row": 3.2,
              "cols": 12,
              "rows": 8.6
            },
            "enter": {
              "primitive": "fadeUp",
              "order": 1
            }
          },
          {
            "id": "name",
            "kind": "text",
            "text": "{{item}}",
            "role": "headline",
            "align": "center",
            "maxLines": 1,
            "repeat": {
              "param": "names",
              "flow": "grid",
              "gap": "md"
            },
            "box": {
              "col": 0.4,
              "row": 3.4,
              "cols": 11.2,
              "rows": 8.2
            },
            "tall": {
              "col": 0.4,
              "row": 3.6,
              "cols": 11.2,
              "rows": 7.8
            },
            "enter": {
              "primitive": "fadeUp",
              "order": 1
            }
          }
        ]
      },
      "name": "Logo wall"
    }
  }
}

Réutilisez-la : enregistrez data.motion.spec une fois avec save_motion_spec (vérifiée comme avec validate_motion_spec), puis toute scène peut utiliser le visuel « motion » avec data.motion.specId et ses propres paramètres. Nom de la spec : « Logo wall ».

Autres animations Preuve sociale