An experimental playground for scroll-based 3D storytelling

ThinkPoint is a self-initiated product design project focused on understanding how scroll behavior and 3D spatial transitions can be used as intentional design tools, not just technical effects. The project treated motion and depth as core UX decisions, exploring how they affect perception, clarity, and emotional engagement in web interfaces.

The challenge was to approach these patterns as a product designer

asking what each motion communicates, when depth aids comprehension and how timing shapes emotional response.

01

Studied scroll-driven and 3D motion patterns across Awwwards-level sites, deconstructing what made them effective or distracting from a UX perspective.

02

Broke the experience into scroll milestones and mapped specific visual events to each, what transforms, what enters, what recedes, and at what pace.

03

Built layered frame sequences in Figma to simulate Z-axis movement and cinematic transitions using easing curves and staggered reveals.

Figma as a motion prototyping environment for 3D-like experiences Rather than jumping into code, the project was designed entirely in Figma using Smart Animate, layered frame composition and scroll-based interaction triggers to simulate 3D depth and cinematic transitions.

The approach drew conceptual inspiration from animation paradigms in Framer Motion, GSAP and Three.js, translating their motion principles into Figma-native interaction design.

✓

Scroll-sequence prototypes in Figma with simulated 3D depth

✓

Figma can validate spatial logic before any code is written

✓

Timing and easing carry more narrative weight than visual complexity