zara ux redesign
ZARA is a Spanish multi-national clothing brand with an edgy look and feel. This UX redesign of ZARA.com that focuses on keeping the lookbook feel of the website while removing pain points related to navigation, usability, legibility, and product exploration. Initial testing indicated site organization and navigation as the largest pain points and these became the focus of the redesign.
Client
ZARA
Designer
Lauren Bosse
Date
April 2023
Category
Web Development | UI/UX Design
user persona
Nikki is a 30-year-old senior product manager in tech, who values efficiency and sustainability in her lifestyle. With a demanding schedule and a focus on building her professional image, she seeks a minimalist, capsule wardrobe that transitions seamlessly from boardrooms to brunches. Emily prioritizes high-quality, versatile clothing from ethical brands but struggles with decision fatigue, time constraints, and finding sustainable options. The redesigned website should offer a streamlined shopping experience with intuitive filters, capsule wardrobe guidance, and clear sustainability information to meet her needs.
homepage
before
The original homepage successfully conveyed an edgy and energetic aesthetic that aligned with ZARA’s brand identity, creating an inviting first impression. However, the navigation options—located in the upper left, upper right, and bottom of the screen—were difficult to locate and read, posing challenges for users attempting to explore the site efficiently.
after
The redesigned homepage preserves ZARA’s edgy brand identity while prioritizing usability and accessibility. Large focal images remain center-stage, complemented by improved contrast for enhanced legibility. Simplified navigation streamlines the browsing experience, and the updates not only captivate visually but also make the site more inclusive and user-friendly.
product explore pages
before
The product exploration pages suffered from inefficient white space usage and inconsistent product image sizing, which disrupted the browsing flow and created a cluttered experience. Navigation and filter options were scattered across the screen, making them difficult to locate. Product images on listing pages were excessively large, leading to quicker fatigue for users. Filtering options were spread out in multiple locations, complicating the search process, and the filtering system was limited in functionality and did not meet accessibility standards, further hindering the user experience.
after
Large product images maintain the lookbook feel while displaying more items on-screen for a better shopping experience. Filters are now prominently visible and condensed into a single, easy-to-use location, allowing users to refine their search effortlessly. This streamlined filter system, combined with the removal of excess white space, preserves the minimalist design while improving clarity. Simplified navigation now includes a left-side menu that appears when a product category is selected, making it easier to explore different sections. All navigation text is placed on a white background for better legibility, and featured product ads with category descriptions and links provide clear pathways to key product sections.