Amazon.mx
Fashion Launch
Overview
Amazon’s launch of the Clothing & Shoes categories in Mexico
User Problem
How might we build a shopping experience for Mexicans to buy clothing, shoes, and accessories under a unified Amazon Fashion store?
Goal
Launch three new categories that drive new customers, more orders per customer, and more revenue
Solution
A mobile-optimized Amazon Fashion storefront, with easily accessible ingress points and a custom search and browse experience
Skills
Personas, scenarios, information architecture, usability testing, surveys, lean UX
My role
UX Designer, Content Strategist, Project Manager
Platforms
Desktop, mWeb
Duration
5 months (2017)
Collaborators
Amazon D1 Visual Design team
Tools
Sketch, Illustrator, Invision, Photoshop
How might we…
Build an Amazon Fashion experience that fits into the rest of the Amazon categories, while showcasing high-end, quality, trendy, premium clothing and shoes?
The key challenge was resourcing, since I was the only Designer and Researcher on the team, and I was also tasked with executing the designs live on the site using a CMS plus basic XML/basic JSON in five months.
User Problem
Back in 2017, Mexican consumers had grown to love Amazon for being a one-stop shop with tons of brands and free returns. Amazon Mexico hadn’t entered the clothing, shoes, or accessories categories yet, so Mexican customers were buying those items from the Amazon US website or from competitors.
Amazon Mexico’s leadership presented my team with the challenge of launching three new categories under a unified Amazon Fashion store.
Research methods
Internal Benchmarking
Because I was our only UX design resource, I needed to narrow the scope and focus of our key priorities when it came to which features I’d invest my time, which categories and subcategories should have the most prominence in the store, and which brands/products should be featured.
Most importantly, I looked at Amazon Mexico’s search data to see what users were looking for, but not finding because we didn’t sell those items yet. I also utilized purchase data and search data from Amazon U.S. and Amazon Spain’s Fashion store to benchmark top subcategories, products, and brands.
The U.S. and Spain are good proxies because most Amazon products which sell well in the U.S. also sell well in Mexico, and because attitudes toward fashion and online shopping are very similar in Mexico and Spain.
Competitor Review
I also examined the top three online Fashion retailers in Mexico – Dafiti, Liverpool, and Palacio de Hierro to identify best practices.
Industry research
My team paid for a license to access studies by WWD, a top fashion consultancy firm, to get information on the latest trends and user attitudes toward online fashion.
Research insights
Key findings
From the competitive review and customer date, my analysis revealed several key findings:
Gender-based wayfinding
Users who browse consistently use wayfinding to locate products, starting with gender, then category (ex: clothing, shoes), then subcategories (ex: shirts).
Basics vs. trends
Most users purchase a mixture of 1) always-needed basics like socks or classic jeans, and 2) short-lived trends like tropical patterns or off-the-shoulder tops.
Mobile-first shopping
Mobile shopping is more prevalent in Mexico than in the U.S. or Spain. Over 60% of Amazon Mexico sales came from mobile, vs. 50% in the U.S. Over 80% of Amazon Mexico’s active customers purchased on mobile in the past year.
Lower confidence in online shopping
Mexicans haven’t adopted online shopping as widely as Americans. There is strong skepticism that products will be as described and arrive as expected. Fit, style, and delivery are significant concerns.
Ideation
Brainstorming and feature prioritization
With the customer data, competitive analysis, scenarios, and personas in mind, I brainstormed ideas for the Fashion store, with a sticky note for each idea.
I sized the complexity of each idea by estimating the required design hours, and then worked with my team to prioritize the final list. As a team, we aligned on requirements for the MVP, nice-to-have features for launch, and the ideas that were out of scope (P0, P1, and P2, respectively).
Information architecture & browse structure
Wireframing
Next, I sketched wireframes for the store using existing mobile-optimized components. The wireframes included:
A local navigation specific to Fashion
A header for context and SEO
Tiles for key subcategories
Carousel components (update dynamically with best-sellers, most-gifted, recommendations, and trending products)
I chose dynamic carousels not only to showcase relevant selection, but also because they require little maintenance and manual work to update.
Mobile wireframe
Desktop wireframe
Mockups
I then created some medium-fidelity mockups of each of the key page types that I had identified in the IA (storefront, gender/age, category, subcategory). I used these mockups to get feedback from marketing and product on the content strategy, layout, and Fashion style guide.
Gender-based browsing
Desktop page for women’s fashion
Mobile page for women’s fashion
Category-based browsing
Desktop page for clothing
Mobile page for clothing
Prototyping
Once I had my team's feedback and buy-in on the mockups, I created a high-fidelity prototype using a CMS. At Amazon we have a tool called Weblab, which lets us build products in a testing environment and regulate which customers can see the control and which customers can see the treatment. The control was the existing Amazon shopping website without any Fashion products or features and the treatment was the future-state website with Fashion products and features.
One of the most notable features that I built was a mega-menu. Mega-menus had never been used before in any other categories in Mexico. The mega-menu matched our information architecture and incorporated feedback from our users about gender-based wayfinding.
Previous navigation
New mega-menu navigation
Global navigation
I also designed the layout and chose the subcategories for the global navigation:
Getting Feedback
Internal feedback
Because the launch of Amazon Fashion was highly confidential, I couldn’t seek feedback from anyone outside of Amazon, so I shared the prototype with the Fashion launch team. The main feedback that they gave me was to:
Dedicate space to prominent Mexican brands, because Mexico has a strong reputation and culture of high-quality, locally-made apparel and shoes.
Increase the emphasis on free shipping and free returns even more, because Mexicans distrust most retailers, so free shipping and free returns set Amazon apart.
Usability testing
Before launching, I planned an internal usability testing session with employees. Amazon uses a testing method called “Walk the Store,” in which testers browse the shopping experience while I moderate, observe, and log issues.
To conduct the Walk the Store, I created a testing guide with specific tasks to complete based on the personas and scenarios I had created during the research phase. I also asked testers to document pain points, favorite parts of the experience, and suggested improvements.
Finally, I had testers find and use specific features (ex: size charts, color pickers, recommendations, etc.), which uncovered several bugs and broken links.
Refining the Prototype
I took the feedback from team and built the pages based on the prototypes, but with a couple modifications. I added widgets to the pages where we expected to get the most traffic to include top brands, with an emphasis on local Mexican brands. I also built a special landing page just for Free Returns, which could be reached from product pages and the local navigation.
Free returns ("Devoluciones gratuitas") called out on all product pages and in the subnav
Local Mexican brands that I added to the list of featured brands
Gender-based wayfinding
Women’s fashion
L1 navigation
Women’s clothing
L2 navigation
Women’s dresses
L3 navigation
Category pages
These people are looking for products like shoes, who haven’t yet specified gender
Women’s shoes - desktop
Women’s shoes - mobile
Development & launch
I fixed the last few bugs found during the Walk the Store and made final tweaks before launching.
We dialed the store up slowly to a few customers at a time, in increments of 10% with our engineering team on-call monitoring to ensure that no fatals or detrimental spikes were detected. We launched with positive reception from the press and customers.
Desktop storefront
Mobile storefront
Impact
New customers, increased orders per customer, and increased conversion
Due to my NDA, I cannot disclose exact results, but the launch of the Fashion store drove +10-20% more annual new customers to Amazon Mexico and both total orders and orders per customer increased by +5-15% year-over-year, demonstrating that the Fashion launch had strong overall impact to Amazon Mexico’s success.
The Mega Menu I designed also improved conversion by 11% over a standard menu.
Reflection
Working on the research, design, and implementation of the Amazon Mexico Fashion store as the project lead and solo designer was incredibly fulfilling. It taught me the importance of lean UX techniques like prioritization frameworks. I’m glad I invested in the information architecture, because we based three navigations, our content, and even our product catalog around it. If we didn’t get the IA right, it would’ve affected discoverability of products, and other systems like automated recommendations would’ve been adversely affected.
If I’d had more time (and less strict confidentiality constraints), I would’ve liked to conduct user interviews and get more diverse perspectives besides the Amazon employees living in Mexico City. Most Amazon employees are frequent Amazon shoppers. So while we had plenty of feedback from active users, it was hard to get feedback from anyone who was unfamiliar with the site or new to shopping online for clothing, shoes or accessories.
Dressing the part at the press event to celebrate launch
More projects
