Designing A New Brand
QuickFresh is a meal delivery service that began with only a logo and two colors. My role was to build a complete brand identity and design a user experience that not only felt polished and intuitive but also drove measurable results. Using customer feedback and Hotjar heatmaps, I uncovered key friction points in navigation and checkout, then translated those insights into design changes that improved the brand experience and delivered clear conversion gains.
Key results
Built a cohesive brand identity
Increased conversions by 2–3%
Improved checkout completion
Role & Timeline
Lead Designer
May 2021 - Feb 2022
Methods
User Research
Qualitative and Quantitive tests
High Fidelity Prototyping
TL:DR
Starting with only a logo and two colors, I built out the QuickFresh brand identity and digital experience from the ground up. Through customer feedback, Hotjar heatmaps, and user behavior analysis, I uncovered key opportunities to refine the site. These design and UX changes led directly to conversion rate increases of 2–3% on navigation actions and a 2% lift in completed checkouts by redesigning the upsell flow.
Final Design
The Challenge
When I joined QuickFresh, there was no established brand system—just a logo and two colors. My task was to create a distinct, ownable identity that resonated with customers while also optimizing the digital experience to drive sign-ups and conversions.
The Problem
Starting From Scratch
When I joined QuickFresh, there was no digital presence—only a logo and two brand colors. There was no website, no brand system, and no clear direction for how the company would show up to customers online. My challenge was to take these minimal starting points and build them into a cohesive brand and functional product that could drive conversions.
Because we were starting from nothing, we needed to iterate quickly and collaboratively. I worked closely with employees to generate early concepts, then tested those ideas through external critiques and focus groups. Using Maze, we got participant panels to gather targeted feedback on the brand direction. These external voices became a sounding board for early decisions, helping us validate what resonated and where we needed to adjust before investing in full-scale development.
User Interviews and Testing
One of the guiding principles I brought to QuickFresh was simple: “Your opinion, though interesting, is irrelevant if you are not the customer.” Internal feedback is valuable for alignment, but true optimization only comes from understanding how real users interact with the product.
As soon as our designs were in a testable state, I made it a priority to put them in front of actual customers. Early on, we leaned heavily on case studies that allowed us to get feedback on our service and as our website user feedback group, giving us continuous insight into pain points and opportunities. To expand beyond internal circles, we also used Maze to recruit participants and validate our brand and experience with external audiences.
This focus on data-backed feedback ensured that every design decision was grounded in customer behavior, not assumptions. It also created a culture of rapid iteration and continuous optimization, directly aligning with conversion rate optimization (CRO) best practices: test early, test often, and let the customer guide where to double down.
Example Maze Test
Site Architecture
Designing the QuickFresh site came with significant complexity because of the variety of meal choices, plans, and upsell options customers could select. Unlike a simple one-size-fits-all checkout, QuickFresh offered multiple pathways depending on a customer’s needs.
At the start, users could enter through different product offerings such as LowCal, Keto, FreshStart, or entrée bundles (6 or 10 meals). From there, they had to decide on frequency (3-day, 5-day, or 7-day options), add-ons like breakfast, and choose between bundle types. Each decision branched into the next, eventually leading to the cart and checkout.
On top of that, QuickFresh layered in optional coaching services and special programs like ambassador offers, which created additional branching paths in the flow. The checkout itself had further considerations: logged-in vs. new users, upsells after purchase, and integrations with systems like Shopify and Hubspot for order management.
This architecture meant we weren’t just designing a straightforward “browse → cart → checkout” flow. Instead, we needed to orchestrate a complex decision tree that could handle multiple meal plans, frequencies, and upsells—while still feeling seamless and intuitive for the customer. Mapping this flow early on was essential to ensure that no matter which entry point a user came from, they could navigate to a completed purchase without confusion.
Site Architecture
The MVP
Low-Fidelity Wireframes
Before moving into polished designs, I created a series of low-fidelity wireframes, starting with a mobile-first approach. Since most QuickFresh customers browsed and purchased on their phones, it was essential to make the mobile experience seamless before scaling up to desktop.
We also began with the checkout and meal selection process—the most critical flow for driving conversions. By focusing on this path first, we could quickly validate whether customers could easily select meals, understand add-ons, and complete their purchase without confusion.
These early wireframes were crucial for two reasons:
Internal Alignment: With QuickFresh starting from almost nothing, wireframes gave internal stakeholders a tangible way to see how the site might come together. It allowed employees to react to layout and flow decisions without being distracted by colors, imagery, or brand styling.
Early Validation: By keeping things simple, we could quickly test what worked and what didn’t. Wireframes became a low-cost way to uncover friction points and make changes before committing to high-fidelity designs or development.
This step helped us secure early buy-in from internal teams and ensured that when we brought designs in front of customers, the foundation was already solid.
Initial Wireframes
High-Fidelity Wireframes & Testing
Once the low-fidelity wireframes confirmed our direction, I moved into high-fidelity wireframes, again taking a mobile-first approach and starting with the checkout and meal selection process. Because this was the core revenue-driving flow, it was critical to validate every detail, from plan selection to add-ons to payment, before building out the rest of the site.
At this stage, we introduced real branding, content, and interaction states, which allowed us to put the designs directly in front of users for testing. Using Hotjar recordings, heatmaps, and Maze focus groups, we observed how customers interacted and identified areas to optimize.
Through repeated testing cycles, the high-fidelity wireframes evolved into designs that were not only visually polished but also validated against real customer behavior, ensuring the final product was optimized for conversion.
Final Designs
The Final Product
The final QuickFresh experience combined a cohesive brand identity with an optimized, conversion-focused website. What began as only a logo and two colors evolved into a polished digital presence that felt trustworthy, modern, and uniquely ownable.
The site was designed mobile-first, reflecting how most customers discovered and purchased meals. At launch, the meal selection and checkout flows were prioritized to ensure that the most critical part of the customer journey was seamless. Customers could easily browse plans, select meals, and complete their purchase without unnecessary friction.
Through rounds of testing and iteration, the final product aligned directly with real customer behavior. Navigation was streamlined with the menu elevated to the primary action, checkout was restructured to reduce drop-offs, and upsells were introduced post-purchase instead of during. Together, these decisions delivered measurable lifts in conversions and checkout completions, proving the value of a design process grounded in user feedback and data.
The end result wasn’t just a functional site, it was a scalable foundation for growth, blending brand, usability, and performance into one experience.
Final Design
Insights
Even with extensive testing, no design is ever 100% right the first time—and that’s okay. What mattered was that each round of testing gave us the opportunity to learn, adapt, and improve the experience in ways that directly impacted conversions. Two insights stood out as particularly impactful:
Hero Section CTA
Testing revealed that users overwhelmingly preferred the menu button over the “Get Started” call-to-action in the hero. By making the menu the primary action, we aligned the design with real user behavior and saw a 2–3% increase in conversions.Checkout Flow Optimization
We discovered that combining the meal purchase and coaching upsell in one flow caused unnecessary drop-offs. By separating the process into two steps—first completing the meal purchase, then offering coaching as a separate upsell—we achieved a 1% lift in completed checkouts.
These insights reinforced a key principle: testing doesn’t eliminate mistakes, but it ensures they’re caught early and turned into opportunities for measurable improvement.
Example Heat Map
Pattern
This is a feature description spanning a couple of lines.
See Case Study
Nature's Sunshine
This is a feature description spanning a couple of lines.
See Case Study
© Copyright 2025, Ashton Grover