AI-powered market signals, told through motion

Overview

Nodepay is building an AI-driven prediction system that distils social, news, market, and sentiment data into real-time, actionable signals. For the V2 relaunch, the goal was clear: re-energise an existing large community while clearly communicating value to new users within seconds. I was brought in to design and build a motion-led landing experience that balances high visual impact with clarity, performance, and conversion.

Challenge

• Translating complex, Figma-led motion concepts into production-ready animations without visual glitches.
• Maintaining performance across browsers while working with heavy motion and video assets.
• Iterating rapidly as messaging and product positioning evolved during relaunch.
• Meeting high expectations from an existing user base while attracting new users.

Solution

• Worked closely with design, marketing, and stakeholders to lock a clear motion narrative before development.
• Engineered section-based animation triggers using IntersectionObserver for precise scroll control.
• Combined Framer Motion for micro-interactions with GSAP for marquee, timeline-driven sequences.
• Optimised video delivery with safer codecs, lazy playback, and preload strategies to protect performance.
• Built a motion-first layout system in React and Tailwind with guardrails for transforms, z-index, and scroll timing.
• Instrumented CTAs and interaction points to support rapid post-launch optimisation.

Results

• Strong community response and coverage across major crypto outlets, including CoinMarketCap.
• Approximately 75% of visitors engaged with the page and interacted with primary CTAs.
• Average session duration exceeding 2 minutes.
• 22,000+ click events recorded within the first 3 days.
• Over 7,000,000 NC staked within 72 hours of launch.
• Positioned Nodepay as a premium, motion-led product ahead of full app release.