MOBILE APPS

Fashion and Lifestyle E-commerce Mobile Navigation UX

Nykaa Fashion is a lifestyle e-commerce platform, and sister firm of Nykaa.com. The core vision of the product is to provide a personalized lifestyle shopping experience and create a platform for brands to connect with users through their stories and sell the latest/ trendy fashion. The platform started selling Women's only fashion in 2018 and now it has online stores for Men, Kids, Home and Tech Accessories.

With the scaling business needs, and the increasing product categories, brands and curations, the existing mobile navigation wasn't enough to support the accessibility for discovering these. The existing UX for navigation wasn't scalable enough. This project aimed to build a scalable solution for businesses to experiment, while keeping a user-centric first approach for information accessibility.

My Role

I was the lead designer for Navigation revamp project and collaborated with other Product Designers, to create a cohesive user experience to access different information.
I have worked with 💼 business teams to understand their needs while aligning project goals with 🚀 Product Managers.
Conducted user research for defining persona, user mental model and identifying intents for mobile navigation.
Performed competitive analysis for understanding mobile interface trends and navigation systems.
Analysing data for understanding user behaviour, funnel metrics and feature usage.

Collaborated with 🖌Product design, 🎨Visual design and 📱Engg. Teams to brainstorm and check the feasibility of ideas for scalable navigation.
Continuously took feedback from internal stakeholders to align design goals and navigation philosophy of the platform.
Managed end to end execution from ideation, conceptualization, prototyping, development feasibility and collaborating with developers for understanding performance and components, usability testing and driving A/B experiments for the different product-UX hypotheses.

Objectives

Make information easily accessible to diverse users

Design scalable experience for stores, brands and categories

💼 Business Needs

A scalable navigation system to launch new categories and stores.

A strong visual experience for brand and category curations/collection experience

🚀 Product Objectives

Create accessible and scalable navigation to provide easy access to account activities, categories, brands and stores.

👩🏻 👨🏻Users Needs

Users are unable to access and identify where are different info/features hidden.

Simplify the discovery of stores for the user and create the mental model of Nykaa Fashion stores and how to discover them

Users

The navigation system spine of the entire platform assists users in finding the information easily and serves as an important medium to understand how information is organized on the platform.

New Users

Need to know what are different platform offerings
How are information and features are organised to access when there is a need with high intent
e.g. I want to check out different brands Nykaa Fashion has for Women

Repeat Users

Need to access information based on prior discovery and recall their actions to reach the final goal
Wishes to adopt the platform and its offerings, which helps in creating trust in repeat visits

Process of Design

Define

User Needs

Conducting primary and secondary research methods to identify:

User mental model for navigation
Existing gaps in UX
Understanding industry trends and benchmarking

Business Needs

Worked with different business stakeholders for defining key problems they are facing with existing Navigation UX.

Product Requiements

Collaborating with Product Managers to define UX strategy and project goals.
Utilising data analytics tools and continuously working with Analysts to understand product-UX metrics and user behaviour.
Scoping and defining design brief for the next stage of the design process

Ideate

Continuos Iterations

Continuously iterating and collecting feedback from fellow UX Designers, Business Stakeholders, Product team and Engg teams.
Creating low-fidelity mockups to better understand the IA and design system components
Utilising design system and creating high-fidelity mock-ups and prototypes for the next stage of usability testing.
Creating interactions for adding layer of delight in the UX

Test and Validate

Experiment

6A2ADCA0-DD49-473A-BBA6-EFC67B6EB678_edi

Usability Testing and Insights

Conducting moderated usability study with internal stakeholders and collating the design feedbacks
Performing required changes in the final prototype and showcasing dev-product-business teams the updated design versions

Planning the execution and performing UAT before GO-LIVE!

Collaborating with Product and Engg. teams to define thoughtful execution
Enabling modular design thinking in the development process to make the execution scalable.
Providing necessary guidance about the design system and tokens for simplifying the overall visual design.
Performing UATs for making sure the outcome matches functional aspects of design and planning improvement cycles.

Recap of old Navigation

Taxonomy and organization of information were not assisting users in understanding catalogue offerings quickly. (confusing hamburger)
Brands and categories were not intuitive enough for users to recall information in the "Shop" tab in the bottom nav.
Conceptualizing the concept of stores, i.e. Women, Men, Kids, Home and Tech, was not served by the existing navigation.
Also, business demands a simpler and scalable visual experience for customers who have a high brand or category intent.
Consistent availability of carts across the app required more global accessibility than shifting location from home pages in the bottom nav to the top action bar on the product listing and product details journeys.

The prototype on the right demonstrates the brand and category experience before the project was started⃗⃗ →

User Research

Creating research objectives and driving the research along with a team of user researchers to understand user mental models for navigation. Conduction preliminary observational study in the retail stores, to understand how users navigate across different sections of stores and discover the products/brands they intend to buy.

Also, conducting open-ended cart sorting with the target set of existing users, to better understand how they group and organize different information available on the platform.

Users feedback on the existing navigation highlighted usability issues and things they miss on the platform.

Explorations

Post finalization of UX journeys for accessing different information/ features, we develop lo-fi wireframes to assess the flow from the user mental model perspective.

Ideating multiple times and taking continuous feedbacks from the internal stakeholders helped in improving the overall solution.

Continuous feedback from business, design and product teams, assisted in building a holistic information system, scaling more features and improving discovery.

Bottom are some of the ideation sketches, the updated structure of the entire platform, keeping the existing information recall simple and easy to adapt ↧

Final direction

The objective of design pivoted multiple times during the ideation phase and concluded at:

Designing contextual navigation which is Scalable, Modular and Adaptive with the future needs of personalization

The idea of navigation was crafted with the collaboration of UX Designers to creat a better and easy discovery experience. Collaborating with business-product made us take well-informated data decisions to enable such new behaviour.

Right side ➞ is a prototype of concept that got finalized post multiple iterations

📈 Impact

Increased brand page visits and category PLP visits
Newer brands and collections are now discovered easily by users
Wishlist page views increased by ~40%
Increase in visits for Orders, Help & Chat, and Explore.
Home page banner CTR didn't impact

Increased cart views
Improved conversion and overall engagement of the App
Revenue and growth for the new categories and brands launched