Overview
The project began as a prototype for a small, character-driven game built for a custom engine still in development. While the engine wasn’t yet ready for testing, I led the creation of a one-page interactive experience where users could explore Birdfeed’s universe in a playful, animated format.
What started as a simple test quickly evolved into a full experience built with Rive and Framer. I designed the animation pipeline, translated dozens of custom illustrations into interactive moments, and implemented the entire structure and logic.
In total, I created and integrated over 70 animated assets, helping the studio bring their tone and characters to life for the public.
Process
Early Tests
The project kicked off with animation tests for an early character that didn't make it into the final build. But this phase was essential because it helped me and illustrator Samuel Gull establish a shared visual language and a collaborative pipeline. It laid the groundwork for consistent style and motion across dozens of animations that followed.
Asset Translation
I translated each of Sam's original illustrations into optimized, animatable assets in Rive, carefully preserving their personality and making the responsive. This wasn't a simple conversion: it involved redrawing elements and creatively interpreting how these characters should move and reach in an interactive context.
Interaction Logic
To support playful exploration, I experimented with different interaction styles. We initially used click-to-reveal logic, but early tests showed users were missing key animations.
Switching to hover interactions made content easier to surface and added a natural sense of flow. The final version combined click and hover for a more layered and discoverable experience.
Framer Implementation
Once we shifted toward a web-based format, I built the entire interactive experience using Framer. This included structuring the layout, implementing interactive logic, and integrating all Rive animations across the site.
Originally meant to preview animations, the Framer prototype became a core deliverable.
Technical Challenges
While implementing the animations in Framer, I ran into a core limitation: if one Rive animation’s hitbox overlapped another’s, it could completely block the second from responding to interaction.
I approached this spatially, strategically positioning and layering each animation to avoid interference. This meant carefully planning which characters or elements could appear in each section, and adapting future animation choices based on how they would behave in Framer’s interaction system.
What started as a technical constraint ended up shaping the creative direction: we had to think not just about how things looked, but how they behaved in a live, interactive environment.
Final Result
The final result is a fully interactive, animated website that brings Birdfeed Games' personality to life.
With over 70 custom Rive assets and layered interactions, the experience gives users a playful, scroll-driven preview of studio's tone and characters.
It's not just a placeholder, it's a standalone experience that helped the team showcase their vision and build excitement ahead of launch.
Explore -> birdfeedgames.com