Inspiration

We wanted to create an experience that felt like time-traveling through the evolution of AI, blending sci-fi aesthetics with educational storytelling. The idea was to build a virtual museum from the future, showing how AI transforms every aspect of human life.

What it does

ChronoAI is an interactive, scroll-driven website that guides users through key AI milestones from 2025 to 2075. As visitors scroll, they unlock immersive sections with 3D animations, holographic visuals, ambient soundscapes, and dynamic content, all designed to feel like a cinematic archive from the year 2075.

How we built it

Animations: GSAP & ScrollTrigger for smooth transitions 3D & Visuals: Three.js for interactive models and backgrounds Assets: Lottie animations for dynamic UI elements Audio: Ambient sounds and subtle SFX for immersion Responsive Design: Optimized for desktop and mobile

Challenges we ran into

Achieving smooth performance with heavy animations and 3D effects Synchronizing scroll-based triggers with audio and visual layers Designing a UI that feels futuristic yet intuitive Making sure the experience stayed responsive on different devices

Accomplishments that we're proud of

Creating a seamless, time-travel storytelling experience Blending cinematic visuals with educational content Building a custom cursor and parallax effects that elevated immersion Designing a site that feels truly from the year 2075

What we learned

How to combine Three.js, GSAP, and Lottie effectively Best practices for scroll-driven storytelling interfaces Techniques for optimizing performance in animation-heavy projects The power of sound design in creating emotional engagement

What's next for ChronoAI: The 2075 Virtual AI Museum

Adding voice narration for each milestone Expanding the timeline with speculative scenarios beyond 2075 Implementing user profiles and saving exploration progress Launching the experience as an educational platform for AI literacy

Built With

Share this project:

Updates