CASE STUDY · PRODUCT + MOTION DESIGN
CASE STUDY · PRODUCT + MOTION DESIGN
TURNING RUNNING
INTO A REAL-WORLD
STORY GAME.
TURNING RUNNING
INTO A REAL-WORLD
STORY GAME.
TURNING RUNNING
INTO A REAL-WORLD
STORY GAME.
Choose your path. Change the story. Keep running.
Choose your path. Change the story. Keep running.
Choose your path. Change the story. Keep running.
RUN → CHOOSE → DISCOVER → REPEAT
RUN → CHOOSE → DISCOVER → REPEAT
RUN → CHOOSE → DISCOVER → REPEAT
★
1ST PRIZE · HACKATHON ORIGIN
1ST PRIZE · HACKATHON ORIGIN
BUILT WITH CLAUDE CODE × FIGMA MOTION
BUILT WITH CLAUDE CODE × FIGMA MOTION


01 — WATCH · 30 SECONDS
02 — THE BRIEF
Legs run the miles.
The mind runs the mystery.
Legs run the miles.
The mind runs the mystery.
Legs run the miles.
The mind runs the mystery.
PROBLEM
Runs feel like a chore.
Runs feel like a chore.
60% of new runners quit within weeks. Music loops, apps only count numbers — nothing makes you want to go out again tomorrow.
60% of new runners quit within weeks. Music loops, apps only count numbers — nothing makes you want to go out again tomorrow.
60% of new runners quit within weeks. Music loops, apps only count numbers — nothing makes you want to go out again tomorrow.
SOLUTION
Every run is an episode.
Every run is an episode.
VEER plays an audio mystery in your ears. At real road forks you pick a path with an earbud tap — or raise your phone and see it in AR. Longer routes hide rarer clues. Each episode ends on a cliffhanger that unlocks tomorrow, 6 AM.
VEER plays an audio mystery in your ears. At real road forks you pick a path with an earbud tap — or raise your phone and see it in AR. Longer routes hide rarer clues. Each episode ends on a cliffhanger that unlocks tomorrow, 6 AM.
VEER plays an audio mystery in your ears. At real road forks you pick a path with an earbud tap — or raise your phone and see it in AR. Longer routes hide rarer clues. Each episode ends on a cliffhanger that unlocks tomorrow, 6 AM.
03 — FLOW 01 · ONBOARDING
A call, not a carousel.
A call, not a carousel.
A call, not a carousel.
01
The Operator calls you on first open
The Operator calls you on first open
The Operator calls you on first open
02
Pick a mystery from an auto-playing story deck
Pick a mystery from an auto-playing story deck
Pick a mystery from an auto-playing story deck
03
Set your ears — tap left, tap right
Set your ears — tap left, tap right
Set your ears — tap left, tap right
04
A practice fork before your first run
A practice fork before your first run
A practice fork before your first run
04 — FLOW 02 · THE RUN
Eyes up. Phone in pocket.
Eyes up. Phone in pocket.
Eyes up. Phone in pocket.
01
Story in your ears, stats glanceable on screen
Story in your ears, stats glanceable on screen
Story in your ears, stats glanceable on screen
02
Live Activity keeps the episode on your Lock Screen
Live Activity keeps the episode on your Lock Screen
Live Activity keeps the episode on your Lock Screen
03
At a fork: tap an earbud — or raise your phone, AR pins lock onto the real street
At a fork: tap an earbud — or raise your phone, AR pins lock onto the real street
At a fork: tap an earbud — or raise your phone, AR pins lock onto the real street
04
Longer path, more points, rarer clues
Longer path, more points, rarer clues
Longer path, more points, rarer clues
05 — FLOW 03 · FINISH & SHARE
The cliffhanger is the reward.
The cliffhanger is the reward.
The cliffhanger is the reward.
01
“To be continued” — Episode 02 drops tomorrow
“To be continued” — Episode 02 drops tomorrow
“To be continued” — Episode 02 drops tomorrow
02
See the path you took vs. every other runner
See the path you took vs. every other runner
See the path you took vs. every other runner
03
Live-stat selfie + hazard stickers → straight to Stories
Live-stat selfie + hazard stickers → straight to Stories
Live-stat selfie + hazard stickers → straight to Stories
06 — FLOW 04 · THE WAIT
Tomorrow, 6 AM.
Tomorrow, 6 AM.
Tomorrow, 6 AM.
01
A locked episode with a live countdown
A locked episode with a live countdown
A locked episode with a live countdown
02
A case file to piece the clues together
A case file to piece the clues together
A case file to piece the clues together
03
Notification drops → Episode 02 → back on the road
Notification drops → Episode 02 → back on the road
Notification drops → Episode 02 → back on the road
07 — HOW IT WAS MADE
Directed by design.
Built at studio speed.
Directed by design.
Built at studio speed.
Directed by design.
Built at studio speed.
I run Claude Code like a production team — research, flows, Figma builds and motion choreography in hours, not weeks — while every direction, cut and detail stays my call.
I run Claude Code like a production team — research, flows, Figma builds and motion choreography in hours, not weeks — while every direction, cut and detail stays my call.
I run Claude Code like a production team — research, flows, Figma builds and motion choreography in hours, not weeks — while every direction, cut and detail stays my call.
CLAUDE CODE
Plans, scripts & builds screens straight into Figma via MCP
Plans, scripts & builds screens straight into Figma via MCP
FIGMA MOTION
400+ keyframe tracks · AR camera · launch film
400+ keyframe tracks · AR camera · launch film
PROTOTYPE
33 screens wired into 4 flows, auto-advancing
33 screens wired into 4 flows, auto-advancing
VOICE
The Operator, cast & directed in ElevenLabs
The Operator, cast & directed in ElevenLabs
★ ORIGIN · 1ST PRIZE, HACK MIT-WPU 2025
★ ORIGIN · 1ST PRIZE, HACK MIT-WPU 2025
Born as RunTales — a team hackathon win. VEER is my solo rebuild: new concept, brand, UI and motion.
Born as RunTales — a team hackathon win. VEER is my solo rebuild: new concept, brand, UI and motion.
Born as RunTales — a team hackathon win. VEER is my solo rebuild: new concept, brand, UI and motion.
VIEW RUNTALES ON BEHANCE ↗
VIEW RUNTALES ON BEHANCE ↗
FULL CASE STUDY — COMING SOON
FULL CASE STUDY — COMING SOON
Let’s build something people want to run back to.
Let’s build something people want to run back to.
mestryshubham8@gmail.com
mestryshubham8@gmail.com