Fortune cookie shop with an eight-step configurator
A fortune cookie you write yourself, in eight steps.
- Role
- Design and build, solo
- Client
- Ciastko.Fun · personalised fortune cookies
- Scope
- Shopify store, Configurator, Ad creatives
Results
- 8 stepsquantity, colour, fortunes, wrapper, label, extras, delivery and the summary
- 9 colourseach shown on a baked cookie, not a colour chip
- Upload and cropyour own image inside the shape it prints in, previewed on the pack
- Design and buildthe storefront, the configurator on Shopify with custom code, and the creatives
Ciastko.Fun is a Polish shop for personalised fortune cookies. I designed it, built it on Shopify with custom code and drew its creatives, solo. The shop is live, and its heart is the Kreator: a configurator that assembles a box in eight steps, with the price moving at every one.
Introduction
Everything is optional, and that is the problem.
A personalised cookie carries a lot of decisions, from how many to the day it arrives. Put it all on one page and nobody finishes. Split it badly and people leave in the middle. The shop had to make a long configuration feel short, and never let anyone choose without knowing what the choice costs.
Constraints
- Eight groups of choices, and an order starts at ten cookies
- Customers bring their own images, in any shape and any size
- It all runs on Shopify, which was not built for a configurator like this
- Two buyers: a person after a gift, and a company ordering in bulk
Storefront
One storefront, two buyers, a door for each.
The storefront serves two people at once: someone who wants a gift right now and takes a ready set off the shelf, and someone who builds one from nothing. Both get a door on the home page.
Kreator
Eight steps, one decision per screen.
A numbered rail on the left says where you are and what is left, and the percentage at the top moves as you go.
- Minimum ten cookies, no maximum, and the more you order the cheaper each one gets
- Nine cookie colours, each one named rather than left as a swatch
Your image
Cropped in the shape it will be printed in.
The parts people care about most are the ones they bring themselves: a photo on the wrapper and a picture on the box label. Each is cropped in the shape it prints in: a circle for the sticker, a rectangle for the label.
Delivery
The last three steps are about trust.
Flavour, delivery and the summary are where an order is either confirmed or abandoned.
- Six cookie flavours and freeze dried fruit, chosen from pictures, not a dropdown
- Express, standard or economy, and every date carries its own price
Creatives
Ads made from the product, not around it.
The ads are made from the product rather than around it: the cookie itself, lit against black, with the crumbs left in. The configurator runs on a phone as well as a desktop, and the creatives show it there.
Key decisions and their cost
One question per step, the price always in sight
Each step asks one thing, and the total stays on screen with the price per cookie beside it, so no choice is made blind.
Trade-off Eight steps is a long road, and it costs an extra screen of navigation that a single long form would not need.
A ready answer next to the blank one
Every step that can be personalised also offers something prepared, in the same row as the blank field: fortunes by occasion, sticker sets, a wrapper that is simply none.
Trade-off Prepared sets can become the only thing anyone uses, so they are placed as a starting point, not as the default.
The customer crops before paying, not the shop after
An upload is dragged, zoomed and corrected for brightness and contrast inside the shape it will print in, previewed on the pack. Nothing is cropped after checkout, which is where personalised print usually goes wrong.
Trade-off Cropping in the browser is real code on a platform that does not come with it, and it has to survive any image a person uploads.
Keep the unfinished box, and ask before restoring
A configuration this long will be interrupted. The work is saved, and the next visit asks one question: continue, or start again. Nothing is silently restored or thrown away.
Trade-off A saved box has to be checked against prices and options that changed since: a rule to maintain, not to write once.
Outcome
Outcome
The shop is live, and the configurator carries the whole order, from ten cookies to the day they arrive.
What I learned
- A long configuration is a problem of certainty, not length: people answer eight questions in a row if each one shows what it changed.
- Personalised print fails at the crop: placing the image inside the real printed shape removed the one thing that would arrive wrong.
- A prepared set next to a blank field is permission, not a shortcut: it shows what good looks like before anyone invents it.
