Playground · AI-Assisted Build

Secret Santa for Pets: From Idea to Production in 5 Minutes

How AI tools enable designers to ship functional products — without a single developer in the room.

5 min build time
0 lines of code written
Fully deployed on Vercel
5 people used it successfully
View Live App
AI-Assisted DesignRapid PrototypingV0ClaudeNext.jsVercel

Quick note: This is a speed experiment, not a polished case study. The point isn't the app itself — it's what the process reveals about the future of designer autonomy. For deeper work, see the Candidly case study →

01

The Challenge

Every Christmas, my family runs a Secret Santa — split between Portugal and Brazil. We used to draw names from a hat, which meant someone had to physically coordinate it. With family on two continents, that stopped working.

The obvious solution is one of the dozen Secret Santa apps out there. Except: they all require account creation, collect more data than necessary, and none of them support our actual tradition — which includes our dogs, Canela and Baunilha, as participants. (Yes, the dogs do Secret Santa. Don't judge us.)

Paper method

Can't share remotely without spoiling the draw

Existing apps

Require accounts, collect data, no pet support

Manual coordination

Someone always accidentally sees who got who

The real challenge underneath all of this: could I — a designer with no coding background — actually ship a working product solo? Not a prototype. A deployed app with a real URL.

02

Competitive Landscape

Before building, I mapped what already existed. Claude helped me structure this analysis quickly.

AppAccount RequiredPet SupportShareable LinkWishlistFree
ElfsterYesNoYesYesFreemium
DrawNamesYesNoYesYesFreemium
Secret Santa OrganizerNoNoNoNoYes
GiftsterYesNoYesYesFreemium
My Secret Santa App ✦NoYesYesNoYes

The gap was clear: zero-friction, no-account, pet-friendly, shareable links. Simple scope that any competent tool could solve — which was exactly the point.

03

Process & Tools

The actual sprint happened while my wife was in the room — she doesn't know how to do this, and I wanted to see if I could ship something real before she noticed I was building instead of watching TV.

01

Claude

Ideation & Planning

Scoped the problem, mapped competitive landscape, defined constraints, audited my own thinking

02

Claude

Product Audit

Stress-tested decisions: minimum participants, grouped pets logic, edge cases

03

V0

Build

Described the app in plain language. V0 generated Next.js + shadcn/ui. Iterated 2-3 times.

04

Vercel

Deploy

Connected GitHub repo, one-click deploy. Got a real URL. Done.

Why These Tools

Claude

Best for structured thinking. I used it like a product manager — it pushed back on assumptions, helped me think through edge cases, and surfaced decisions I hadn't considered. The dialogue format maps well to how designers think through problems.

V0

Best for UI generation. Vercel's tool speaks designer — you can describe layout, component style, and interaction in natural language and get production-quality React code. It uses shadcn/ui which has solid defaults.

Vercel

Lowest friction deployment I've seen. Connect a GitHub repo, it builds and deploys automatically. For someone who's never deployed anything before, this was genuinely magical.

04

Key Decisions & Learnings

This wasn't just "describe app, get app." There were real product decisions to navigate — and Claude became a thinking partner, not just a code generator.

Product Decisions I Navigated

Grouping pets with owners

The question: If Canela and Baunilha are participants, they need a human to receive on their behalf. How do you model that without making the UX confusing?

Resolution: Owner-pet groups: pets are linked to an owner and excluded from drawing with their owner's group. Simple rule, clear UX.

Minimum participants

The question: What's the minimum viable draw? 2 people? 3? If 2 people draw names, it's deterministic and pointless.

Resolution: Minimum of 3 participants required before the draw can happen. Claude helped me think through the math.

No wishlist feature

The question: Every competitor has wishlists. Should we?

Resolution: No — scope discipline. A wishlist would double the UX surface area for a v1 speed experiment. Cut it without guilt.

Shareable draw results

The question: After drawing, how does each person see who they got without everyone seeing everyone else's result?

Resolution: Unique URLs per participant. Each person gets a private link that reveals only their assignment.

Using Claude to Audit My Own Thinking

The most useful part wasn't asking Claude to generate — it was asking Claude to challenge. I'd describe a decision and then ask: "What am I missing? What edge cases break this?"

This is actually closer to how designers should work: define the problem, propose a solution, stress-test it. AI accelerates the loop, but the judgment calls are still yours.

What Worked, What Didn't

What worked well

+Natural language → working UI in seconds
+Iteration speed: fix one thing without breaking others
+V0 understanding design intent, not just spec
+Claude as a structured thinking tool
+Vercel deploy being genuinely zero-friction

What didn't

First V0 output had state management issues
Complex constraint logic needed multiple iterations
No control over the underlying code quality
Hard to debug when something subtle breaks
WhatsApp share links required specific formatting

05

The Result

App screenshot

Add your screenshot to /public/images/ and update this section

Secret Santa for Pets — live at secret-santa-psi-five.vercel.app

What Shipped

Participant management

Add humans and pets, group pets with their owners

Constraint rules

Owners never draw their own pets; configurable exclusions

Randomized draw

Algorithm handles constraints automatically

Shareable URLs

Each participant gets a unique private link to their result

WhatsApp integration

One-tap share to send results directly in chat

No accounts required

Zero friction — open the link, do the draw, done

Tech Stack (That I Didn't Know Before This)

FrameworkNext.js (App Router)
UIshadcn/ui + Tailwind CSS
BuildV0 by Vercel
DeployVercel (auto from GitHub)
Code written0 lines. Not a typo.

06

Reflection

Before AI tools, a designer with an idea had a clear ceiling: Figma. You could design the solution, document it, hand it off, and then wait. Weeks, sometimes months. The gap between idea and shipped product required a developer to cross.

That gap is collapsing. Not for everything — complex systems, performance-critical code, serious production applications still need expert engineers. But for MVPs, prototypes, internal tools, proof-of-concepts? Designers can now ship.

This isn't about replacing developers. It's about what happens at the boundary — when a designer has a validated idea and needs to test it in the real world, not just in Figma.

What This Changes for Designers

Before

Had an idea → designed in Figma → handed off → waited → hoped

Now

Had an idea → validated with AI → built with V0 → deployed → learned

Before

Dependent on developers for any real-world validation

Now

Can validate independently, then bring developers in for scale

Before

Advocate for the user in meetings

Now

Advocate with evidence — because you shipped something real

What I'd Do Differently

The app works. It was used. But if I spent another hour on it: I'd add a constraint UI so organizers can set exclusions without thinking about the underlying logic, and I'd add a simple history view so you can reference last year's draw.

But that's the point — you learn what to improve by shipping, not by planning. This experiment was worth the 5 minutes.