Aurora Labs

Motion-firstproductexperiences

We design and ship scroll-driven sites, launch films, and conversion paths for teams who care how things feel — not just how they look.

60fps

transform-only animations

a11y

prefers-reduced-motion

Figma

motion context MCP

Builtasacomposablegrid

Bento layouts highlight one primary story block without breaking the motion stack underneath.

Motion system

Shared Framer variants and GSAP scroll primitives — one vocabulary across pages.

Figma merge

Design context + motion context by node id.

shadcn UI

Dialogs, sheets, tabs with accessible defaults.

Lenis scroll

Smooth wheel synced with ScrollTrigger pin sections.

Dark mode

Class-based theme with brand OKLCH tokens.

Ship faster

Scaffold from web-motion-starter, customize sections, run visual QA.

Tip: duplicate this section and swap cells content — grid spans stay in className.

Scroll-drivenstorytelling

Section pins while you scroll; progress and steps scrub with Lenis + GSAP.

Step 1

Design in Figma

Layout, typography, and motion on the same artboard.

Step 2

Export motion context

Keyframes, easing, and snippets via Figma MCP.

Step 3

Merge into React

Match data-node-id, wrap with motion.* or GSAP timelines.

Step 4

Ship

Lenis scroll, reduced-motion fallbacks, shadcn UI polish.

Everythingforcomplexinterfaces

Compose primitives instead of one-off animations in every file.

Framer Motion

Declarative UI motion — stagger, layout, gestures, page transitions.

GSAP ScrollTrigger

Pinned storytelling, scrub timelines, scroll-linked parallax.

Lenis + Base UI

Smooth scroll synced with GSAP; accessible dialogs, sheets, tabs.

Design tokens

Shared motion durations and easings in CSS + TypeScript.

Figma pipeline

get_design_context + get_motion_context merged by node id.

Production ready

Strict TypeScript, eslint, static export friendly sections.

Whatteamssay

Patterns you can copy into client projects without rewriting motion from scratch.

We replaced three animation libraries with this stack. Scroll storytelling finally feels cohesive.

Elena V.

Design lead, Northline

Figma motion context landed in React with matching easing — no more guessing keyframes in DevTools.

Marcus T.

Frontend, Forma Labs

Lenis + ScrollTrigger sync was the missing piece. Pin sections work on the first try.

Sofia R.

Creative dev, Pixel & Co

Simplepricing

Free starter to fork. Paid tiers use Stripe Checkout when env is configured.

Starter

Motion primitives and demo sections to fork.

Free

  • Framer + GSAP setup
  • Lenis scroll
  • 6 section templates

Pro

Figma MCP workflow and shadcn UI blocks.

$29/mo

  • Motion context import
  • Dialog, sheet, tabs
  • Scroll pin storytelling
  • Priority patterns

Team

Multi-page sites with ChatPRD alignment.

$99/mo

  • PRD → implementation
  • Custom design tokens
  • Team rules

Frequentlyaskedquestions

Framer Motion for UI and React layout; GSAP ScrollTrigger for scroll timelines and pin sections; Lenis for smooth scroll. The starter wires them together.

Stayintheloop

Motion patterns and Figma → code tips. No spam.

Ready for your Figma file

Paste a design URL in chat — motion, layout, and components land in this stack with matching easing and timing.

Figma MCP docs