UTILITY WAREHOUSE
UTILITY WAREHOUSE
Sign-up Journey Redesign
Sign-up Journey Redesign
Redesigned the "Build Your Bundle" screen at Utility Warehouse, where customers can combine utilities for discounts, to make the process easier and increase conversion.
Redesigned the "Build Your Bundle" screen at Utility Warehouse, where customers can combine utilities for discounts, to make the process easier and increase conversion.
Utility Warehouse's Company Vision:
Utility Warehouse's Company Vision
To simplify life for homeowners by providing all essential services under one roof, delivering value, convenience, and exceptional customer experience through seamless integration and innovation.
To simplify life for homeowners by providing all essential services under one roof, delivering value, convenience, and exceptional customer experience through seamless integration and innovation.
My Role
Lead UX Designer
Collaboration
Product
Marketing
Engineering
Data Science
Cross Functional Teams
Strategic Impact
Increased Conversion
Reduced Drop-Offs
Revenue Growth
The Challenge
The Challenge
The process was frustrating for users and led to high drop-off rates, so my goal was to simplify the experience without removing important options – making it easier and clearer to complete.
76% of users abandoned the main "Build Your Bundle" screen.
The process was frustrating for users and led to high drop-off rates, so my goal was to simplify the experience without removing important options – making it easier and clearer to complete.
The process was frustrating for users and led to high drop-off rates, so my goal was to simplify the experience without removing important options – making it easier and clearer to complete.
76% of users abandoned the main "Build Your Bundle" screen.
44% of users who moved to the next step circled back to the screen, but still dropped out.
44% of users who moved to the next step circled back to the screen, but still dropped out.
44% of users who moved to the next step circled back to the screen, but still dropped out.
76% of users abandoned the main "Build Your Bundle" screen.
The Results
The Impact
Improved Completion Rates (Test Environment) – Usability testing showed a 30% increase in users successfully completing the "Build Your Bundle" process compared to the original design.
Projected Revenue Impact – Based on test data, the improved bundle experience is expected to drive a 12% increase in average order value once released.
Improved Completion Rates (Test Environment): Usability testing showed a 30% increase in users successfully completing the "Build Your Bundle" process compared to the original design.
Improved Completion Rates (Test Environment) – Usability testing showed a 30% increase in users successfully completing the "Build Your Bundle" process compared to the original design.
Projected Revenue Impact – Based on test data, the improved bundle experience is expected to drive a 12% increase in average order value once released.
Projected Revenue Impact: Based on test data, the improved bundle experience is expected to drive a 12% increase in average order value once released.
My Role
Lead UX Designer
Process
Discover
Define
Develop
Deliver
Collaboration
Product
Engineering
Partners
Cross Functional
Strategic Impact
Increase Conversion
Reduced Drop-offs
Revenue Growth
01 Discover
01 Discover
The first part of the process was to understand our users through comprehensive quantitative and qualitative research.
The first part of the process was to understand our users through comprehensive quantitative and qualitative research.
Quantitative research using Mixpanel
As the first step I used Mixpanel to analyse quantitative metrics, I identified key patterns in how users navigate the sign-up journey:
Quantitative research using Mixpanel
As the first step I used Mixpanel to analyse quantitative metrics, I identified key patterns in how users navigate the sign-up journey:
FullStory Analysis & Live Session Observations
I validated these findings by reviewing FullStory session replays and observing live user sessions to understand how customers interact with the "Build Your Bundle" screen in real time.
FullStory Analysis & Live Session Observations
I validated these findings by reviewing FullStory session replays and observing live user sessions to understand how customers interact with the "Build Your Bundle" screen in real time.
Moderated Usability Testing
To gain deeper insights and validate the design, I conducted usability testing with non-customers. This helped me understand how the screen shaped their perception of service options and influenced their ability to customise their bundle.
Moderated Usability Testing
To gain deeper insights and validate the design, I conducted usability testing with non-customers. This helped me understand how the screen shaped their perception of service options and influenced their ability to customise their bundle.
Evaluating the Current Experience
Evaluating the Current Experience
I conducted a UX audit of the current product following our research phase.
I conducted a UX audit of the current product following our research phase.
Starting with a mobile-first design approach, as 70% of our sign-up traffic comes from mobile users.
Starting with a mobile-first design approach, as 70% of our sign-up traffic comes from mobile users.
After completing the discovery phase and UX audit, I had a clear understanding of the challenges in the sign-up journey. I then focused on exploring design solutions to address the identified pain points.
After completing the discovery phase and UX audit, I had a clear understanding of the challenges in the sign-up journey. I then focused on exploring design solutions to address the identified pain points.
02 Define
Since the sign-up journey's functionality showed no major issues, and most problems stemmed from UI and information presentation, I was able to move straight into the design process.
Since the sign-up journey's functionality showed no major issues, and most problems stemmed from UI and information presentation, I was able to move straight into the design process.
I organised and facilitated a two-day, in-person design sprint workshop where we discussed our findings and collaboratively ideated design solutions. These sessions aligned the team, encouraged rapid idea generation, and helped prioritise key improvements for the redesign.
I organised and facilitated a two-day, in-person design sprint workshop where we discussed our findings and collaboratively ideated design solutions. These sessions aligned the team, encouraged rapid idea generation, and helped prioritise key improvements for the redesign.
Competitor Research
Competitor Research
I also conducted competitor research to understand how our offering compares to others and to identify common design patterns. This helped highlight gaps and opportunities, ensuring the redesign aligned with user expectations and industry standards.
I also conducted competitor research to understand how our offering compares to others and to identify common design patterns. This helped highlight gaps and opportunities, ensuring the redesign aligned with user expectations and industry standards.
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
Design Solutions
03 Develop
After finalising high-fidelity designs and collaborating with design systems to create missing components, I used these to prototype the full sign-up journey.
03 Develop
After finalising high-fidelity designs and collaborating with design systems to create missing components, I used these to prototype the full sign-up journey.
Key Design Decisions
Key Design Decisions
Order Summary Design for Clarity
Order Summary Design for Clarity
Usability testing revealed that users struggled to track selected services and pricing. To address this, I introduced an order summary to display bundled services and their costs clearly.
Usability testing revealed that users struggled to track selected services and pricing. To address this, I introduced an order summary to display bundled services and their costs clearly.
Testing Results - After implementing the basket design, further testing showed improved user confidence and a smoother selection process, reducing backtracking and drop-offs.
Testing Results - After implementing the basket design, further testing showed improved user confidence and a smoother selection process, reducing backtracking and drop-offs.
Clear Call to Actions (CTAs)
Clear Call to Actions (CTAs)
FullStory analysis revealed users struggled to identify where to click due to the lack of clear CTAs in the original design. To address this, I added prominent CTAs at the bottom of the screen and a ‘More About Each Service’ CTA for every service option.
FullStory analysis revealed users struggled to identify where to click due to the lack of clear CTAs in the original design. To address this, I added prominent CTAs at the bottom of the screen and a ‘More About Each Service’ CTA for every service option.
Testing Results – Usability testing after these changes showed improved navigation, with users progressing through the journey more confidently and experiencing fewer drop-offs.
Testing Results – Usability testing after these changes showed improved navigation, with users progressing through the journey more confidently and experiencing fewer drop-offs.
'Bundlebot' Redesign - Clarity and Accessibility
'Bundlebot' Redesign - Clarity and Accessibility
Users found it unclear how to unlock bundle benefits, and the original 'bundle-bot' design was not WCAG compliant. I redesigned this to be more informative, updated the colours for accessibility, and refined the copy for clarity.
Users found it unclear how to unlock bundle benefits, and the original 'bundle-bot' design was not WCAG compliant. I redesigned this to be more informative, updated the colours for accessibility, and refined the copy for clarity.
Testing Results: Usability testing showed participants could clearly verbalise their understanding of the bundlebot messaging while completing tasks. When asked for feedback, users described the redesign as helpful, using terms like "help," "tooltip," and "informational."
Testing Results: Usability testing showed participants could clearly verbalise their understanding of the bundlebot messaging while completing tasks. When asked for feedback, users described the redesign as helpful, using terms like "help," "tooltip," and "informational."
Status Indicators
Status Indicators
I added status updates to the service tiles, such as ‘Selected’ or ‘In Your Bundle,’ to provide clear visual feedback on user choices.
I added status updates to the service tiles, such as ‘Selected’ or ‘In Your Bundle,’ to provide clear visual feedback on user choices.
Test Results: This reduced confusion and helped users track their selections more easily, resulting in smoother progression through the sign-up journey.
Test Results: This reduced confusion and helped users track their selections more easily, resulting in smoother progression through the sign-up journey.
Unlock Benefits Redesign
Unlock Benefits Redesign
Users found the progress bar in the unlocked benefits section unhelpful and preferred a clear list of tangible benefits that have been unlocked. I redesigned this section to feature a dynamic list that updates as users add or remove services, providing clearer motivation to bundle.
Users found the progress bar in the unlocked benefits section unhelpful and preferred a clear list of tangible benefits that have been unlocked. I redesigned this section to feature a dynamic list that updates as users add or remove services, providing clearer motivation to bundle.
I tested this redesigned version through usability testing, which showed users found the benefits clearer and were more confident in adding services to their bundle.
I tested this redesigned version through usability testing, which showed users found the benefits clearer and were more confident in adding services to their bundle.
03 Develop
Design Systems Contribution
Design Systems Contribution
Improving Accessibility
Improving Accessibility
I discovered that users with visual impairments found navigation difficult due to poor colour contrast.
I discovered that users with visual impairments found navigation difficult due to poor colour contrast.
Standardising Tile Components for Consistency
Standardising Tile Components
I introduced a standardised tile component to replace inconsistent designs by working with teams across the business to gather use cases and understand their needs.
Collaborating with design systems, I created clear guidelines and standardised interactions to reduce design debt and ensure seamless adoption across multiple product areas.
I introduced a standardised tile component to replace inconsistent designs by working with teams across the business to gather use cases and understand their needs.
Collaborating with design systems, I created clear guidelines and standardised interactions to reduce design debt and ensure seamless adoption across multiple product areas.
04 Deliver
04 Deliver
Feature Flag Release
Feature Flag Release
We released the new “Build Your Bundle” screen under a feature flag, allowing us to manage the rollout and track performance.
Initially, we planned to release it to Partners only following its announcement at Power Up, our annual internal conference, before expanding to a wider audience.
We released the new “Build Your Bundle” screen under a feature flag, allowing us to manage the rollout and track performance.
Initially, we planned to release it to Partners only following its announcement at Power Up, our annual internal conference, before expanding to a wider audience.
This approach enabled us to gather real-time data and feedback from Partners first, providing a baseline to measure the impact of the redesign. With the feature flag in place, we can run further experiments and make iterative improvements to drive higher multi-service uptake.
This approach enabled us to gather real-time data and feedback from Partners first, providing a baseline to measure the impact of the redesign. With the feature flag in place, we can run further experiments and make iterative improvements to drive higher multi-service uptake.
Full Release
Full Release
In the second phase, we rolled out to 10-20% of customers to test performance and gather feedback, followed by a 50% rollout to validate at scale. The final phase enabled the feature for all users, with continued monitoring to optimise and ensure long-term success.
In the second phase, we rolled out to 10-20% of customers to test performance and gather feedback, followed by a 50% rollout to validate at scale. The final phase enabled the feature for all users, with continued monitoring to optimise and ensure long-term success.
Next Steps
Next Steps
Track Post-Launch Performance by continuously monitoring user engagement, conversion rates, and drop-offs to identify areas for refinement.
Track Post-Launch Performance by continuously monitoring user engagement, conversion rates, and drop-offs to identify areas for refinement.
Gather Partner Feedback through follow-up surveys and interviews to ensure the bundle experience aligns with their needs and expectations.
Gather Partner Feedback through follow-up surveys and interviews to ensure the bundle experience aligns with their needs and expectations.
Iterate Based on Data by using insights from FullStory and Mixpanel to make incremental improvements to the sign-up journey.
Iterate Based on Data by using insights from FullStory and Mixpanel to make incremental improvements to the sign-up journey.
Run A/B Tests on Marketing Language to explore how different messaging influences user engagement and conversion rates.
Run A/B Tests on Marketing Language to explore how different messaging influences user engagement and conversion rates.
Reflections
Reflections
What Went Well
What Went Well
User-Centred Design Decisions – Conducting usability testing throughout the process ensured that design changes directly addressed user pain points, leading to clearer service selection and reduced confusion.
User-Centred Design Decisions – Conducting usability testing throughout the process ensured that design changes directly addressed user pain points, leading to clearer service selection and reduced confusion.
Collaborative Workshops – The two-day design sprint fostered strong alignment across teams, generating valuable ideas that shaped the final design.
Collaborative Workshops – The two-day design sprint fostered strong alignment across teams, generating valuable ideas that shaped the final design.
Improved Clarity and Accessibility – Redesigning the Bundle Bot to meet WCAG compliance and refining copy significantly enhanced the overall user experience, with positive feedback from participants.
Improved Clarity and Accessibility – Redesigning the Bundle Bot to meet WCAG compliance and refining copy significantly enhanced the overall user experience, with positive feedback from participants.
What Could Be Improved
What Could Be Improved
Handling Edge Cases – Some users encountered edge cases that were not fully addressed in initial prototypes. Expanding test scenarios and including more diverse user paths could help identify and resolve these issues earlier.
Handling Edge Cases – Some users encountered edge cases that were not fully addressed in initial prototypes. Expanding test scenarios and including more diverse user paths could help identify and resolve these issues earlier.
Balancing Stakeholder Input – While stakeholder feedback was valuable, balancing their requests with user insights was occasionally challenging. A stronger emphasis on data-driven decision-making could streamline prioritisation and ensure the design remains user-focused.
Balancing Stakeholder Input – While stakeholder feedback was valuable, balancing their requests with user insights was occasionally challenging. A stronger emphasis on data-driven decision-making could streamline prioritisation and ensure the design remains user-focused.
Gamifying the Experience – As the business plans to introduce new products and services into the sign-up journey, there is an opportunity to gamify the experience. Adding progress indicators, reward-based messaging, or interactive elements could increase engagement and encourage users to unlock more services.
Gamifying the Experience – As the business plans to introduce new products and services into the sign-up journey, there is an opportunity to gamify the experience. Adding progress indicators, reward-based messaging, or interactive elements could increase engagement and encourage users to unlock more services.
More Case Studies:
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
More Case Studies:
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
5 min read
UTILITY WAREHOUSE
AI-Powered Home Insurance
UX/UI •
FINANCIAL SERVICES •
WEB