Case Study 4: Improve Holt's Cigar Checkout Process on Mobile
Current Design
|
Overview:
Holts.com is a premium cigar retailer with customers that skew older (55+). When I noticed their mobile checkout was frustrating users, I discovered a classic case of "what seems logical to designers isn't always logical to users." This project taught me the importance of testing assumptions, especially when designing for demographics different from typical tech users. PROBLEM: The single-page checkout seemed efficient in theory, but created real usability issues:
|
Research Process:
I used Holts' physical lounge to my advantage—I could actually talk to real customers face-to-face:
The breakthrough moment was watching a 62-year-old customer try to change his shipping address. He scrolled up and down for two minutes looking for the right section, then gave up and started over. That's when I knew we had a real problem.
Design Process:
I explored several approaches but kept returning to one insight: older users need clear signposts.
Three options considered:
I chose Option 2 because:
I used Holts' physical lounge to my advantage—I could actually talk to real customers face-to-face:
- Interviewed 8 regular customers in-person about their online shopping habits
- Used Inspectlet recordings to watch how people actually used the checkout process
- Asked customers to complete a purchase while I observed their behavior
- Created personas based on the demographic data we had about our typical customer
The breakthrough moment was watching a 62-year-old customer try to change his shipping address. He scrolled up and down for two minutes looking for the right section, then gave up and started over. That's when I knew we had a real problem.
Design Process:
I explored several approaches but kept returning to one insight: older users need clear signposts.
Three options considered:
- Keep single page but improve navigation anchors
- Break into distinct steps with progress indicator
- Hybrid approach with collapsible sections
I chose Option 2 because:
- Gave users clear sense of progress and location
- Going "back" felt natural and safe
- Each step could be optimized for mobile without overwhelming users
- Matched mental models from familiar checkout processes
I’ve created some user personas to gain some perspective into the kinds of customers we have based on demographic research of who our users are.
|
|
|
Wireframe sketches for exploratory ideas
Holts.com Case Study: Improve Checkout Process – Design Iteration
1st Step - wireframes
What I learned: Out of the different iterations I came up with, I went with what is shown below. Having clearly defined sections set up as pages within a stepper process was a better experience for our large over-55 demographic.
Step 1
|
Step 2
|
Step 3
|
Step 4
|
Step 5-checkout
|
Final Design
Step 1
|
|
Step 5-checkout
|
Implementation Challenges:
Challenge: Stakeholders worried more steps would increase abandonment.
Solution: Showed them our single-page approach was already causing abandonment—just later when it's more frustrating.
Challenge: Technical constraints around form validation across multiple pages.
Solution: Worked with developers to implement smart saving so users never lost progress.
Challenge: Balancing information density for mobile screens.
Solution: Prioritized essential information per screen with progressive disclosure for optional details.
Results:
The stepped process delivered significant improvements:
User feedback: "The less scrolling I have to do to find my way, the better." - John Alexander
Another customer mentioned feeling "more confident" she wouldn't lose her information.
Most importantly, we saw measurable increase in completed purchases from the 55+ demographic on mobile devices.
What I learned:
What I possibly would do differently:
This project reinforced that good UX research doesn't require fancy tools—sometimes the best insights come from simply watching people use your product and asking "why did you do that?"
Challenge: Stakeholders worried more steps would increase abandonment.
Solution: Showed them our single-page approach was already causing abandonment—just later when it's more frustrating.
Challenge: Technical constraints around form validation across multiple pages.
Solution: Worked with developers to implement smart saving so users never lost progress.
Challenge: Balancing information density for mobile screens.
Solution: Prioritized essential information per screen with progressive disclosure for optional details.
Results:
The stepped process delivered significant improvements:
- 65% of test users preferred the new process
- 32% improvement in mobile checkout completion
- 40% reduction in customer service calls about checkout issues
- 15 seconds faster average completion time despite more steps
User feedback: "The less scrolling I have to do to find my way, the better." - John Alexander
Another customer mentioned feeling "more confident" she wouldn't lose her information.
Most importantly, we saw measurable increase in completed purchases from the 55+ demographic on mobile devices.
What I learned:
- Assumptions are dangerous. What feels "streamlined" to a 30-year-old designer might feel "confusing" to a 60-year-old customer.
- Context matters. Cigar customers aren't impulse buyers—they're making considered purchases and want control of the process.
- Simple isn't always fewer steps. Sometimes more clearly defined steps feel simpler than fewer complex ones.
- Test with real users, not just personas. Access to actual customers in the Holts lounge was invaluable for understanding real vs. assumed behavior.
What I possibly would do differently:
- Start with mobile-first design rather than adapting from desktop
- Test prototype with larger sample size before A/B testing
- Create more detailed analytics tracking for micro-interactions within each step
- Involve customer service in research phase to understand common support issues
This project reinforced that good UX research doesn't require fancy tools—sometimes the best insights come from simply watching people use your product and asking "why did you do that?"