The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Back to feedPost
I built a ghost-hunting game. Then I used MCP to design everything that comes after it.
PHI HUNTER: FIRST NIGHT is finished and playable. You use light to reveal what's
hiding, mark it with three Sigils, survive what it does next, bind it, and archive it.
One person, one encounter, one night.
A first encounter isn't a product. A product needs an archive, a map, equipment, a
reason to come back tomorrow night. That's where a solo creator normally stops —
not because the ideas run out, but because designing a connected system by hand is
where the time goes.
So I designed it through Flowstep over MCP, from my editor. I never opened the design
tool by hand.
WHAT I LEARNED ABOUT SPEED
Speed wasn't the hard part. Precision was.
My first plan was wrong. Sixteen screens with a shop, a wallet and a payment flow —
things this game had never been about — plus a colour palette I wrote from memory
that existed nowhere in the product. A tool this fast builds the wrong thing just as
quickly as the right one.
So I went to the source. The game has a frozen design-token file: fourteen colours,
eight geometry values, motion timings. I moved it into Flowstep value for value.
Nothing was redrawn to match — it was transferred. The same design system running
against two different rendering targets.
Then one request. Seven connected screens. One message.
WHAT MCP COULDN'T DO
It wasn't all clean. Wrong images, clipped text. And the toolset has no way to link
screens, so I'm not going to pretend this is a clickable prototype.
For that I used a browser agent — also over MCP — to open the real canvas, compare
versions, throw away the weaker set and fix what was actually broken. Two agents,
one job: one designing, one inspecting.
AND IT ENDED BACK IN MCP
The last fix I didn't expect. One screen wouldn't respond to any prompt. So I pulled
that screen out as code, corrected it in my editor, and sent it back in.
It accepted it. No regeneration. No credits spent.
The design tool returns real code and takes real code back. That's not a black box.
That's a workflow.
The first night is finished. Everything after it is labelled a concept on every
screen, because the point was never to look further along than I am.
MCP didn't design this for me. It removed the reason a solo creator stops after the
first night.
Play the first night — it runs in your browser, no install:
The seven connected screens, designed through MCP:
@flowstep #flowstepchallenge
The network for creativity
Join 1.25M professional creatives like you
Connect with clients, get discovered, and run your business 100% commission-free
Creatives on Contra have earned over $150M and we are just getting started
Trending
Claude
Claude has entered the design space. How are you using it?
Contra University
Learn from expert creatives how to earn more using next-gen AI tools.
Brand Design
The best brand designers are on Contra. Scroll to see what's trending in brand design. What are you building?
creativeaiflow
Creative AI workflows are evolving. What tools do you use, and what are their strengths and weaknesses?
freelancerlife
Freelancer life is wins, pivots, and everything in between. What’s yours right now?
Related posts
For years I've done the same pointless thing: I pause a film because someone's wearing the exact coat I've been looking for, then I screenshot it, reverse-search it, scroll past forty results that aren't it, and give up.
The thing I wanted was right there in the frame. It just wasn't connected to anything.
So I built it.
Vantara is a streaming service where you pause any moment and it tells you what's in the shot and where to buy it: the exact piece, or its closest match. Because you're never going to find the real 1912 opera coat from the costume department, and you don't want to pay for it either. You want the look, at a price that makes sense.
It's 11 screens across desktop and mobile, including the player, the pause-to-shop panel, item pages with real prices and delivery, a Vault that watches prices and tells you when something drops, and a search that runs backwards. Describe a look, and it finds you the scene it lives in.
I built every screen in Flowstep, driven through the Flowstep MCP server with Claude, on one design system applied across the whole thing.
This is the idea I keep coming back to. Full walkthrough video + case study here: Full Walkthrough
Built with @flowstep_ai #FlowstepChallenge
Wow ! Just Read your case study as well & TBH this is some submission you deserve to win this. 👍
Pause is a mindfulness app that interrupts impulse purchases before checkout.
Instead of a shopping flow, it's a pause ritual: catch the desire, get honest about why you want it (FOMO, boredom, a real need), then lock the item away for a 14-day cool-off. while a patience-plant companion grows the longer you resist. I wanted this to exist because most apps are built to speed you toward buying; I wanted one built to slow that moment down.
Built as a 6-screen clickable prototype in Flowstep, one consistent design system across every screen.
Project link here
@flowstep_ai
wow this is much needed
Here's my Flowstep Challenge build. It started from a simple question: what would an art app look like if it wasn't trying to keep you?"
Ephemera airs one piece of art a day. Writing, music, visual, moving image, past and present. You keep it, or you let it pass, and what you keep becomes a catalog. No feed, no timer, no metrics.
One rule shapes it: it only airs work that is given by a living artist, or genuinely open, like public domain and open archives. Nothing scraped. That constraint becomes the design. Every piece carries a provenance line, and because every piece is given or open, you get the actual work, played in full, for its one day. There is even a screen for artists: give one piece, it airs for a single day, then it returns to you.
Why it should exist: everything that shows me art now is built to hold my attention as long as possible. Ephemera does the opposite. One thing a day, treated seriously, honest about where it came from, then out of the way.
Built entirely in Flowstep, driven from Claude Code through its MCP server, with no Figma. Thirteen screens, generated on the canvas and refined in code.
@Flowstep #FlowstepChallenge
