motionrender 0.2.3 → 0.2.5

package/studio/index.html

@@ -7,7 +7,7 @@
     <script>try{var t=localStorage.getItem('ove-theme')||'dark';if(t==='system')t=matchMedia('(prefers-color-scheme: light)').matches?'light':'dark';document.documentElement.dataset.theme=t}catch(e){document.documentElement.dataset.theme='dark'}</script>
     <title>OVE AI studio</title>
     <link rel="icon" href="data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 22 21H2z' fill='%23ededed'/%3E%3C/svg%3E" />
-    <script type="module" crossorigin src="/assets/index-n3DJI_GV.js"></script>
+    <script type="module" crossorigin src="/assets/index-BGdqA-kT.js"></script>
     <link rel="stylesheet" crossorigin href="/assets/index-DmZj9wTZ.css">
   </head>
   <body>

package/templates/product-card/composition.json

@@ -12,16 +12,23 @@
     "from": [0, 0],
     "to": [1080, 1080],
     "stops": [
-      { "offset": 0, "color": "#0b1020" },
-      { "offset": 1, "color": "#211308" }
+      { "offset": 0, "color": "{{bg}}" },
+      { "offset": 1, "color": "{{surface}}" }
     ]
   },
   "variables": {
+    "bg": { "type": "color", "default": "#0b1020", "description": "Theme: bg" },
+    "surface": { "type": "color", "default": "#211308", "description": "Theme: surface" },
+    "text": { "type": "color", "default": "#ffffff", "description": "Theme: text" },
+    "muted": { "type": "color", "default": "#c4b5fd", "description": "Theme: muted" },
+    "accent": { "type": "color", "default": "#f97316", "description": "Theme: accent" },
+    "accent2": { "type": "color", "default": "#fbbf24", "description": "Theme: accent2" },
+    "radius": { "type": "number", "default": 24, "description": "Theme: radius" },
+    "headWeight": { "type": "number", "default": 800, "description": "Theme: headWeight" },
     "product": { "type": "string", "default": "Everyday Mug" },
     "price": { "type": "string", "default": "$18" },
     "badge": { "type": "string", "default": "NEW", "description": "Pill in the top-left corner" },
-    "caption": { "type": "string", "default": "Stoneware · 350 ml" },
-    "accent": { "type": "color", "default": "#f97316" }
+    "caption": { "type": "string", "default": "Stoneware · 350 ml" }
   },
   "scenes": [
     {

package/templates/product-card/template.json

@@ -1,8 +1,8 @@
 {
   "name": "Product card",
-  "description": "A square product card with a drawn mug, badge, name and price. Its variables make it a ready batch template.",
-  "tags": ["product", "ecommerce", "1:1", "batch"],
+  "description": "A square product card with badge, product name, caption and price. Themeable and ready for batch generation.",
+  "tags": ["product", "ecommerce", "1:1", "batch", "themed"],
   "order": 2,
   "previewFrame": 120,
-  "brief": "An 8-second square product card for a stoneware mug: warm dark background, a simple drawn mug, a NEW badge, the product name, a short caption and the price."
+  "brief": "An 8-second square product card: badge, product name, short caption and price."
 }

package/templates/social-reel/composition.json

@@ -12,20 +12,27 @@
     "from": [0, 0],
     "to": [1080, 1920],
     "stops": [
-      { "offset": 0, "color": "#071018" },
-      { "offset": 0.55, "color": "#0a1a20" },
-      { "offset": 1, "color": "#06121a" }
+      { "offset": 0, "color": "{{bg}}" },
+      { "offset": 0.55, "color": "{{surface}}" },
+      { "offset": 1, "color": "{{bg}}" }
     ]
   },
   "variables": {
+    "bg": { "type": "color", "default": "#071018", "description": "Theme: bg" },
+    "surface": { "type": "color", "default": "#0a1a20", "description": "Theme: surface" },
+    "text": { "type": "color", "default": "#f8fafc", "description": "Theme: text" },
+    "muted": { "type": "color", "default": "#9fb0c6", "description": "Theme: muted" },
+    "accent": { "type": "color", "default": "#2dd4bf", "description": "Theme: accent" },
+    "accent2": { "type": "color", "default": "#38bdf8", "description": "Theme: accent2" },
+    "radius": { "type": "number", "default": 24, "description": "Theme: radius" },
+    "headWeight": { "type": "number", "default": 800, "description": "Theme: headWeight" },
     "stepsTitle": { "type": "string", "default": "HOW IT WORKS", "description": "Label above the three steps" },
     "steps": { "type": "string", "default": "01  BRIEF\n02  VALIDATE\n03  RENDER", "description": "Three short steps, one per line, numbered like the example" },
     "footer": { "type": "string", "default": "Generated from a brief. Rendered deterministically.", "description": "Small line at the bottom" },
     "kicker": { "type": "string", "default": "MAKE IT MOVE", "description": "Small label above the headline" },
     "title": { "type": "string", "default": "One brief.\nOne video.", "description": "Headline; a line break starts a new line" },
     "detail": { "type": "string", "default": "Describe the video. OVE writes a composition, checks it against the same schema as a hand-written one, and renders every frame the same way, every time." },
-    "cta": { "type": "string", "default": "Try OVE" },
-    "accent": { "type": "color", "default": "#2dd4bf", "description": "Glow, rule and button colour" }
+    "cta": { "type": "string", "default": "Try OVE" }
   },
   "scenes": [
     {
@@ -81,7 +88,7 @@
           "maxWidth": 900,
           "maxLines": 3,
           "minFontSize": 88,
-          "color": "#f8fafc",
+          "color": "{{text}}",
           "split": { "by": "words", "preset": "rise", "stagger": 5, "duration": 24 }
         },
         {
@@ -107,7 +114,7 @@
           "lineHeight": 1.45,
           "maxWidth": 790,
           "maxLines": 6,
-          "color": "#9fb0c6",
+          "color": "{{muted}}",
           "animations": [
             { "property": "opacity", "keyframes": [{ "frame": 30, "value": 0 }, { "frame": 55, "value": 1 }] }
           ]
@@ -118,7 +125,7 @@
           "x": 880,
           "y": 1650,
           "width": 120,
-          "fill": "{{accent}}",
+          "fill": "{{accent2}}",
           "originX": "center",
           "originY": "center",
           "animations": [
@@ -173,7 +180,7 @@
           "letterSpacing": -2,
           "maxWidth": 900,
           "maxLines": 3,
-          "color": "#f8fafc"
+          "color": "{{text}}"
         },
         {
           "id": "steps-detail",
@@ -185,7 +192,7 @@
           "lineHeight": 1.5,
           "maxWidth": 820,
           "maxLines": 6,
-          "color": "#9fb0c6"
+          "color": "{{muted}}"
         },
         {
           "id": "steps-rule",
@@ -235,7 +242,7 @@
           "maxWidth": 880,
           "maxLines": 2,
           "minFontSize": 72,
-          "color": "#f8fafc"
+          "color": "{{text}}"
         },
         {
           "id": "cta-rule",
@@ -259,7 +266,7 @@
           "fontSize": 32,
           "textAlign": "center",
           "maxWidth": 760,
-          "color": "#9fb0c6"
+          "color": "{{muted}}"
         }
       ]
     }

package/templates/social-reel/template.json

@@ -1,8 +1,8 @@
 {
   "name": "Social reel",
-  "description": "A 20-second vertical reel: a hook, three steps, and a call to action. Good for launches and social posts.",
-  "tags": ["reel", "social", "9:16", "launch"],
+  "description": "A 20-second vertical reel: a hook, three steps, and a call to action. Good for launches and social posts. Themeable.",
+  "tags": ["reel", "social", "9:16", "launch", "themed"],
   "order": 1,
   "previewFrame": 70,
-  "brief": "A 20-second vertical social reel for a product launch: a bold hook, three quick steps (brief, validate, render) and a clear call to action, in a dark teal palette."
+  "brief": "A 20-second vertical social reel for a product launch: a bold hook, three quick steps and a clear call to action."
 }