AboutWorks

Mirko Zeppieri

Available for hire

Email copied
The Woof Dog Academy — the lavender wordmark floating over a low-poly tiny planet of autumn trees and crossing stone roads, on a purple night sky

Industry
Dog Training, 3D Web
Role
Designer & Developer
Year
2026

The Woof Dog Academy is a client project that turns a whole website into a game: a dog training academy in Amsterdam whose site is an explorable 3D planet. You visit it as a dog. The menu is a signpost, every page is a character you walk up to, and the first lesson of real training became a playable leash trial. I designed it in Figma and directed the AI across thirty-three sessions: code with Claude, artwork with Gemini, soundtrack with Suno. Shipped in Italian for its audience, live at thewoofdog.com.

  1. A dog training academy in Amsterdam, and a brief that asked for different. My bet: build the whole site on the client's own method.

    The brief

    A dog training academy serving Amsterdam's Italian expat community, with basic and advanced programs. Every competitor had the same brochure site, and the client wanted something dynamic, unlike any of them. My call: don't describe the method. Let visitors live the dog-and-owner experience.

    The bet, with guardrails

    So the whole site became a game, built on familiar UX bones so nobody gets lost: the dog's walk replaces the scroll, and every interaction stays a classic card. Behind the fun sat hard acceptance criteria. Paint fast, run on phones, work as a real business front door.

  2. Information architecture became level design: the visitor plays a dog on a tiny planet, and the four sections are places along its roads.

    The world is the sitemap

    The menu is a signpost at the crossroads, and every sign is an anchor link that auto-walks the dog to its destination. Every page is a character: walk up, press E, and a card opens with everything a page would carry. Text, details, a call to action, without ever leaving the walk.

    The method as mechanics

    Loose-leash walking is lesson one in real dog training, so it became the mini-game: walk beside the trainer, stay close, finish the lap. The leash snaps gently when you stray, nothing scolds you, you retry. Win, and the certificate walks you straight to the services: the game's climax doubles as the funnel.

  3. Thirty-three working sessions run like a product: I framed each feature, briefed the AI, reviewed every change on screen, and kept every decision mine.

    The discipline

    A living handover carried architecture, gotchas and tuning knobs between sessions, so nothing had to be argued twice. I tracked the game script's size in bytes after every session and made each asset earn its place: a 31MB scenery model shipped at 0.63MB with its UVs intact.

    The honest split

    Claude wrote the code, Gemini the artwork, Suno the soundtrack. I designed every card and flow in Figma, judged each change the only way that counts, on screen, and owned the product calls. Direction and taste were never delegated.

  4. From a 12.5MB single file to a 1.2MB first paint. Then hardened on real phones and shipped on the client's own domain.

    Performance as design

    Inlining every asset made development simple, and the page 12.5MB. Right for building, wrong for shipping: the assets moved to 22 cached files behind a small hydration loader with graceful fallbacks, and the music loads lazily, at the dog's first step.

    Live, in the wild

    On phones the site grew a joystick with hand-tuned analog steering, and one stubborn iOS double-tap zoom was hunted down and fixed. Deployed from GitHub to Vercel on a custom domain, in Italian for its audience: a working front door for a real business.

Case study cover — a website you don't visit, you play it: the tiny planet with its crossing stone roads beside the title, live at thewoofdog.comThe brief: be unlike every competitor — the trainer character hugging an Australian Shepherd, and the ask of a dog academy for Amsterdam's Italian expatsThrough the dog's eyes — the method teaches owners to read dogs, so the site flips the point of view: you explore it embodying a dog on a tiny planetA cinematic landing — the wordmark and ENTER button over the planet: an opening keyframe composed in a custom photo mode, with the camera flying you inThe sitemap is a signpost — the in-world signpost with Training, About, Services and Contacts signs working as anchor links that auto-walk the dogGame UI, product discipline — the trainer's dialog card from the Figma-designed system: one background SVG, one button shape, tokens for color and typeLesson one: the leash — two gameplay shots of the leash trial: walking beside the trainer, and the gentle leash-snapped retry statePages become people — the About card opened in the world: a character popup carrying text to scroll, details and a call to action like a classic pageA toy with real plumbing — the four service cards and the contacts popup wired to the channels the client answers: email, WhatsApp, InstagramChoose your coat — the breed picker easter egg: Australian Shepherd or Border Collie, the same model with a repainted textureDirecting the AI, not following it — thirty-three sessions run like a product with a byte budget per session; Claude, Gemini and Suno under my directionA 3D world in one HTML file — the asset pipeline: a 31MB scenery model shipped at 0.63MB, 50k to 12k triangles with UVs preserved12.5MB to 1.2MB first paint — from a single inlined file to 22 cached assets behind a hydration loader with graceful fallbacksA soundtrack that walks with you — the Suno loop, external and lazy-loaded, fading in at the dog's first stepLive at thewoofdog.com — GitHub to Vercel on a custom domain, hardened on real phonesClosing — the Woof Dog Academy badge over the planet: live now at thewoofdog.com, an explorable 3D world, product thinking, design to code

Other projects

All projects
RetroPocketStyleBarsNezuraVersaGamesSeedify