the zara shopping app

UX/UI Design

Brief:

Redesign an existing digital product’s user experience for the near future. In addition to addressing the way it could be improved, we were asked to use emerging technology to influence the way users could interact with it. Through strategy and research, we sought to understand how this product could look and function in 2025. 

Background:

This project began during the COVID-19 pandemic. Most of America was on a stay at home order, and we worked and collaborated on this project remotely. During this time, we noticed many people expressing that they are online shopping more, for various reasons. Online shopping is already common, but recently the activity seems to increase even more, as many find it a source of happiness and leisure during this stressful time. This prompted our desire to explore the realm of e-commerce. In addition, both my partner and I have a love for fashion and were excited to take on the challenge of rebooting the Zara app. 

When we discussed Zara as a business and fashion choice, we knew we wanted to maintain the brand’s minimalist and polished aesthetic in our design. The fast fashion industry’s negative environmental impact and lack of ethical labor practices were topics that we discussed frequently throughout this project. We know that consumers, including us, are becoming more aware of that impact and are seeking more sustainable shopping options. We appreciate that fast-fashion brands such as Zara are taking steps to address these issues through their products and shopping experience, and are challenging the stigma of fast-fashion. We knew we would need to bring visibility to their efforts of addressing environmental issues in order to gain more users and satisfy the demand for improved ethics. 

View prototype

Design_timeline.jpg

Pain points

 

Pain Point #1

We evaluated what the Zara app already provided for its users and found that improvements could be made to make their shopping app more interactive and set it apart from other shopping apps as far as technological capabilities.

Pain Point #2

Both my partner and I consider ourselves to be fairly advanced mobile phone users, yet we were unable to navigate through the app without a great deal of frustration. We found their traditional search function to be inaccurate. When we were able to locate an item we disliked how little information was given on the materials used to make the product, which we thought was important in the digital shopping environment.

Pain Point #3

We found that the “Join Life” page, their sustainability campaign, was definitely not featured with prominence. When we dove into this section we found a great deal of important and inspiring information, but it was pretty deeply embedded across multiple pages. 

research

 

Zara is one of the biggest international fashion companies. Its parent company is Inditex, one of the world’s largest distribution groups. The owner Amancio Ortega opened stores across Spain, starting in 1975, developing the idea of “instant fashion” or “fast fashion” in modern terms by offering designer. He was able to react to design trends faster, as well as reduce manufacturing and distribution times through information technology and utilizing groups of designers instead of individuals. They sell to 202 markets, but only 96 of those markets have stores, leaving many people with digital shopping as their only option.

Zara’s values include: beauty, clarity, functionality, sustainability. Their mission statement is to give customers what they want, and get it to them faster than anyone else as well as nurture a highly intimate relationship with their customers.

Zara’s Join Life collection highlights he brand’s strong focus on sustainability and an improved customer experience.
Read more about Zara's Brand

49% of people exclusively use their phones for shopping.

 69% of Americans have shopped online, and 25% of Americans shop online at least once per month. The majority (59%) of these shoppers bought clothing items.

88% of customers think detailed product pages are crucial for making a purchase decision.

95% of Gen Z have their own smartphone, in which they spend nearly 10 hours or more per day on, making them 2X more likely to shop on mobile devices than millennials.

Despite retailers making big mobile investments in 2016, basic functions like page load times (47%) site/app navigation (31%) still disappoint buyers.

By 2021, mobile is predicted to dominate online sales, driving 54% of all sales.

With the average abandonment rate of 68%, eCommerce businesses could be losing 3 billion per year or more.

In 2019, it’s estimated there are 1.92 billion digital buyers, and eCommerce sales account for 14.1% of retail purchases worldwide.

concept

HMW.jpg

The “how might we” exercise began with us writing a list assumptions about our shoppers based on our research and initial interviews. We then went on to ask: “How might we design our new app to serve these assumptions?” To get a clearer sense of what was possible and what could emerge as a priority, we grouped these questions into categories. From there we were able to decide that we want people to stay on up to date with current trends. We chose the brand values of sustainability and diversity as areas we could potentially highlight. We strategized ways to make a shopping experience more attractive to entice a new audience of users. We also posed the question of how we can make the navigation of the site easier for customers. These assumptions and initial ideas became an integral part throughout our design iterations and prototype testing.

competitive_analysis.jpg

survey

We conducted an online survey with 38 participants, ranging in age and gender identities. We asked
questions about their technology devices, shopping patterns, and personal values. Below you will
find results that were particularly useful in making assumptions about our users.

case_study_master.jpg
user_journey.jpg

GOALS

 

Business Goals

  • Create a more intimate connection with their customers

  • Create a shorter shelf life for inventory

  • Gain more users and customers

Brand Goals

  • Uphold and promote their sustainability effort

  • Give users a luxury/special shopping experience

  • Put more focus into their key values of simplicity and functionality

User Goals

  • Find desired clothing quickly

  • Keep up with trends and Zara’s latest collection

  • Encourage users to feel confident about their purchase

the design process

usermap.jpg
wireframes.jpg
First_Iteration.jpg

FINAL DESIGNS

ar_mockup.png

AR Technology

We implemented AR technology to allow users to virtually try on clothes using their device’s camera. They are able to visualize the product’s silhouette and colors on their body, and can see how it might pair with existing items in their closet. This will create more trust and confidence in the user’s shopping experience. We know social media stories are a great way to get feedback from friends, so we added a sharing option. Users can share by text, email, or post it on their story on social media to get opinions on items they are interested in. This feature will allow virtual shopping to further resemble the in-store shopping experience.

purchase_mockup.png
 

Purchase Flow

We improved the purchase flow of the app by prioritizing the simplification of categories. We reserved full bleed images for banners, and showcased products through a structured grid. We added a rating feature for items to increase transparency, resulting in users feeling more confident in their purchase. Our product page also has a list of how that product fits within Zara’s sustainability efforts. If users can navigate more efficiently, then they have more time and patience to shop, resulting in larger profit for the company. With how easy it will be to shop, customers may switch over to shopping digitally rather than in store. 

joinlife_mockup.png

Join Life

We have decided to make the Join Life page a focus within the app. We added a unique sustainability icon in the tab bar and the side nav. This new icon will spark interest in users and will lead them to information on why sustainability is such an integral part of Zara’s brand. We also have additional links and info on sustainability throughout the app. We improved the user flow of the Join Life section so that users find specific information on their current initiative and commitments to sustainability. Users will easily see what commitments they have by year and can expand on it to learn more specific details on their efforts.

OVERALL FINDINGS & FUTURE VISION

“It’s easy to make a beautiful looking app when the imagery you are using is so beautiful,
but you can still get frustrated when things don’t work out how you want them to.”

“They’re actually already planning for 2025, now we just have to make an app that shows it off”

“They’re always changing their app, like 3 times during this whole project! Their developers
could easily make these changes.”

E-commerce is becoming rapidly more popular, and we wanted to explore how it can be improved. We took this as an opportunity to test if a classic grid structure was preferable to show items. We found that our black and white layouts and clean typeface helped the clothing stand out. Therefore, user testers always had a very easy time knowing where a specific was located. It was also useful to utilize and understand iOS guidelines. We expanded on many iterations of our tab buttons, and the feedback we received helped us comprehend how image influences function. We were able to expand within a mobile platform because so much of our lives are connected to our phone. It is our communication device, how we carry out transactions, and our personal camera.

We were very satisfied in our decision to redesign Zara, a brand that is attractive and contemporary yet is currently figuring out how to perform with increasing consumer awareness of environmental impact of fast-fashion brands. An interesting challenge that came up during our design process was how to promote sustainability considering their current efforts. Throughout this entire process, we had many discussions about fast-fashion ethics. We realized that although its environmental impact has been harshly criticized (and rightfully so), Zara is actively taking steps to try to remedy these important issues. Within their Join Life section, they are very thorough and transparent in their efforts so we knew we needed navigation to that information to be very direct.

Our future vision for this app is that it can have more of a connection to social media. Many people use social media to follow trends, influencers, and their favorite brands. Since the mobile platform is heavily used to access fashion and style inspiration, it would be quite interesting to explore how the connection between this platform and the fashion industry can be strengthened. As for content organization, we would like to explore an engaging way to showcase products. We know that Zara utilizes a 360-degree image of their models on their social media site, and perhaps their is a way to use those images within the app, without it getting too busy and overwhelming. As far as our the Join Life program, we thought it would be cool to highlight more videos on the process of their manufacturing. We included one of their videos on their clothing collection program, and it was a great way to say a lot of information in a digestible way.

completed in collaboration with tempestt carreon

Research & Analysis: Tempestt Carreon & Kara Philipovich

UX Design: Tempestt Carreon & Kara Philipovich

UI Design & Prototyping: Kara Phillipovich

Case Study Design: Tempestt Carreon

Software: Adobe XD, Adobe Illustrator

Previous
Previous

Depop Multi-Platform Brand Animation

Next
Next

Daily Passion Project