Nykaa beauty app redesign case study
By: Aaboli Kode
Tags: Beauty, Redesign, Makeup, User Interface, Case Study

When I first started searching for some app to redesign for my design portfolio, I started looking up all kinds of startups in India and their apps. After enough searching, I figured it was best to redesign something that I’ve already used and have experienced. That’s when I decided I would design Nykaa app. It is a D2C e-commerce platform that sells everything from makeup, skincare, health to wellness products.

Featuring Nykaa app redesign

Right off the bat, I made some observations. After some more exploring, I noted down the problems that needed fixing and some additional features that can be added to improve the user experience.

Problems :

The UI looked dated. It wasn’t very beginner(in makeup) or user friendly. Nykaa has several stores and e-stores which were not easy to find on the app. The coupons, discount style needed to be changed. The dropdown at the top left needs to be taken out because it is usually the place for a menu option and having a dropdown there confuses people. The deals placed should be more organized. The jewellery and clothing apps sold under Nykaa are nowhere to be seen on the app. Customer complaints are hard to lodge. Email has to be written specifically and the play store is full of negative reviews about the customer return/refund/complaint. The price isn’t highlighted well enough on the products. Product images are too tiny and way higher on the page than ideal. This makes it harder to both, view and swipe images.

Ideas :

Baskets for different needs like essentials, bodycare, or influencer baskets can be added. Guide for first time app/ makeup users, men, mature women etc. Every product should have usage and tips for beginner friendliness. Finding the correct shade in foundations etc.. should be given importance. Brushes and other product recommendations based on products added to cart. Nykaa subscription, recommended products, other options should be provided for out of stock products at checkout. Product complaints need to be made in the app and easier with a helpline number etc.

Future business moves :

The Nykaa IPO listing took place. Nykaa man , nykaa fashion have separate apps. Nykaa superstore for retailers to buy wholesale and at a decent price. More offline stores in multiple cities are going to be added. Expansion to middle-east and the UK. House of brands and lifestyles. Getting brands exclusively on Nykaa.

After conducting user interviews as part of my qualitative research, I figured :

Most people shop having something in mind rather than just browsing and finding what’s good. It’s hard enough for women with duskier skin tones to find their perfect shade of foundations ,etc. and it’s even tougher to find your perfect shade of base products online. Most of the time spent is on the home screen. Other tabs are mostly ignored. To access offers, it is difficult and confusing. No suggestions near checkout screen as that might confuse the user. When a product goes out of stock, the wait is long for it to restock.

Here’s how it turned out :

HOME

Home screen before and after

The icons are bigger and rounder. The search bar is made bigger too. There’s way too much stuff to scroll through before. It’s been simplified and broken down into sections of horizontal scroll. The menu bar is fixed. Finding your shade of base products is made easy. The navigation now includes offers which was absent is the app.

PRODUCT DISPLAY

Product display before and after

The component for each product has been altered. It’s easier to view the price and add to cart.

ALL CATEGORIES

All categories before and after

The distracting and unnecessary carousel at the top is removed and the focus is on categorizing and sub-categorizing the entire list of products.

MENU

Menu before and after

Instead of the confusing dropdown, a menu overlay was added with links to different apps and stores.

BASKET

Basket before and after

To increase the quantity, delete the product and to view the price is made easier. The FAB checkout is almost made the width of the screen. Products from wishlist, and other recommendations are added for a last minute add-on.

PRODUCT DETAILS

Product details before and after

The entire layout has been changed. There’s no crowding of content. It has a simpler and more highlighted add to wishlist and add to cart button as well as very distinct star rating.

HELP

Help before and after

The help section was earlier divided into two main regions. The FAQ section and the chat section. Both lack a humane way of contacting a person or customer care official. Chatting with the bot only offers very few details regarding orders, complaints and products. Meanwhile the categorized FAQs are only a bunch of questions answered without offering any actual help. the redesign includes two ways of making direct contact including a phone line that operates during certain limited hours of the day and a message to raise a ticket that could list in detail the situation/problem the user maybe facing.

EVOLUTION

Throughout the design process, certain screens underwent a significant amount of changes as we all know that design is an iterative process. I was struggling with getting the product details screen. Several iterations of it are mentioned below:

Iterations of the product details screen

What I knew was wise was putting the add to basket CTA to the rightmost part of the screen. The first iteration lacked balance and visual symmetry. In one iteration, the CTA wasn’t big enough and was closer to the add to wishlist action which would mean, the thumb could easily slide and click on the wrong option. Finally, I landed on the last iteration with clear distinction and space between the actions and clearly defined space for price.

Iterations of basket screen

The layout of the basket items was altered several times to get the final iteration. Here too, the delete button is big and bold enough. The colors have changed and turned into the primary colour, fuschsia pink. Everything is aligned well in order to make sense to the eye. Product name, variant name, quantity along with add and subtract features, price and delete buttons are parts of the component.