You know that feeling when you crack open a soda and suddenly want to build a fake space-food website with an astronaut koala toy in it? Yeah, neither did we—until we did.
It was one of those “what if” ideas that pops into your head at 11:47 PM when your Blender file refuses to cooperate and your brain’s running on pixel dust. Sergii Valiukh, our founder, decided to follow that itch, and that’s how this project was born.
A fictional fast-food website. From space. With a Happy-Meal-style order builder and surprise toys. No strategy decks, no client meetings. Just creativity, a few space mascots, and one very stubborn shader.
The Idea: Fast Food, Outer Space, and a Toy in Every Box
We called it Planetoño—a word that sounds like it came from a dusty Latin-American soda can, or maybe a forgotten anime VHS. The name needed to feel like the product: fun, bold, hard to pin down.
Sergii mocked up the first 3D scenes—a goofy, colorful world where users could mix and match their intergalactic menu. Pick your main, side, treat, and toy. Then, send it to a friend or yourself as a spacey surprise. Major Paws, the astro-cat. Cluck Rogers, the poultry hero. Koalantis, the cosmic marsupial. If these names don’t make you smile, we don’t know what will.
The structure was simple: a two-part scroll. First, a hero section showing three pre-built combo meals. Second, a step-by-step walk-through of how the order works—each scroll unfolding a new part of the build: burger, fries, toy, delivery box, done. Each scene sliding into place like layers of cardboard in a diorama. Easy to imagine. Much harder to build.
The Scroll That Refused to Scroll
On paper, it looked simple: parallax layers driven by zero-point coordinates. In practice, it was the kind of cursed Blender-to-three.js pipeline that makes you question your life choices.
Every 3D element in the scene had its own “null”—a base point used to animate movement. But when we tried to layer scroll logic, animations broke. Transforms glitched. Z-axis positioning turned into spaghetti. Animating a burger build became a whole physics problem.
Oleg Savenok, our Creative Web Developer, rewrote the entire animation logic in three.js. No exporter could save us. We tested a dozen ways to sync component movement, rewired our import process, and ended up with a custom scroll engine we’ll probably re-use forever.
We also migrated the frontend to Nuxt 4, unlocking modern framework features and making the developer experience much smoother across the board.
But the real bottleneck was performance. Some of the geometry calculations were so heavy, they froze the site for 5–10 seconds during load. Not exactly the vibe for a snappy fast-food site.
Turned out, our beloved outline shader hated low-poly models. Had to tweak shadows and contours manually to avoid janky halos and weird half-tones. Later, we rethought the entire data flow. Complex conditional line calculations were offloaded to Web Workers, allowing us to parallelize processing and keep the UI responsive. Add geometry caching into the mix, and voilà: buttery-smooth load times even on reloads.
We also layered in a Toon Shader (aka Cel Shader), giving everything that rich, cartoon-like edge—flat colors, bold shadows, and just the right amount of attitude.
TL;DR: Scroll engine, rebuilt. Shader logic, reinvented. Performance, resurrected.
The UI with Extra Sauce and a Side of Stars
Once the 3D scene had a heartbeat, our Art Director, Ernest Asanov, stepped in to give it skin. At first, the renders looked… edible-adjacent. Cold tones. Washed-out highlights. They lacked the one thing fast food is supposed to have—flavor. So, Ernest cranked up the saturation dial in Figma, warmed up the palette until it hit that sweet, overcooked, street-food glow—think red and yellow neon signs in an alleyway in Tokyo at midnight. That mood became the heartbeat of the whole project.
Then came the integration dilemma: how do you blend a 3D scene into a scrollable UI without just… dropping it into a frame like a YouTube embed? The easier route would’ve been to carve out some empty space in the scene and tuck the text in. But the animation of the food trays sparked a better idea—what if there was a portal? Ernest sketched a layout in Figma, dragging boxes around like cardboard cutouts, and pitched the concept: the site wouldn’t just present the 3D, it would enter it. That meant slicing through the scene with a custom mask—visually seamless, technically painful. But worth it.
And then came the map. Now, every fast food website has a “Where to Find Us” section—it’s practically mandatory. But Planetoño isn’t real. No physical locations, no GPS pins, not a single sweaty delivery guy on a scooter.
At first, we thought: “Fine, we’ll fake some addresses.” But even that felt wrong. Too grounded. Too normal. And frankly, too boring for a project of this level of whimsy.
Then came the lazy stroke of genius: if you don’t have real addresses, why not plot fake ones on the night sky? That’s how the idea of a galactic delivery network was born. A star map, styled like a cosmic planisphere, with custom-made constellations and entirely fabricated coordinates. You know, the usual.
Of course, turning that idea into pixels meant learning how celestial coordinate systems actually work. Because if you’re going to sell burgers in space, you might as well get the RA and Dec right. The result is a glowing, double-hemisphere delivery chart with waypoints like Aether Point and faux distances measured in light-years. It’s all nonsense. But it looks official enough to make you wonder.
Because sometimes, laziness sparks the weirdest (read: best) ideas.
And every fast food joint needs a map. Ours just happens to be written in stars.
The Rive Experiment (And the Pain That Came With It)
Our Motion Designer, Ladamyra Kunytsia, used this project to test out Rive for the very first time—a tool everyone in the motion world raves about, and now we get why. Sort of.
We used it to animate bubbles, paginators, preloader states, and interactive buttons. But while Rive was lightweight and surprisingly quick for certain tasks, it also came with its own haunted-house quirks. Ladamyra had to wrestle with trigger logic, misbehaving states, and a timeline that didn’t always listen when you said “play nice.”
The bubble animation turned out to be the trickiest part. The bubbly look was made by carving smaller circles out of a larger one—visually cute, technically complicated. Rive doesn’t natively support stroke outlines on these kinds of Boolean shapes, so Ladamyra had to find a workaround that didn’t break the visual harmony.
What she did love was building the interactive stepper. The logic behind each button click—thinking through each transition, defining states, planning bounce effects—felt like solving a toy puzzle. Fast, satisfying, and just a little addicting.
Compared to After Effects, Rive offered lightning-fast setups: define state A, define state B, set the transition time, pick an easing curve—done. Especially for bounce or squash animations, it felt like magic. But the moment you wanted to hand-draw your own curves, things got trickier. Not to mention, if you forgot which mode you were in—Design or Animate—you risked laying down a graveyard of unwanted keys. We’ve all been there.
Still, she made it work. The result? A site that feels alive—even if it’s not delivering real fries.
What We Learned
Planetoño won’t launch—NASA rejected our interplanetary delivery permit (for now). But what we got instead was better: an experimental playground that stress-tested our stack. We made a new shader workflow. Built a better scroll logic from scratch. Learned how not to structure our nulls. And added Rive to our toolkit—bugs and all.
In short: we broke our own pipeline—then made it better.
Not bad for a fake burger delivery.
Recommended Reading
If you enjoyed this little creative detour, you might also like exploring our other case studies:
Fireside Case Study: Turning Sterile into Human
Case Study: Manatee Energy. Designing Warmth
EternaCloud Case Study: Calm Design for Complex Systems
SPYLT Case Study: Delicious by Design
Case Study: ABUK—Designing Ukraine’s Leading Audiobook Platform
