FIT UI COURSE
Williams Sonoma
THE COMPANY
Williams-Sonoma is a retailer of home furnishings and gourmet cookware that offers products for every room in the house. Their vision is to enhance the quality of their customers' lives at home. They are passionate about putting the customer at the center of everything they do, every day.
Original
THE STORY
Williams-Sonoma is a retailer of home furnishings and gourmet cookware that offers products for every room in the house. Their vision is to enhance the quality of their customers' lives at home. They are passionate about putting the customer at the center of everything they do, every day.
THE ROLE
I was the UI designer tasked with researching, analyzing, and redesigning the existing e-commerce website for both mobile and desktop platforms.
THE PROCESS
Research the brand and competitors. Williams-Sonoma, is a specialty retailer of high-quality lifestyle products, that appeal to a diverse audience with varying demographics, lifestyles, and life stages.
Williams-Sonoma's direct competitors include Wayfair, Target, Macy's, Sur La Table, and Crate and Barrel. These companies sell a similar range of home goods and furniture, and they compete for the same customers.
I also researched some non-direct competitors that value design as part of enhancing the user experience. These companies include Caraway Home, Schoolhouse, and Article Home. They sell a narrower range of products, but they are known for their high-quality design and user-friendly websites.
Identify the target audience.
Primary: Residents of suburban and urban areas, college-educated professionals, married with children, serious cooks who keep up with trends and appreciate finer things in life. Secondary: Consumers experiencing significant life milestones like marriage or purchasing a new house.
Challenges identified after research and analysis:
-
Improvement in the site's usability to make it easier to navigate and find information
-
Visually cluttered and hard to navigate
The Mood Board | The mood board showcased images that embodied the aspirational and inspiring lifestyle of the target audience. The selected visuals featured people engaging with the products in ways that resonated with their desires and aspirations.
The Wireframes | Three design options were presented for the wireframes. Once one was chosen, I iterated on the feedback given to create wireframes that prioritized clean, uncluttered design and simple navigation. The new wireframes introduced an intuitive and user-friendly search function to enhance the overall user experience.
The Design System | To ensure consistency across all platforms, I developed a comprehensive design system. This system encompassed essential elements such as type scale, buttons, and Figma components, guaranteeing a cohesive and delightful user experience across the website.
The Design and Prototype | The visual design was created by drawing inspiration from the mood board. The colors, typography, and imagery were used to create a cohesive and approachable look and feel that would resonate with the target audience. Iterations continued with feedback from various UI/UX professionals. An interactive prototype of the new design was created to show the outcome.
The Search Design Flow
THE OUTCOMES
The cleaner layout, improved search function, and overall enhanced usability contributed to solidifying Williams-Sonoma's position as a leading e-commerce destination for lifestyle products website that is better equipped to attract new customers and increase sales. The updated site includes:
-
Collapsed and simplified navigation
-
Cleaner layout with clearer hierarchy and information, streamlining the visual design to reduce clutter and improve overall aesthetics
-
Reduced visual clutter and improved the overall design
-
Enhanced the search function to provide users with a more intuitive and effective product discovery experience
-
A less cluttered design provides a better visual representation of the brand
-
Improved search function
See the full Prototype here: Desktop