MIA LIU
Pul Technologies
Website Redesign
Enhancing website for B2B + B2C growth: Crafting a User-Centric Experience that Expands Revenue Streams
Team
1 PM, 1 Copywriter, 2 UI/UX Designers
My Role
Lead in UX/UI design,
User Research, & Design Systems
Duration
12 weeks
(March - May 2022)
Tool
Figma, FigJam,
Miro, Photoshop
Background
PUL Technologies, a leading company in the medical equipment industry, embarked on a strategic transition from a purely B2B model to a B2B + B2C model.
Recognizing the growing demand for their products from individual consumers, PUL Technologies sought to refresh and rebuild their website to better align with this new business direction. This project aimed to create a user-centric UI/UX design that caters to the diverse needs of both B2B and B2C customers, ultimately driving increased engagement and conversions.
Individual Customer
I'm interested in purchasing the dental product from the PUL website, but it appears to cater exclusively to businesses for bulk orders.
Our Client
Let's rebuild our website to serve both businesses and individual customers.
Current Challenges
PUL Technologies' current website primarily caters to bulk orders from businesses and dental professionals, lacking options for individual customers seeking smaller quantity purchases.
This exclusion of individual customers may result in inconvenience, missed revenue opportunities, and a competitive disadvantage compared to companies that cater to both B2B and B2C markets.
Our Goal
Enhance the PUL Technologies website to cater to both business clients and individual customers, eliminating exclusion, maximizing revenue opportunities, and ensuring competitiveness in the B2B and B2C markets.
Project Timeline
User Research
We conducted extensive user research, including the distribution of 70+ user surveys, conducting 10+ interviews, and performing usability testing on three separate occasions.
By understanding the needs, preferences, and pain points of business clients and individual customers, we gain insights into their browsing behavior, expectations, and goals.
Research Insights
The survey insights highlight the importance of designing a website that accommodates both B2B and B2C customers' preferences and needs. Clear product information, pricing transparency, customizable features, and a user-friendly interface emerge as key areas for improvement.
56%
Among the respondents, the majority identified themselves as dental professionals (56%), followed by individual customers (13%) and business owners/managers (31%).
🌟 Product variety (32%)
🌟 Pricing transparency (32%)
Factors influencing the choice of PUL over competitors were evenly distributed, with product variety (32%) and pricing transparency (32%) being the top two factors.
🌟 Bulk pricing discounts (61%)
🌟 Customizable orders (45%)
Among business clients, bulk pricing discounts (61%) and customizable orders (45%) were deemed essential features for placing bulk orders.
64%
Detailed product specifications and descriptions were rated as extremely important by 64% of respondents, emphasizing the need for comprehensive information.
🌟 Customization options
🌟 Easy reordering process
Customization options and an easy reordering process were seen as valuable features for business clients, streamlining their ordering process.
🌟 Clear product images (53%)
🌟 Checkout processes (42%)
Individual customers emphasized clear product images (53%) and easy checkout processes (42%) as key aspects enhancing their shopping experience.
Business Clients
1 / Needs and Preferences
Streamlined ordering process, access to product catalogs, pricing information, and bulk quantity options.
2 / Pain Points
Complex ordering processes, managing bulk orders, limited visibility into account history and order tracking.
3 / Browsing Behavior
Focused product searches, price comparisons, and reviewing technical specifications.
4 / Expectations
Reliable website, smooth transactions, competitive pricing, and comprehensive account management.
Individual Customers
1 / Needs and Preferences
Convenience, smaller quantity options, clear product information, and easy navigation.
2 / Pain Points
Lack of smaller quantity options, difficulty finding relevant products, feeling neglected compared to bulk orders.
3 / Browsing Behavior
Exploring different product categories, relying on detailed descriptions, images, and customer reviews.
4 / Expectations
User-friendly interface, transparent pricing, flexible quantity options, and responsive customer support.
Solutions
1 / Personal Care & Dental Professional Pages
Create separate sections on the website for personal care and dental professionals, showcasing relevant products, services, and resources.
2 / Introduce Smaller Quantity Options
Implement a dedicated section for individual customers to easily purchase smaller quantities of products, improving their shopping experience.
3 / Streamline Ordering Process
Simplify the ordering process for business clients with automated features like bulk order templates, saved order history, and reorder options.
4 / Mobile-Friendly Design
Optimize the website for mobile devices, ensuring a seamless and enjoyable browsing experience for users on smartphones and tablets.
Wireframes
I arranged and prioritized the content within the wireframes, which serve as a structured blueprint. These wireframes define the layout and placement of content, aiding in the visualization of the website's user interface and overall user experience.
Grid System
Layout grids serve as a tool for aligning objects within a frame, offering a visual structure that enhances the coherence of our designs. By employing layout grids, I ensure that our designs maintain a sense of logic and consistency, regardless of the platform or device being used.
12 Columns Column Width 88px Container 1320px Gutter Space 24px
Typography
Within the typography library, I offer a framework that empowers designers to forge a uniform and cohesive visual identity across diverse design elements, ensuring an optimal reading experience.
Colors
Informed by user data revealing a predominantly female audience on the PUL website, I strategically employed pastel colors for the personal care pages. This choice aims to cultivate a welcoming and engaging atmosphere tailored to the preferences of the majority of users. Conversely, for the Dental professional pages, a light blue color scheme was selected to instill a sense of professionalism, aligning with the context of dental services.
Components
The components were created to seamlessly integrate, fostering the effortless reuse of elements across the interface. The utilization of variants plays a key role in grouping and organizing similar components within a unified container.
User Interface
Designed for diverse users with different needs
Bulk orders, monthly subscriptions, & special offers available for dental professionals
Seamless and enjoyable browsing experience for users on smartphones and tablets
Getting to know Pul with founder story, product timeline, tutorials, and much more
Reflection
The journey of refreshing and rebuilding the PUL Technologies website has been transformative. We encountered challenges and opportunities as we transitioned from a B2B to a B2B + B2C approach.
Separate sections for personal care customers and dental professionals effectively catered to their specific requirements. Clear and user-friendly navigation improved browsing, while mobile optimization ensured a seamless experience across devices.
23.5%
Conversion rate for individual customers from AB Testing
13.3%
New visitors bounce rate
after 3 months
9.4%
Return Visits for individual customers after 3 months