Farm Friends Climb

1. Prints

   Type

   Aa Climb

   Buttons

   Play NowCharacters

   Cloud platforms

   StaticMovingSpringBreaksGust
   01

   Figma design system

   The foundation every screen and character is built on.

2. 

   Climb

   Play Now
   02

   Working prototype

   The proof of concept: a tap-to-play build.

3. 
   03

   Collector's token

   The tangible extension that makes the idea feel real.

Process & Tools

I built the game using Claude Code connected to Figma through its Dev Mode MCP server, pulling real screen designs straight into the codebase instead of rebuilding them from static references. I worked in small, single-purpose prompts, one feature or fix at a time, so every change was easy to check:

1. 01FigmaReal screen designs, read through the Dev Mode MCP server
2. 02Claude CodeSmall, single-purpose prompts: one feature or fix at a time
3. 03PreviewVisual changes checked before going live
4. 04iPhone 16 ProReal-device testing for what a desktop preview misses

The Collection

Dairy Boy’s Farm Friends collection is six pajama sets. Each one has a farm animal embroidered on the chest and its own print, from the Rooster in Pink Gingham to the Mallard in Merlot.

Every set is $128 in sizes XXS–XXL, and the Rooster is exclusive to the Dairy Boy app.

Drop

May 7, 2026

Time

11 AM EST

Where

dairyboy.com & the DB app

• 

  Rooster

  in Pink Gingham

  $128 · XXS–XXL

  In-app exclusive

• 

  Barn Mouse

  in Green Pinstripe

  $128 · XXS–XXL

• 

  Sheep

  in Scottish Plaid

  $128 · XXS–XXL

• 

  Cow

  in Ribbon Stripe

  $128 · XXS–XXL

• 

  Piglet

  in Blueberry Lane

  $128 · XXS–XXL

• 

  Mallard

  in Merlot

  $128 · XXS–XXL

From Pajamas to Pixels

The Farm Friends pajamas already had what a game needs: a cast, a look and a palette. I wanted the game to feel like the pajamas come to life, so every design choice started from the fabric.

Game design

Built into the Dairy Boy App

Farm Friends Climb isn’t a separate download. It lives inside the Dairy Boy app, where the people most likely to buy the collection already shop. A banner on the app’s home screen opens the game, and a DB App button takes players straight back to the shop.

1. Opens the app before the drop

   Playing means downloading and opening the app, so players are already there, signed in, when the collection goes live.

2. Keeps the exclusive one tap away

   The Rooster set is only sold in the app, and the game puts players right where it is.

3. Real shoppers on the leaderboard

   Every score belongs to a signed-in account, so winners are easy to verify and prizes ship to the address on file.

Play Now

The timing

Launches a week before the clothing drop

The Leaderboard Strategy

In the week before the drop, players compete for the highest score. Only the top ten win a prize, and the best prize goes to just one player.

Urgency for the top spot = reason to keep playing

1. First place

   • Needlepoint token
   • PR box
   1st

2. 2nd & 3rd place

   • PR box
   2–3

3. 4th–10th place

   • An item from the collection
   4–10

The Collector’s Token

First place wins a one-of-one needlepoint token: their Farm Friend on its print, ready to stitch, with a Dairy Boy kit of threads and tools.

Each character has its own canvas, so the prize matches the animal the winner played.

The six canvases

• 

  Cow

• 

  Piglet

• 

  Rooster

• 

  Sheep

• 

  Mallard

• 

  Barn Mouse

UX research

System Map

Before designing screens, I mapped how the game moves between them: every screen and run state, and what sends the player from one to the next. Then I zoomed into the climb itself and listed the checks the game runs on every frame. The map became the plan for the build, so each state on it is a screen or a run state in the code.

• Leaderboard · My Stats · How to Play

  Side screens

  • Back → Home
• Start

  Home

  Pick a character

  • Tap to Play → Countdown
  • Side screens ↔ Home

• Countdown

  3 · 2 · 1 · Go!

  • “Go!” → Climbing

• Climbing

  Steering + scoring

  • Fell past every cloud → Game Over
  • Hit a crow, bee, owl or gust → Knocked off
  • Pause button, P / Esc, or app hidden → Paused

• Paused

  Menu + How to Play

  • Resume → Climbing
  • Quit → Home

• Knocked off

  No steering, falling

  • Falls off screen → Game Over
• End of run

  Game Over

  Run saved · best updated

  • Play again → Countdown
  • Home → Home

Inside “Climbing”: every frame, 120 times a second

1. New frame (1/120 s)

2. Read taps and holds

   Left or right half of the screen steers; edges wrap

3. Apply gravity × tempo²

   Tempo ramps from 0.75 to 1 as the sky turns to night

4. Falling onto a cloud?

5. Yes

   If yes: Bounce up

   Spring cloud: big launch · Wispy: breaks · Moving: keeps sliding

6. Move obstacles

   Crows glide · bees flutter · owls glide · gusts curl

7. Touching an obstacle?

8. Yes

   If yes: Knocked off

   Cause recorded; steering stops and the friend falls

9. Camera follows upward

   Score = highest point reached (10 px = 1 ft)

10. Below the bottom of the screen?

11. Yes

    If yes: Game Over

    Run, cause and character saved; new best saved if beaten

12. No: next frame

From orange box to pixel art

1. 

   01

   Orange box

   A square and flat platforms, just enough to prove the bounce, steering and score felt right.

2. 

   02

   First art pass

   A sunset sky, clouds and a farm, with the placeholder square still standing in for the player.

3. 

   03

   Final

   Pixel-art Farm Friends, cloud variants and obstacles, and a score card in feet with a pause button.

Visual & Brand Design

The game uses detailed, soft-shaded pixel art rather than blocky 8-bit: 64×64px character sprites set against a sky that shifts through eight color stops, from a warm sunset gold to a deep night navy, as the player climbs higher. Bounce speed ramps up along the same arc, tying pacing directly to the visual progression.

SunsetNight

1. #FDE9AA0 ft
2. #FFC98A80 ft
3. #F3AFA0160 ft
4. #CAA6B7240 ft
5. #7683DC320 ft
6. #3D4787400 ft
7. #1D2559480 ft
8. #091040560 ft

Bounce tempo0.75× at the start → 1× at full night (560 ft)

Each run starts on a static barn-and-grass scene before the climb begins. Cloud platforms come in four variants, and obstacles shift with the sky: a bee and a curling wind gust by day, birds as the sun sets, and an owl as night falls.

• 

  Static

  Holds still: the steady footing every climb starts on.

• 

  Moving

  Drifts sideways, so the landing has to be timed.

• 

  Breakable

  Takes one bounce, then fades away.

• 

  Spring

  Launches about three times higher, with a particle burst.

User Testing

I had people play the prototype to check that the game read the way I designed it to: what to touch, what to avoid, and whether every screen felt like part of the same game.

Finding 01

Players read the butterfly as friendly, but it’s an obstacle: touching it knocks your Farm Friend off and ends the run.

The change

I replaced it with a bee. Its stinger and warning stripes say “avoid me” at a glance, so players don’t have to learn it the hard way.

Finding 02

The home screen felt separate from the game: a plain grey page with buttons, nothing like the sunset climb that came after it.

The change

I brought the game into the home screen: the sunset sky, pixel clouds, the barn and farm, and a crow and bee flying past, plus a DB App button back to the shop.

What I Learned

Does this get someone to play again, share their score, or want the product?

1. 01

   Game design is marketing design

   This project pushed me to think about game design as marketing design: every mechanic, character trait and prize tier had to answer that question, rather than just "is this fun."

2. 02

   Scoping tightly mattered as much as designing well

   Choosing a simple, provably reliable mechanic over a more ambitious one, and building iteratively with real-device testing, is what got this from an idea to a working prototype in four weeks.