What is this?
A photo carousel built from two layers: a frame that moves with the drag, and an image inside that moves more slowly. The speed difference gives a bit of depth. Three geometry versions live behind the Version control: stack, circle, and arc.
Notes
14 Jun. Version 1, stack
Started with a card deck. One photo in front, a couple peeking behind with lower opacity and a slight tilt. Felt familiar. Easy to read which photo is active.
The problem showed up as soon as you drag between cards. During the handoff, frames overlap in a way that would never happen with real paper. Two photos occupy the same space for a beat. It looks clever for a second, then wrong.
Opacity helps a little. Not enough. The geometry itself allows the collision.
21 Jun. Version 2, circle
Tried putting every photo on a ring. rotateY and translateZ so the deck becomes a carousel in space. More dramatic. You can see where photos go when they leave the front.
Cards still cross through each other on the way around. Maybe worse, because the motion is continuous and the intersection lasts longer.
28 Jul. Version 3, arc
Pulled the ring open into an arc. Continuous scroll, no hard end. Photos travel on a curve instead of stacking flat or spinning a full circle. Softer than V2. Still readable as a strip.
Overlap is quieter here but not gone. Photos still pass through each other near the apex of the curve.
28 Jul. Open question
In the real world, solid things cannot share the same volume. I want the transition to respect that. Possible paths: wider spacing so frames never meet, tighter opacity so the crossing is invisible, or a layout where the path itself prevents intersection. Have not settled on one yet. Leaving all three versions here while I decide.