Skip to content

Instantly share code, notes, and snippets.

@Hustada

Hustada/Draft-1-2-2026--12-50-39-PM.json

Created January 2, 2026 19:56
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save Hustada/444d29b454fa3a88ab08272577360c9a to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save Hustada/444d29b454fa3a88ab08272577360c9a to your computer and use it in GitHub Desktop.
Download ZIP
Creatomate Template: Draft 1/2/2026, 12:50:39 PM
Raw
Draft-1-2-2026--12-50-39-PM.json
{
"output_format": "mp4",
"width": 1080,
"height": 1920,
"duration": 12,
"frame_rate": 30,
"fill_color": "#1E3A8A",
"elements": [
{
"id": "progress-bar",
"name": "progress-bar-shape",
"type": "shape",
"track": 1,
"time": 0,
"x": "50%",
"y": "4%",
"width": "100%",
"height": "8 px",
"x_anchor": "50%",
"y_anchor": "50%",
"fill_color": "#FBBF24",
"animations": [
{
"type": "wipe",
"easing": "linear",
"fade": false,
"x_anchor": "0%"
}
]
},
{
"id": "progress-dots",
"name": "progress-dots-comp",
"type": "composition",
"track": 2,
"time": 0,
"x": "50%",
"y": "8%",
"width": "30%",
"height": "24 px",
"elements": [
{
"id": "dot-1",
"type": "shape",
"track": 1,
"x": "12.5%",
"y": "50%",
"width": "12 px",
"height": "12 px",
"border_radius": "999 px",
"fill_color": [
{
"time": 0,
"value": "#FBBF24"
},
{
"time": 2.5,
"value": "#FBBF24"
},
{
"time": 2.7,
"value": "rgba(255,255,255,0.4)"
}
]
},
{
"id": "dot-2",
"type": "shape",
"track": 2,
"x": "37.5%",
"y": "50%",
"width": "12 px",
"height": "12 px",
"border_radius": "999 px",
"fill_color": [
{
"time": 0,
"value": "rgba(255,255,255,0.4)"
},
{
"time": 2.5,
"value": "rgba(255,255,255,0.4)"
},
{
"time": 2.7,
"value": "#FBBF24"
},
{
"time": 5,
"value": "#FBBF24"
},
{
"time": 5.2,
"value": "rgba(255,255,255,0.4)"
}
]
},
{
"id": "dot-3",
"type": "shape",
"track": 3,
"x": "62.5%",
"y": "50%",
"width": "12 px",
"height": "12 px",
"border_radius": "999 px",
"fill_color": [
{
"time": 0,
"value": "rgba(255,255,255,0.4)"
},
{
"time": 5,
"value": "rgba(255,255,255,0.4)"
},
{
"time": 5.2,
"value": "#FBBF24"
},
{
"time": 7.5,
"value": "#FBBF24"
},
{
"time": 7.7,
"value": "rgba(255,255,255,0.4)"
}
]
},
{
"id": "dot-4",
"type": "shape",
"track": 4,
"x": "87.5%",
"y": "50%",
"width": "12 px",
"height": "12 px",
"border_radius": "999 px",
"fill_color": [
{
"time": 0,
"value": "rgba(255,255,255,0.4)"
},
{
"time": 7.5,
"value": "rgba(255,255,255,0.4)"
},
{
"time": 7.7,
"value": "#FBBF24"
}
]
}
],
"opacity": [
{
"time": 0,
"value": "0%"
},
{
"time": 0.5,
"value": "100%"
},
{
"time": 9.5,
"value": "100%"
},
{
"time": 10,
"value": "0%"
}
]
},
{
"id": "photo-carousel",
"name": "photo-carousel-comp",
"type": "composition",
"track": 3,
"time": 0,
"duration": 10,
"x": "50%",
"y": "42%",
"width": "100%",
"height": "58%",
"clip": true,
"elements": [
{
"id": "photo-1",
"name": "proj-photo-1-image",
"type": "image",
"track": 1,
"time": 0,
"duration": 3,
"source": "https://picsum.photos/1080/1200",
"fit": "cover",
"animations": [
{
"type": "scale",
"easing": "linear",
"start_scale": "100%",
"end_scale": "110%"
},
{
"type": "fade",
"time": "end",
"duration": 0.5,
"reversed": true
}
]
},
{
"id": "photo-2",
"name": "proj-photo-2-image",
"type": "image",
"track": 1,
"time": 2.5,
"duration": 3,
"source": "https://picsum.photos/1080/1201",
"fit": "cover",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.5
},
{
"type": "scale",
"easing": "linear",
"start_scale": "100%",
"end_scale": "110%"
},
{
"type": "fade",
"time": "end",
"duration": 0.5,
"reversed": true
}
]
},
{
"id": "photo-3",
"name": "proj-photo-3-image",
"type": "image",
"track": 1,
"time": 5,
"duration": 3,
"source": "https://picsum.photos/1080/1202",
"fit": "cover",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.5
},
{
"type": "scale",
"easing": "linear",
"start_scale": "100%",
"end_scale": "110%"
},
{
"type": "fade",
"time": "end",
"duration": 0.5,
"reversed": true
}
]
},
{
"id": "photo-4",
"name": "proj-photo-4-image",
"type": "image",
"track": 1,
"time": 7.5,
"duration": 2.5,
"source": "https://picsum.photos/1080/1203",
"fit": "cover",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.5
},
{
"type": "scale",
"easing": "linear",
"start_scale": "100%",
"end_scale": "105%"
}
]
}
],
"animations": [
{
"type": "wipe",
"time": "start",
"duration": 0.8,
"easing": "cubic-out",
"x_anchor": "0%"
}
]
},
{
"id": "gradient-overlay",
"name": "gradient-overlay-shape",
"type": "shape",
"track": 4,
"time": 0,
"duration": 10,
"x": "50%",
"y": "85%",
"width": "100%",
"height": "40%",
"fill_color": "linear-gradient(0deg, rgba(30,58,138,1) 0%, rgba(30,58,138,0.8) 40%, rgba(30,58,138,0) 100%)"
},
{
"id": "headline-badge",
"name": "headline-badge-comp",
"type": "composition",
"track": 5,
"time": 0,
"duration": 10,
"x": "50%",
"y": "18%",
"width": "90%",
"height": "12%",
"elements": [
{
"id": "just-wrapped-text",
"name": "templ-headline-text",
"type": "text",
"track": 1,
"x": "50%",
"y": "35%",
"width": "100%",
"text": "JUST WRAPPED",
"font_family": "Montserrat",
"font_weight": "700",
"font_size": "55 px",
"x_alignment": "50%",
"y_alignment": "50%",
"fill_color": "#FFFFFF",
"animations": [
{
"type": "text-slide",
"time": "start",
"duration": 0.6,
"easing": "back-out",
"split": "word",
"direction": "up"
}
]
},
{
"id": "location-text",
"name": "proj-neighborhood-text",
"type": "text",
"track": 2,
"x": "50%",
"y": "75%",
"width": "100%",
"text": "Maple Heights",
"font_family": "Inter",
"font_weight": "400",
"font_size": "28 px",
"letter_spacing": "15%",
"text_transform": "uppercase",
"x_alignment": "50%",
"y_alignment": "50%",
"fill_color": "#FBBF24",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.5,
"easing": "quadratic-out"
},
{
"type": "slide",
"time": "start",
"duration": 0.5,
"easing": "quadratic-out",
"direction": "up",
"distance": "20%"
}
]
}
],
"opacity": [
{
"time": 9,
"value": "100%"
},
{
"time": 9.5,
"value": "0%"
}
]
},
{
"id": "project-info",
"name": "project-info-comp",
"type": "composition",
"track": 6,
"time": 0.8,
"duration": 9.2,
"x": "50%",
"y": "76%",
"width": "84%",
"height": "10%",
"elements": [
{
"id": "project-title",
"name": "proj-title-text",
"type": "text",
"track": 1,
"x": "50%",
"y": "30%",
"width": "100%",
"text": "Complete Kitchen Renovation",
"font_family": "Montserrat",
"font_weight": "700",
"font_size": "35 px",
"x_alignment": "50%",
"y_alignment": "50%",
"fill_color": "#FFFFFF",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.5,
"easing": "quadratic-out"
},
{
"type": "slide",
"time": "start",
"duration": 0.5,
"easing": "quadratic-out",
"direction": "up",
"distance": "30%"
}
]
},
{
"id": "project-address",
"name": "proj-address-text",
"type": "text",
"track": 2,
"x": "50%",
"y": "75%",
"width": "100%",
"text": "2847 Riverside Drive, Denver, CO",
"font_family": "Inter",
"font_weight": "400",
"font_size": "22 px",
"x_alignment": "50%",
"y_alignment": "50%",
"fill_color": "rgba(255,255,255,0.8)",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.5,
"easing": "quadratic-out"
},
{
"type": "slide",
"time": "start",
"duration": 0.5,
"easing": "quadratic-out",
"direction": "up",
"distance": "20%"
}
]
}
],
"opacity": [
{
"time": 8.2,
"value": "100%"
},
{
"time": 8.7,
"value": "0%"
}
]
},
{
"id": "outro-section",
"name": "outro-comp",
"type": "composition",
"track": 7,
"time": 9.5,
"duration": 2.5,
"x": "50%",
"y": "50%",
"width": "100%",
"height": "100%",
"fill_color": "#1E3A8A",
"elements": [
{
"id": "outro-logo-bg",
"type": "shape",
"track": 1,
"x": "50%",
"y": "38%",
"width": "140 px",
"height": "140 px",
"border_radius": "24 px",
"fill_color": "#FFFFFF",
"animations": [
{
"type": "scale",
"time": "start",
"duration": 0.5,
"easing": "back-out",
"start_scale": "0%",
"end_scale": "100%"
}
]
},
{
"id": "outro-logo",
"name": "biz-logo-image",
"type": "image",
"track": 2,
"x": "50%",
"y": "38%",
"width": "120 px",
"height": "120 px",
"source": "https://placehold.co/200x200/png",
"fit": "contain",
"animations": [
{
"type": "scale",
"time": "start",
"duration": 0.5,
"easing": "back-out",
"start_scale": "0%",
"end_scale": "100%"
}
]
},
{
"id": "outro-company-name",
"name": "biz-name-text",
"type": "text",
"track": 3,
"x": "50%",
"y": "54%",
"width": "80%",
"text": "Summit Construction Co.",
"font_family": "Montserrat",
"font_weight": "700",
"font_size": "44 px",
"x_alignment": "50%",
"y_alignment": "50%",
"fill_color": "#FFFFFF",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.4,
"easing": "quadratic-out"
},
{
"type": "slide",
"time": "start",
"duration": 0.4,
"easing": "quadratic-out",
"direction": "up",
"distance": "20%"
}
]
},
{
"id": "outro-tagline",
"name": "biz-tagline-text",
"type": "text",
"track": 4,
"x": "50%",
"y": "62%",
"width": "80%",
"text": "Building Dreams Since 1987",
"font_family": "Inter",
"font_weight": "400",
"font_size": "22 px",
"x_alignment": "50%",
"y_alignment": "50%",
"fill_color": "rgba(255,255,255,0.7)",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.4,
"easing": "quadratic-out"
}
]
},
{
"id": "outro-cta-bg",
"type": "shape",
"track": 5,
"x": "50%",
"y": "74%",
"width": "280 px",
"height": "56 px",
"border_radius": "999 px",
"fill_color": "#FBBF24",
"animations": [
{
"type": "scale",
"time": "start",
"duration": 0.5,
"easing": "back-out",
"start_scale": "0%",
"end_scale": "100%"
}
]
},
{
"id": "outro-cta-text",
"name": "biz-cta-text",
"type": "text",
"track": 6,
"x": "50%",
"y": "74%",
"width": "260 px",
"text": "Get Your Free Estimate",
"font_family": "Montserrat",
"font_weight": "700",
"font_size": "18 px",
"x_alignment": "50%",
"y_alignment": "50%",
"fill_color": "#1E3A8A",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.5,
"easing": "quadratic-out"
}
]
},
{
"id": "outro-phone",
"name": "biz-phone-text",
"type": "text",
"track": 7,
"x": "50%",
"y": "82%",
"width": "80%",
"text": "(303) 555-0147",
"font_family": "Inter",
"font_weight": "600",
"font_size": "28 px",
"x_alignment": "50%",
"y_alignment": "50%",
"fill_color": "#FFFFFF",
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.5,
"easing": "quadratic-out"
}
]
}
],
"animations": [
{
"type": "fade",
"time": "start",
"duration": 0.5,
"easing": "quadratic-out"
}
]
}
]
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment