E-Commerce Re-Design
Overview
When I first designed the Little Cupcake Bakeshop e-commerce site, I was a newer designer. Hungry, curious, and excited to apply everything I was learning. The work I presented then was exactly what I needed to show at that stage. And I’m proud of it.
But with more experience under my belt, I can now look back with clearer eyes and a more refined design perspective. This case study isn’t a teardown, it’s a reflection. I’ll walk through what I created, what worked, and what I’d approach differently today now that I know more about color theory, Figma tools like Auto Layout, and UI design best practices. Because growth is part of the job and I’m here for it.
Research Recap: Still Sweet
I still don’t know if I loved or hated researching bakeries around NYC, but I definitely know my dentist’s and my blood sugar’s opinions.
What I do know is that most other NYC bakeries I looked into had a much cleaner UX than Little Cupcake. Visiting their sites felt like walking into the actual bakery. Bright, beautiful, and packed with their signature sweets front and center. During usability testing, I watched users scroll, repeat the names of treats out loud, and literally salivate as they chose what to buy. That stuck with me: I wanted this site to give users something to crave.
But when I interviewed users, something deeper came up. People weren’t just craving sugar, they were craving comfort. A lot of them didn’t go to bakeries just because they had a sweet tooth. They talked about “little treats” to unwind after a long day. One user said that since they stopped drinking, they go on “pie dates” with a friend, grabbing a slice instead of a cocktail. (Did I steal that idea? You bet. I’ve also stopped drinking, and now I’m team pie.)
These conversations reminded me: this wasn’t just about dessert. It was about joy.
And with that, it was time to create a persona.
The Sweet Tooth with a Stressful Job
I expected cravings. What I heard was coping. People weren’t just buying sweets, they were treating themselves after long days, replacing drinks with “pie dates,” and seeking comfort in carbs.
I had dozens of “I” statements like “I just need a little treat after work” and “I never know what I want, but I want something.”
But I needed a clearer picture of who I was designing for. Someone driven by emotion, not just appetite. So I mapped behavior across a Cartesian plot: indulgent vs. occasion-based, decisive vs. unsure.
And so, Dave was born.
Dave lives in the “spontaneous indulgence + decision paralysis” quadrant. He’s a high-stress New Yorker with a boss who calls on weekends. He recently stopped drinking, and now a cupcake is his post-subway ritual. He’s tired, overwhelmed, and just wants something that’ll make his day a little better.
The site needed to help people like Dave feel seen, guided, and satisfied.
Let’s get Dave a cupcake.
Make It Feel Like a Bakery
I started with a few sketches of the homepage, aiming to recreate that moment you step into a bakery. When your senses light up and everything looks like a treat. Once I had a layout that felt like it hit the right notes, I brought it into low fidelity, then gradually built it into a hi-fi mockup.
But once I took a step back, and got some early feedback, I realized I may have gone too heavy on the visuals. The oversized banner image, while mouthwatering, pushed key content out of the initial frame. And that pink text box? It felt more like frosting on frosting than helpful context.
So now, if I were revisiting this design today, I’d scale the hero image down and ditch the text box entirely. The goal is still to make Dave’s mouth water, but I’d do it with smarter use of space and a tighter visual hierarchy. Let the sweets speak for themselves, right away.
Don't Cover The Joy
At the time, I was really into this layout. It reminded me of those little pink bakery boxes laid out on a communal table like a cozy church bake sale. There was something sweet and familiar about it.
Although looking back now, I’m realizing that the pink overlay is doing more harm than good. It clashes with the product images and covers the very thing that’s supposed to entice the user. The baked goods feel hidden, which is the opposite of what I want.
Because of that, if I were designing this today, I’d let the treats take center stage. I’d use horizontal scrolling to showcase the full menu within each category, with a “View All” button for folks who want to dive deeper. No overlays. No distractions. Just a flood of joyful, crave-worthy images. Dave’s had a long day. Let’s give him some visual serotonin.
Minimalism, Missteps, and Missed Cupcakes
When I first designed the product detail and checkout flow, I thought I was being sleek and minimalist. Clean lines, light text, just enough to get Dave from craving to cupcake.
But in hindsight, I think I oversimplified. I stuck the “Add to Cart” button right inside the product image, which clutters the visuals more than it helps. The product descriptions weren’t laid out in a way that felt easy to skim. And if Dave just finished another twelve-hour day getting pinged by his boss at 10pm, the last thing he needs is more effort just to pick a cupcake.
On top of that, I fell into a classic beginner trap: I got fixated on a single color. I was so excited to use the bakery’s signature pink, just like their adorable takeout boxes, that I built the whole interface around it.
And so, while the pink wasn’t a bad instinct (it’s part of their brand, after all), I would approach it way differently now. I’d use it more sparingly, maybe as a drop shadow or an accent, just like it’s used in the logo, to create depth without overwhelming the interface. I’d also reevaluate my color contrast choices to meet accessibility standards from the jump, rather than retrofitting them after the fact. A cleaner UI with better hierarchy, visual contrast, and less guesswork would go a long way toward making Dave’s checkout feel less like work and more like a well-earned reward.
