back_to_projects
table: projects / row: xai-intelligence-workspace
Xai Intelligence Workspace
liveInteractive data-to-intelligence product experience
tech_stack
Next.js 15Three.jsReact Three FiberGSAPFramer MotionTailwind CSS
overview
A single-page interactive product experience that visualises how raw data becomes structured intelligence. A scroll-driven narrative transforms scattered particle fields into an ordered lattice across four sections — hero morph, insight flow, dashboard preview, and a signature 14×14 grid interaction — unifying Three.js geometry, GSAP scroll choreography, and Framer Motion micro-interactions.
challenges
Orchestrating three animation tools around one shared scroll narrative so particles, SVG morphs, and 3D geometry stay perfectly synchronised without visual drift.
future_improvements
Add WebGL performance profiling, expand into multi-page product documentation, and ship a production landing build with analytics.