Skip to content
Docs
Open Promoeyes
butterflies

butterflies

morph="butterflies" — paper butterflies (match-morph-butterflies.ts).

Read the rig's notes
The outgoing picture is cut on a grid of small tiles; every tile becomes a
paper butterfly — two wings hinged on its centre line, printed with that
piece of the picture. They peel up toward the lens, their outlines cut into
fore- and hindwings with a dark body on the hinge, and flutter up into a
swirling column (one full turn about the swarm axis, wander, banking, a bob
on every down-stroke). Mid-flight each print swaps to its tile of the
incoming picture; the butterflies glide back down onto their new cells
wing to wing, the beats die out and the wings flatten into the incoming
element. Exact at both ends — flat, unshaded tiles of the two snapshots.

One scene, in-scene morph-to links (scene-morph.ts), 1.8 s per hand-off:

  2.0 → 3.8   stat card → iphone        defaults (count 140 · spread 1 · stagger 0.35)
  5.0 → 6.8   iphone → ipad             nested form · count=220 spread=1.15 color=#fff3dc
  8.0 → 9.8   ipad → stat card          count=90 stagger=0.55 (bigger butterflies, a longer trickle)

Knobs: morph-count (butterflies per element, 140) · morph-spread (swarm size,
1 = the larger element's long edge) · morph-stagger (departure spread, 0.35) ·
morph-color (paper: backing of inkless cells + wing undersides, #f4eee2) ·
morph-seed.

Camera never stops (linear kfs, r 1151 about 0 120 0): each hand-off swings
across the subject — −26°→+34°, +39°→−23°, −33°→+28° azimuth, 8% closer mid-window.

Preview: http://localhost:4444/runtime?project=promos/primitives/morphs/butterflies.promo
Topic
morphs
Scenes
1
Kind
reference rig
//
    morph="butterflies" — paper butterflies (match-morph-butterflies.ts).

    The outgoing picture is cut on a grid of small tiles; every tile becomes a
    paper butterfly — two wings hinged on its centre line, printed with that
    piece of the picture. They peel up toward the lens, their outlines cut into
    fore- and hindwings with a dark body on the hinge, and flutter up into a
    swirling column (one full turn about the swarm axis, wander, banking, a bob
    on every down-stroke). Mid-flight each print swaps to its tile of the
    incoming picture; the butterflies glide back down onto their new cells
    wing to wing, the beats die out and the wings flatten into the incoming
    element. Exact at both ends — flat, unshaded tiles of the two snapshots.

    One scene, in-scene morph-to links (scene-morph.ts), 1.8 s per hand-off:

      2.0 → 3.8   stat card → iphone        defaults (count 140 · spread 1 · stagger 0.35)
      5.0 → 6.8   iphone → ipad             nested form · count=220 spread=1.15 color=#fff3dc
      8.0 → 9.8   ipad → stat card          count=90 stagger=0.55 (bigger butterflies, a longer trickle)

    Knobs: morph-count (butterflies per element, 140) · morph-spread (swarm size,
    1 = the larger element's long edge) · morph-stagger (departure spread, 0.35) ·
    morph-color (paper: backing of inkless cells + wing undersides, #f4eee2) ·
    morph-seed.

    Camera never stops (linear kfs, r 1151 about 0 120 0): each hand-off swings
    across the subject — −26°→+34°, +39°→−23°, −33°→+28° azimuth, 8% closer mid-window.

    Preview: http://localhost:4444/runtime?project=promos/primitives/morphs/butterflies.promo
promo#morph-butterflies
  scene#one(duration=11)
    camera(type=perspective fov=42 near=8.5 far=17000 position="-604 280 967" look_at="0 120 0")
      properties
        frame
          keyframes
            kf(time=0 easing=linear position="-604 280 967" look_at="0 120 0")
            kf(time=2 easing=linear position="-502 240 1029" look_at="0 120 0")
            kf(time=2.9 easing=linear position="0 102 1059" look_at="0 120 0")
            kf(time=3.8 easing=linear position="636 -60 942" look_at="0 120 0")
            kf(time=5 easing=linear position="693 457 855" look_at="0 120 0")
            kf(time=5.9 easing=linear position="-37 267 1048" look_at="0 120 0")
            kf(time=6.8 easing=linear position="-449 80 1059" look_at="0 120 0")
            kf(time=8 easing=linear position="-622 -20 958" look_at="0 120 0")
            kf(time=8.9 easing=linear position="18 212 1055" look_at="0 120 0")
            kf(time=9.8 easing=linear position="524 398 986" look_at="0 120 0")
            kf(time=11 easing=linear position="589 418 943" look_at="0 120 0")
    background(top=#141a2b bottom=#05070d)
    environment(hdr="studio_small_04_2k" as_background=false background_color=#05070d exposure=1.0 blurriness=0.5 intensity=0.6)
    lights
      light#amb(type=ambient color=#9fb4ff intensity=0.8)
      light#key(type=directional color=#ffffff intensity=2 position="340 680 510")
      light#fill(type=directional color=#7aa2ff intensity=0.6 position="-510 170 340")
    haze#hz0(blend=add opacity=0.22 position="-900 400 -1600" color=#3b5bff size="120000 100000" pulse=0 decay=0)
    haze#hz1(blend=add opacity=0.16 position="900 -500 -1700" color=#ff7a3b size="110000 90000" pulse=0 decay=0)
    text#title(text="butterflies" kind=layer font="Roboto" size=200 worldHeight=40 color=#e8eefc weight=700 align=center position="0 -258 0")
    text#sub(text="the picture breaks into paper butterflies that flutter up and settle into the partner" kind=layer font="Roboto" size=110 worldHeight=18 color=#8ea3c8 weight=500 align=center position="0 -292 0")

    // 2.0 → 3.8 · stat card → iphone · defaults
    ui3d#card(morph=butterflies morph-to=phone morph-at=2 morph-dur=1.8 width=600 height=440 world_width=300 position="0 -60 0" rotation="0 -12 0")
      card(x=0 y=0 w=600 h=440 r=34 fill=#fff3e3 stroke=#ff8a4c stro