concepts-modes

Morph concepts — the ten NEW modes side by side, ONE scene (shaders/morph-concepts/*.jpg are the before · mid · end references; each mode also has its own reel, promos/primitives/morphs/<mode>.promo).

Read the rig's notes

  row 1   ink · ferrofluid · bloom · butterflies · knit
  row 2   wrap · geode · popup · coral · clockwork

Every block is a stat card that becomes an iphone at 2.0 s over 2.0 s
(in-scene morph-to), all on defaults — 1.0 s is "before", 2.6–3.4 s the
middle, 4.6 s "after".

Camera never stops: linear orbit about the grid centre (r 1850, so the near column
stays framed when swung) — 2.0→4.0 from −19° to +16° via ~0° at 1700.

Preview: http://localhost:4444/runtime?project=promos/primitives/morphs/concepts-modes.promo

Topic: morphs
Scenes: 1
Kind: reference rig

//
    Morph concepts — the ten NEW modes side by side, ONE scene
    (shaders/morph-concepts/*.jpg are the before · mid · end references; each
    mode also has its own reel, promos/primitives/morphs/<mode>.promo).

      row 1   ink · ferrofluid · bloom · butterflies · knit
      row 2   wrap · geode · popup · coral · clockwork

    Every block is a stat card that becomes an iphone at 2.0 s over 2.0 s
    (in-scene morph-to), all on defaults — 1.0 s is "before", 2.6–3.4 s the
    middle, 4.6 s "after".

    Camera never stops: linear orbit about the grid centre (r 1850, so the near column
    stays framed when swung) — 2.0→4.0 from −19° to +16° via ~0° at 1700.

    Preview: http://localhost:4444/runtime?project=promos/primitives/morphs/concepts-modes.promo
promo#morph-concepts-modes
  scene#one(duration=6)
    camera(type=perspective fov=42 near=8.5 far=17000 position="-715.8 -257.5 1686.4" look_at="0 0 0")
      properties
        frame
          keyframes
            kf(time=0 easing=linear position="-715.8 -257.5 1686.4" look_at="0 0 0")
            kf(time=2 easing=linear position="-600.0 -161.2 1742.6" look_at="0 0 0")
            kf(time=3 easing=linear position="29.5 177.9 1692.4" look_at="0 0 0")
            kf(time=4 easing=linear position="492.6 478.8 1717.7" look_at="0 0 0")
            kf(time=6 easing=linear position="576.0 540.9 1672.8" look_at="0 0 0")
    background(top=#101626 bottom=#05070d)
    environment(hdr="studio_small_04_2k" as_background=false background_color=#05070d exposure=1.0 blurriness=0.3 intensity=1.2)
    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.4 position="-900 400 -1600" color=#3b5bff size="120000 100000" pulse=0 decay=0)
    text#title(text="morph concepts · ten new modes" kind=layer font="Roboto" size=200 worldHeight=40 color=#e8eefc weight=700 align=center position="0 580 0")
    text#sub(text="card → iphone at 2.0 s · defaults" kind=layer font="Roboto" size=110 worldHeight=18 color=#8ea3c8 weight=500 align=center position="0 535 0")

    // ── row 1 ────────────────────────────────────────────────────────────────

    // ink
    ui3d#ink-card(morph=ink morph-to=ink-phone morph-at=2 morph-dur=2 width=600 height=440 world_width=240 position="-880 250 0" rotation="0 -12 0")
      card(x=0 y=0 w=600 h=440 r=34 fill=#0b1622 stroke=#35e0ff stroke_width=3 shadow=true layout=column align=start padding="36 0 0 36" gap=16)
        text(text="Active users" size=26 weight=700 color=#8fb4c6 align=left)
        text(text="24,881" size=86 weight=900 color=#f2fbff align=left)
        progress-bar(margin="12 0 0 0" w=528 h=18 fill=0.72 color=#ff5f8a track=#123041)
    iphone#ink-phone(body=graphite scale=1.45 rotation="0 -20 0" position="-880 250 0")
      ui3d(overlay=screen width=71 height=154)
        card(x=0 y=0 w=71 h=154 r=0 fill=#1b0f2e shadow=false)
        card(x=6 y=14 w=59 h=40 r=6 fill=#ff5f8a shadow=false)
        card(x=6 y=60 w=59 h=40 r=6 fill=#ffb547 shadow=false)
        card(x=6 y=106 w=59 h=34 r=6 fill=#35a7ff shadow=false)
    text#lbl-ink(text="ink" kind=layer font="Roboto" size=140 worldHeight=22 color=#e8eefc weight=700 align=center position="-880 90 0")

    // ferrofluid
    ui3d#ff-card(morph=ferrofluid morph-to=ff-phone morph-at=2 morph-dur=2 width=600 height=440 world_width=240 position="-440 250 0" rotation="0 -12 0")
      card(x=0 y=0 w=600 h=440 r=34 fill=#f4f6fb shadow=true layout=column align=start padding="36 0 0 36" gap=16)
        text(text="Signal" size=26 weight=700 color=#46526a align=left)
        text(text="−42 dBm" size=86 weight=900 color=#141b29 align=left)
        progress-bar(margin="12 0 0 0" w=528 h=18 fill=0.58 color=#3d7bff track=#dfe6f3)
    iphone#ff-phone(body=graphite scale=1.45 rotation="0 -20 0" position="-440 250 0")