Kaer Morhen
By bike across the Witcher's Continent
About project
Kaer Morhen is an abstract concept of a gravel race held in the world of the Witcher. The site presents the race route, essential event information, a registration form, and details about the reward awaiting those who complete the challenge.
The centrepiece of the page is a scroll-driven frame-by-frame animation: video generated in Google Flow was split into hundreds of optimised WebP frames using custom tools built in Google AI Studio, then served as a sequence controlled entirely by Lenis scroll position. The result is a cinematic animation that scrubs forward and backward with the direction of the scroll.
This landing page is a reality-detached experiment combining various AI tools to create unexpected experiences for visitors. Sure, a sword on your back instead of a water bottle might weigh you down a little — but you're hardly going to pour isotonic on the drowner you meet by the river...
Technology
Built with Next.js and Tailwind CSS.
Lenis smooth scroll as the engine driving the frame-by-frame animation and overall scroll behaviour.
Motion for scroll-triggered animations.
Nano Banana 2 for generating graphics.
Google AI Studio for building custom tools that split video into optimised WebP frame sequences.
Google Flow (Veo 3) for generating video from graphics created with Nano Banana 2.