Case study · Interaction design · 2026
Designing a calmer moment before a purchase.
A phone app that looks at a price, your spare money and your payday, and answers before you pay: Buy, Wait for payday, or Not now. Every list in it is a stack of folders you can open, flick and pull.
Swipe to switch · tap to flip
My role. Solo product designer. I used Claude as a production and critique partner, and as a research engine: working through the research, stress tests, synthetic studies and possible usage scenarios. Every output checked by me.
01 · The idea
Many people I talk to don’t track their spending, or can’t keep it up for long. Sales, discounts and online stores make the monthly total very big, and then comes the question: where did I spend so much?
Before I buy a thing or tickets, I ask myself the same questions. How much can I afford it? How many hours of work is it? How will it hit me next month? How much further away does it push the goal I’m saving for? How often will I really use it? Few people will sit down and do that math before every purchase.
The principle
A product,and three answers.
The app doesn’t limit you, and the final call is always yours. This one line decided the visuals, the way the app talks to you, and the savings goal.
What I knew, what I only simulated, and what each one changed.
Most of my research was simulated. I used AI to explore the problem quickly and to write hypotheses. None of it counts as evidence about real people, so every decision below is a hypothesis until it’s tested.
Observation and conversations with people at work, friends and relatives. Informal, not recorded.
Desk research and a competitor scan: Skip or Buy, CartPause, price trackers, budgeting apps.
5 survey responses in Google Forms. Too few to count; I don’t show them as numbers.
15 survey responses built from buyer types known in marketing and sales, and 5 interviews (P01 to P05). The personas, empathy maps and journey maps were built from these.
A card sort with 18 synthetic participants: an exploration of navigation options, not proof.
The journey maps
Two journey maps, one per persona, both “as is”: how buying works today, without the app. They come from the simulated interviews, so they are maps of a hypothesis. What they gave me was a question to design for: what happens after the purchase? 5 is motivation, 1 is frustration, and the red point is the lowest.
5 motivation 1 frustration
The dip sits after checkout: the deal felt good, the use didn't. Last stage forks: worth it 4, overpaid 2.
5 motivation 1 frustration
Highest at the product tag, lowest when the package arrives. End of month forks: fine 3.5, broke 1.5.
Emma and Jake are composite names. Every line on the boards traces to a simulated participant, not to a real person.
The name
The old name said that purchases are only impulsive. But not all purchases, and not all people, are about impulse. Some want to weigh how much a buy is worth. So the app was named from Decision and Buy, and clearer answers came from that: buy, wait, or not now. It won’t judge you, won’t pressure you, won’t tell you you’re deciding wrong.
From rows to folders: where the idea came from, what I rejected, and why it stayed.
In my Crazy 8’s for My items, most sketches stack the items. The folder idea started here, before any screen existed.
Low-fi v1 was made with AI in Figma: lists, item rows with a square thumbnail, boxed fields. Nothing says this is one item you opened.
For v2 I redesigned onboarding and Home myself and set one graphic language for the whole app. The verdict is an open folder, and the next item waits below it.
The folder takes the color of its answer, the reason line gives a date and what you’d have left, and the facts sit below in the same order for every answer.
Why folders, not rows. An item opens like a folder and the rest slide down, so you never lose the list. The color is the verdict, so a stack reads without words. The tab shows the price, so you never guess what something costs.
Onboarding and Home in low-fi v2, the visual language, the palette and app icon, the logo.
Low-fi v1, then v2 applied to the other screens, the hi-fi screens and the design system, through the Figma connection.
Its first pass drew plain lists with thumbnails. I pointed to Recent checks on Home: every list became a folder stack, the item page an open folder. I removed the “+” on Check and the verdict word on folder tabs.
“Look at my updated design. It’s low-fi, don’t nitpick colors. Build the remaining screens according to this design.”
My prompt in Figma, 2026-10-18. Paraphrased: I dictated it by voice in Russian, and the exact wording wasn’t saved.
I asked ChatGPT for three grayscale alternatives per screen, based on my Crazy 8’s. It came back with a generic fintech look: lists, grey boxes, the verdict in a box instead of owning the screen. Its “stacked folders” version lost the folder idea. I kept a few details: the Check empty state that explains the rules, the “as of” date on saved prices, sort as a bottom sheet.
ProductA companion, not a judge. Even its red shouldn’t cause anxiety.
“Not now” doesn’t say “don’t buy”. It doesn’t forbid you. It says lightly: some day you can, keep saving, but not now. The rounded corners soften the tone, so nothing feels sharp or fixed.
Product photos. A photo pulls you to the “want”; the screen is about what this price means for you.
The verdict word on folder tabs. With several folders you saw “Buy” repeated and no price. Now every tab shows the price.
A light grey background. A contrast check showed the light verdict folders would blend into it.
The hamburger menu. It would hold only Settings, so a gear is one step shorter.
Bricolage Grotesque ExtraBold for titles and the verdict word, Manrope for everything you read. Text on verdict colors is always black: white fails on green, yellow and red (1.4 to 2.9:1), black passes (7 to 15:1).
I didn’t drop the wishlist. I moved it into Check and limited it to 5 items for 3 days.
On purpose, so it doesn’t turn into one more cart you never finish. The hamburger went too. Everything else fits in four tabs: Home, Check, My items, My money.
Evidencev03, after the Crazy 8’s: Check becomes its own tab with drafts; the four tabs that shipped.
Between v01 and v02 I ran a simulated card sort (18 synthetic participants). I read it as an exploration of options, not as proof that the structure works.
I wanted control over continuous motion, gesture speed and springs you can interrupt, so I prototyped in code instead of in Figma. I described each motion with references, and it went straight into code.
Gesture lab
On a phone this is a preview: switch screens with the buttons. Open the full prototype to try the gestures.
The real prototype on its demo data; nothing is saved. The buttons are a way in without gestures. Screen reader support for the gestures is still open.
Verdict explorer
Same layout, same facts, same rules. Only the color, the word and the reason line change. Examples from the prototype’s demo data.
A $39 sneaker cleaning kit. “Fits your month.” The first tile says how comfortable it is: 7.8% of your spare money.
A $180 lamp, or 4 × $45. “Payday is in 4 days. Buy it now and you’ll have only about $160 until then.” The app judges the full price, not the monthly payments.
A $1,240 camera. “That’s about 2½ months of your spare money.” It doesn’t forbid; it says some day you can.
What never changes: the item on top, the reason line, the fact tiles in the same order, and the same actions under the folder. Behind each tile there’s one graph and one plain sentence, one swipe away.
Every key screen
31 screens in Figma, light and dark. These six carry the system; under each one, the decision behind it.
What the code taught me: the keyboard covering a field on a small iPhone, scrolling cut short on iOS, and action links that did nothing in German were all invisible in a desktop browser.
Three kinds of checks, kept apart, because they are worth different things.
Two friends, informally. F1 tested over chat, sending screenshots and questions as she went: 11 points. F2 asked about currencies (recalled, not written down). No tasks, no recordings.
A 9-minute walk-through on my iPhone, recorded and reviewed: 9 fixes, including the biggest one below.
20 AI testers, each with a persona and a focus, drove the prototype in a browser. They found bugs, not opinions: names rendered as code, $7.99 becoming $799, double taps creating duplicates. All fixed.
F1 and F2, translated from Russian. Real people, real questions.
My iPhone walk-through
F1
F1 · F2
F1
What I learned
The designer stays the author.
This is my second project as a product designer, and I feel more confident with every decision. A designer won’t do everything by hand, but will direct the whole process: see the app as a user, a developer, a designer and a marketer, keep all of it in mind, check which decisions work, and run stress tests.
AI is becoming a key tool for the whole product, not only the design. In this project it built screens from my direction, simulated research I then had to treat as hypotheses, and ran stress tests. The design decisions, and what I rejected, were mine.
Next
DeciBuy