Skip to content

Life Timeline

A biography in flat-vector scenes: a new colour wipes in per milestone, springy shapes, and a year bar that advances along the bottom.

16:9Medium pace9swarmnarrativeclean

Minimal flat-vector biographical film. A black opener sets the turn, then each milestone gets its own solid colour field, a huge year with an AGE label, a short bold headline, one caption and a flat illustration built from circles, rectangles and simple geometric people. A thin year-tick bar runs along the bottom with a marker that advances and arcs that link each milestone, ending on a quote card.

Use this style

With Frame Jam installed, press Use this style in the local gallery, or just ask your agent:

Make a video with the Frame Jam style "life-timeline" and open it for review.

style.json Install Frame Jam

Palette

opener#0b0b0c

cream#f3e8cd

mustard#eab43a

sage#a8c69f

coral#f07d66

sky#80c4ea

charcoal#2a2d33

ink#1d1b19

paper#fff6e0

wood#d9a56c

Type

Display: Bricolage Grotesque 800Year at 250px with -0.04em tracking, headlines 84px, line-height 1.02, max three lines
Body: DM Sans 500, 700Captions 38px at 500, AGE pill and bar labels 24–34px at 700 with 0.16em tracking

Motion

Wipe: power3.inOut
Spring: back.out(1.8)
TextIn: expo.out
Marker: power3.inOut
Average shot: 1.15s

Black opener 0.9s, then five milestones of ~1.15s, then a 2.3s closing quote card. Every scene: wipe, text cascade, illustration spring, then one small secondary motion (a plane sliding, a chart line drawing, a ticket swaying).

Transitions and text

solid background colour wipes in from the right in 0.42s, led by a darker band 0.08s ahead
the previous scene is hidden only after the wipe covers it
timeline marker travels to the new year in the same 0.6s while an arc draws behind it
year rises 80px with expo.out, 0.45s, 0.3s after the wipe starts
AGE pill slides in from the left with back.out(2)
headline then caption rise 40px then 24px, staggered 0.12s
illustration parts pop from scale 0.15 at the feet (transform-origin 50% 100%) with back.out(1.8), 0.06s stagger

Style guide your agent follows

One scene per milestone, ~1.15s each, each on its own solid colour (cream #f3e8cd, mustard #eab43a, sage #a8c69f, coral #f07d66, sky #80c4ea, charcoal #2a2d33). Open on black #0b0b0c with a single line and a white icon, close on a quote card.
Left column: year in Bricolage Grotesque 800 at 250px, an outlined 'AGE 17' pill (34px DM Sans 700, 0.16em tracking), an 84px headline of at most three lines, and one 38px caption. Right column: one flat illustration, 840x780, no strokes except tiny details.
Build illustrations from circles, rects and simple paths; people are a head circle, rounded torso, two leg bars and line arms. Group parts as `.pop` and spring them from scale 0.15 with transform-origin 50% 100%, back.out(1.8), 0.06s stagger.
Transition by wipe: darker band, then the next colour, x 1920→0 in 0.42s power3.inOut; keep the old scene visible underneath until the wipe finishes. Never crossfade.
Bottom bar at y≈955: thin 4px line from x=120 to 1800, a small tick for every year, taller ticks on milestones, a circle marker and linking arcs that advance in the same 0.6s as the wipe; year labels fade in as they are reached.
Write specific, humble facts for a single person (ages, prices, counts) and keep headlines under 6 words. Avoid gradients, shadows and photo textures; keep fills flat.