Boulder Lab — Membership & Checkout Redesign (UX/UI)
An end-to-end UX/UI → front-end project exploring how usability evaluation can meaningfully improve a real purchase journey.
ROLE SNAPSHOT
Conducted heuristic evaluations to identify usability issues in the purchase flow
Redesigned membership selection and checkout for clarity and consistency
Implemented the redesigned experience with responsive front-end code
Client
Boulder Lab
Timeline
~4 months
Focus Areas
UX/UI Design · Usability Evaluation · Frontend Dev.
CONTEXT
Boulder Lab is a popular climbing gym offering multiple membership types and pricing options. While the brand is energetic and visually strong, the existing membership purchase flow made it difficult for users to confidently compare plans and understand what they were committing to—especially across mobile and desktop experiences.
This project focused on improving a real, revenue-critical journey without changing the product offering itself, only how information and feedback were presented to users.
PROBLEM
Membership plans were difficult to compare at a glance
Users lacked clear feedback during selection and checkout steps
Inconsistencies between mobile and desktop reduced confidence during purchase
APPROACH
Conducted heuristic evaluations using Jakob Nielsen’s 10 usability heuristics
Analysed the membership and checkout journey step-by-step
Identified breakdowns in hierarchy, feedback, and consistency
Carried the same core problem through redesign and implementation
KEY DESIGN DECISIONS
1. Making membership plans scannable and comparable
Users needed to quickly understand differences between plans without reading dense descriptions.
Design focus:
Clear visual hierarchy between plans
Emphasis on key differentiators (price, access, commitment)
Redesigned membership cards that allow users to compare options at a glance.
2. Providing clear feedback during selection and checkout
The original flow offered limited confirmation that actions had been registered, increasing uncertainty.
Design focus:
Immediate visual feedback for selected plans
Clear progression cues through the checkout steps
Updated selection states and checkout indicators showing where users are and what’s been selected.
3. Ensuring consistency across breakpoints
The experience needed to feel reliable whether users were purchasing on mobile or desktop.
Design focus:
Consistent layout logic across screen sizes
Responsive design that preserved hierarchy and readability
Desktop and mobile layouts showing consistent structure and behaviour.
4. Reducing decision anxiety at the point of purchase
Membership purchase is a high-commitment moment. The flow was redesigned to minimise hesitation by making selections feel reversible, transparent, and low-risk.
Design focus:
Clear confirmation of selected plans and prices
Visibility of what can be changed before payment
Reduced surprise costs or hidden commitments
Checkout screens showing persistent plan summaries, editable selections, and clear price breakdowns.
OUTCOME
Improved clarity and confidence during membership selection
Reduced cognitive load during checkout through clearer feedback and hierarchy
Delivered a responsive, consistent purchase experience across devices
Demonstrated how usability evaluation directly informs better design outcomes
REFLECTION
This project reinforced how small UX decisions—such as spacing, hierarchy, and feedback—can have an outsized impact on user confidence during high-stakes actions like payment. Carrying one problem from evaluation through redesign and implementation helped me see how early usability issues ripple through an entire purchase journey.
Check out some of my recent projects.
Boulder Lab — Membership & Checkout Redesign (UX/UI)
An end-to-end UX/UI → front-end project exploring how usability evaluation can meaningfully improve a real purchase journey.
ROLE SNAPSHOT
Conducted heuristic evaluations to identify usability issues in the purchase flow
Redesigned membership selection and checkout for clarity and consistency
Implemented the redesigned experience with responsive front-end code
Client
Boulder Lab
Timeline
~4 months
Focus Areas
UX/UI Design · Usability Evaluation · Frontend Dev.
CONTEXT
Boulder Lab is a popular climbing gym offering multiple membership types and pricing options. While the brand is energetic and visually strong, the existing membership purchase flow made it difficult for users to confidently compare plans and understand what they were committing to—especially across mobile and desktop experiences.
This project focused on improving a real, revenue-critical journey without changing the product offering itself, only how information and feedback were presented to users.
PROBLEM
Membership plans were difficult to compare at a glance
Users lacked clear feedback during selection and checkout steps
Inconsistencies between mobile and desktop reduced confidence during purchase
APPROACH
Conducted heuristic evaluations using Jakob Nielsen’s 10 usability heuristics
Analysed the membership and checkout journey step-by-step
Identified breakdowns in hierarchy, feedback, and consistency
Carried the same core problem through redesign and implementation
KEY DESIGN DECISIONS
1. Making membership plans scannable and comparable
Users needed to quickly understand differences between plans without reading dense descriptions.
Design focus:
Clear visual hierarchy between plans
Emphasis on key differentiators (price, access, commitment)
Redesigned membership cards that allow users to compare options at a glance.
2. Providing clear feedback during selection and checkout
The original flow offered limited confirmation that actions had been registered, increasing uncertainty.
Design focus:
Immediate visual feedback for selected plans
Clear progression cues through the checkout steps
Updated selection states and checkout indicators showing where users are and what’s been selected.
3. Ensuring consistency across breakpoints
The experience needed to feel reliable whether users were purchasing on mobile or desktop.
Design focus:
Consistent layout logic across screen sizes
Responsive design that preserved hierarchy and readability
Desktop and mobile layouts showing consistent structure and behaviour.
4. Reducing decision anxiety at the point of purchase
Membership purchase is a high-commitment moment. The flow was redesigned to minimise hesitation by making selections feel reversible, transparent, and low-risk.
Design focus:
Clear confirmation of selected plans and prices
Visibility of what can be changed before payment
Reduced surprise costs or hidden commitments
Checkout screens showing persistent plan summaries, editable selections, and clear price breakdowns.
OUTCOME
Improved clarity and confidence during membership selection
Reduced cognitive load during checkout through clearer feedback and hierarchy
Delivered a responsive, consistent purchase experience across devices
Demonstrated how usability evaluation directly informs better design outcomes
REFLECTION
This project reinforced how small UX decisions—such as spacing, hierarchy, and feedback—can have an outsized impact on user confidence during high-stakes actions like payment. Carrying one problem from evaluation through redesign and implementation helped me see how early usability issues ripple through an entire purchase journey.
Check out some of my recent projects.
Boulder Lab — Membership & Checkout Redesign (UX/UI)
An end-to-end UX/UI → front-end project exploring how usability evaluation can meaningfully improve a real purchase journey.
ROLE SNAPSHOT
Conducted heuristic evaluations to identify usability issues in the purchase flow
Redesigned membership selection and checkout for clarity and consistency
Implemented the redesigned experience with responsive front-end code
Client
Boulder Lab
Timeline
~4 months
Focus Areas
UX/UI Design · Usability Evaluation · Frontend Dev.
CONTEXT
Boulder Lab is a popular climbing gym offering multiple membership types and pricing options. While the brand is energetic and visually strong, the existing membership purchase flow made it difficult for users to confidently compare plans and understand what they were committing to—especially across mobile and desktop experiences.
This project focused on improving a real, revenue-critical journey without changing the product offering itself, only how information and feedback were presented to users.
PROBLEM
Membership plans were difficult to compare at a glance
Users lacked clear feedback during selection and checkout steps
Inconsistencies between mobile and desktop reduced confidence during purchase
APPROACH
Conducted heuristic evaluations using Jakob Nielsen’s 10 usability heuristics
Analysed the membership and checkout journey step-by-step
Identified breakdowns in hierarchy, feedback, and consistency
Carried the same core problem through redesign and implementation
KEY DESIGN DECISIONS
1. Making membership plans scannable and comparable
Users needed to quickly understand differences between plans without reading dense descriptions.
Design focus:
Clear visual hierarchy between plans
Emphasis on key differentiators (price, access, commitment)
Redesigned membership cards that allow users to compare options at a glance.
2. Providing clear feedback during selection and checkout
The original flow offered limited confirmation that actions had been registered, increasing uncertainty.
Design focus:
Immediate visual feedback for selected plans
Clear progression cues through the checkout steps
Updated selection states and checkout indicators showing where users are and what’s been selected.
3. Ensuring consistency across breakpoints
The experience needed to feel reliable whether users were purchasing on mobile or desktop.
Design focus:
Consistent layout logic across screen sizes
Responsive design that preserved hierarchy and readability
Desktop and mobile layouts showing consistent structure and behaviour.
4. Reducing decision anxiety at the point of purchase
Membership purchase is a high-commitment moment. The flow was redesigned to minimise hesitation by making selections feel reversible, transparent, and low-risk.
Design focus:
Clear confirmation of selected plans and prices
Visibility of what can be changed before payment
Reduced surprise costs or hidden commitments
Checkout screens showing persistent plan summaries, editable selections, and clear price breakdowns.
OUTCOME
Improved clarity and confidence during membership selection
Reduced cognitive load during checkout through clearer feedback and hierarchy
Delivered a responsive, consistent purchase experience across devices
Demonstrated how usability evaluation directly informs better design outcomes
REFLECTION
This project reinforced how small UX decisions—such as spacing, hierarchy, and feedback—can have an outsized impact on user confidence during high-stakes actions like payment. Carrying one problem from evaluation through redesign and implementation helped me see how early usability issues ripple through an entire purchase journey.