WubbaNub
Tons of love in every Wub!
WubbaNub
Tons of love in every Wub!
WubbaNub
Tons of love in every Wub!
Applying usability heuristics to enhance the E-commerce experience.
Role
Role
UI/UX Design
UI/UX Design
Timeline
Timeline
4 months
4 months
Project
Project
Academic
Academic
Tools
Tools
Figma, Miro, Baymard
Figma, Miro, Baymard
What I did
What I did
UI Design, UX Design, UX Research, Wireframing, Prototyping, Baymard Analysis
UI Design, UX Design, UX Research, Wireframing, Prototyping, Baymard Analysis
Brand Overview
Brand Overview
Founded in 1999 by a mom, WubbaNub is a brand that specializes in baby pacifiers that are attached to plush toys. The concept behind WubbaNub is to combine a soothing pacifier with a soft, cuddly toy, making it easier for babies to hold onto and keep track of their pacifier.
Founded in 1999 by a mom, WubbaNub is a brand that specializes in baby pacifiers that are attached to plush toys. The concept behind WubbaNub is to combine a soothing pacifier with a soft, cuddly toy, making it easier for babies to hold onto and keep track of their pacifier.
Project Overview
Project Overview
The WubbaNub project aimed to enhance the brand by incorporating e-commerce functionalities and introducing innovative features. The objective was to facilitate direct purchases through the website, delivering an engaging user experience while preserving the brand's core identity.
The WubbaNub project aimed to enhance the brand by incorporating e-commerce functionalities and introducing innovative features. The objective was to facilitate direct purchases through the website, delivering an engaging user experience while preserving the brand's core identity.
The Problem
The Problem
The absence of an e-commerce experience on the WubbaNub website compels buyers to navigate to third-party platforms to complete their purchases. This disconnected process introduces potential hurdles for customers, including the need to switch between multiple websites and encountering unfamiliar interfaces. As a result, the overall shopping journey becomes fragmented, tedious, and time-consuming for buyers.
The absence of an e-commerce experience on the WubbaNub website compels buyers to navigate to third-party platforms to complete their purchases. This disconnected process introduces potential hurdles for customers, including the need to switch between multiple websites and encountering unfamiliar interfaces. As a result, the overall shopping journey becomes fragmented, tedious, and time-consuming for buyers.
Website Evaluation
Website Evaluation
To optimize the WubbaNub website, we conducted a comprehensive usability audit using the Baymard Institute's evaluation framework. This in-depth analysis focused on pinpointing specific visual design, usability, and navigation shortcomings. By meticulously examining these areas, we were able to identify clear action points for improvement.
To optimize the WubbaNub website, we conducted a comprehensive usability audit using the Baymard Institute's evaluation framework. This in-depth analysis focused on pinpointing specific visual design, usability, and navigation shortcomings. By meticulously examining these areas, we were able to identify clear action points for improvement.
Existing Website
Baymard score:
-22.2
Design Challenge
Design Challenge
How might we integrate e-commerce into the WubbaNub website to streamline the buying experience, enhance brand engagement, and foster customer loyalty, all while creating a more intuitive and engaging platform for users?
How might we integrate e-commerce into the WubbaNub website to streamline the buying experience, enhance brand engagement, and foster customer loyalty, all while creating a more intuitive and engaging platform for users?
Approach
Approach
User-Centered
Placing users at the center of design process to ensure that every decision made is aimed to improve their experience.
Streamlined Navigation
Reducing cognitive load and the number of steps necessary by consumers to identify and purchase products.
Seamless Integration
Integrating e-commerce by maintaining consistency in visual design and interaction of the existing WubbaNub website.
Design Outcomes
Design Outcomes
The home page layout was revamped for a more user-friendly interface, product browsing was enhanced to make it easier for customers to find items, the checkout process was streamlined for a faster and smoother transaction experience, and a SaaS solution was integrated to increase customer acquisition.
The home page layout was revamped for a more user-friendly interface, product browsing was enhanced to make it easier for customers to find items, the checkout process was streamlined for a faster and smoother transaction experience, and a SaaS solution was integrated to increase customer acquisition.
Action-focused Homepage
The homepage was redesigned to reinforce WubbaNub's brand identity, using strategic placements to effectively guide customers toward desired actions. In addition, a search functionality was integrated, along with a wishlist feature for users to save and track their favorite items, and a cart feature that ensures a smoother and more intuitive checkout process.
The homepage was redesigned to reinforce WubbaNub's brand identity, using strategic placements to effectively guide customers toward desired actions. In addition, a search functionality was integrated, along with a wishlist feature for users to save and track their favorite items, and a cart feature that ensures a smoother and more intuitive checkout process.
Strategic SaaS Solution
The SaaS solution implemented on the homepage for customer acquisition is designed to increase sales by offering a discount on the first purchase. WubbaNub can efficiently attract new customers and incentivize first-time buyers. This method will not only increase user engagement but also give vital insights through analytics, allowing data-driven decisions to optimize further growth.
The SaaS solution implemented on the homepage for customer acquisition is designed to increase sales by offering a discount on the first purchase. WubbaNub can efficiently attract new customers and incentivize first-time buyers. This method will not only increase user engagement but also give vital insights through analytics, allowing data-driven decisions to optimize further growth.
Intuitive Product Browsing
The products section optimizes the product search experience by incorporating filters like categories, price, collection, and availability. This enables users to efficiently discover new products while quickly finding items that match their preferences, ensuring a seamless and enjoyable shopping journey.
The products section optimizes the product search experience by incorporating filters like categories, price, collection, and availability. This enables users to efficiently discover new products while quickly finding items that match their preferences, ensuring a seamless and enjoyable shopping journey.
Seamless Checkout
The checkout section highlights the integration of a new e-commerce functionality, which is absent in the existing website. This streamlines the purchasing process with features like a simplified cart system, secure payment options, and an intuitive, step-by-step checkout flow. These improvements ensure a smooth and hassle-free experience for customers, making it easier to complete purchases quickly and confidently.
The checkout section highlights the integration of a new e-commerce functionality, which is absent in the existing website. This streamlines the purchasing process with features like a simplified cart system, secure payment options, and an intuitive, step-by-step checkout flow. These improvements ensure a smooth and hassle-free experience for customers, making it easier to complete purchases quickly and confidently.
Available for work
Redesigned Website Evaluation
Redesigned Website Evaluation
Baymard analysis was conducted on the redesigned website, which achieved a 71.2% score. The score reflects a strong user experience, with aspects like navigation, product discovery, and the checkout process operating effectively.
Baymard analysis was conducted on the redesigned website, which achieved a 71.2% score. The score reflects a strong user experience, with aspects like navigation, product discovery, and the checkout process operating effectively.
Redesigned Website
Baymard score:
71.2
User Testing
User Testing
To evaluate the impact of the updated website design, user testing was conducted with 5 participants. The sessions included three main tasks to help website’s usability and overall user experience.
To evaluate the impact of the updated website design, user testing was conducted with 5 participants. The sessions included three main tasks to help website’s usability and overall user experience.
Eligibility Criteria
Participants should represent the target audience (new parents or caregivers).
Participants should represent the target audience (new parents or caregivers).
They should have experience with online shopping and basic digital navigation.
They should have experience with online shopping and basic digital navigation.
Users need to be comfortable using electronic devices.
Users need to be comfortable using electronic devices.
5
Total Participants
20 min
Average Testing Session
25
Completed Tasks
What worked?
What worked?
Users found the navigation intuitive and easy to use.
The website's overall aesthetics was praised for its visually appealing and engaging design.
Filters like categories, price, collection, and availability helped users quickly find relevant products.
Users found the navigation intuitive and easy to use.
The website's overall aesthetics was praised for its visually appealing and engaging design.
Filters like categories, price, collection, and availability helped users quickly find relevant products.
What didn't?
What didn't?
Users found the blue text on a white background difficult to read, especially in sections with smaller font sizes. The low contrast made it challenging for some participants to quickly scan the information. To improve readability, a higher-contrast color or a bolder font weight could be considered.
Users found the blue text on a white background difficult to read, especially in sections with smaller font sizes. The low contrast made it challenging for some participants to quickly scan the information. To improve readability, a higher-contrast color or a bolder font weight could be considered.
Key Takeaways
Key Takeaways
Understanding the integration of e-commerce feature with SaaS platform is important to enhance customer acquisition and engagement.
Integrating the right Software as a Service (SaaS) platform is crucial, particularly in case of WubbaNub, which offers pacifiers for babies from 0-6 months with a focus on attracting new customers rather than customer retention.
The integration of e-commerce and SaaS enables the business to make data-driven decisions by gaining valuable insights into customer behavior and preferences.
Understanding the integration of e-commerce feature with SaaS platform is important to enhance customer acquisition and engagement.
Integrating the right Software as a Service (SaaS) platform is crucial, particularly in case of WubbaNub, which offers pacifiers for babies from 0-6 months with a focus on attracting new customers rather than customer retention.
The integration of e-commerce and SaaS enables the business to make data-driven decisions by gaining valuable insights into customer behavior and preferences.
WubbaNub
Tons of love in every Wub!