top of page

Flipkart Online Shopping App — redesigning the customer shopping experience on iOS and Android 

cover.png
Project Brief

Revising the consumer app in form, function, and content based on Flipkart's new design language

Company

Flipkart

 

Year 

Early 2016

 

Role

UX/UI Designer—Design owner of iOS consumer app (2M MAU)

 

Skills

Interaction Design, Visual Design, Project Management, Usability Testing

Flipkart is India's leading e-commerce marketplace with products across 80+ categories and over 100 million registered users. In 2018, Flipkart was acquired by Walmart at a valuation of $22 billion.

Version 1.0

Brand Refresh

In 2015, Flipkart launched a new brand identity. The refreshed identity, including the new logo, was a reflection of Flipkart's promise to its stakeholders — youthful, innovative, fast, and reliable. As design owner of Flipkart Online Shopping App for iOS, I was responsible for the end-to-end customer experience for 2M monthly active users. I executed the UI mockups for the pre-order experience and independently managed the iOS consumer app redesign from conceptualization to launch. 

iOS consumer app—final mockups

Impact

I tracked development progress on a daily basis and prioritized design features by taking a phased approach. My work on the app led to a higher app store rating of 4.5 from 3.5 stars.

Version 2.0

Flow Improvements

Our goal during phase I was to bring design parity across all platforms. Once the form had been revised, it was time to focus on the app's function and content. Since the majority of our customers were on Android, I took an Android-first approach to explore the next set of improvements. I reorganized the content and made structural improvements to the product page and high-level navigation.

Product Page

While working on product page v2, I prioritized information based on business goals and what's critical for the user to make a purchase decision.

ProductPage.gif
ProductPage-AllCases.png

High-fidelity prototypes: Exploring thumbnails vs. carousel and financing options

  1. I highlighted financing options because India is a highly price sensitive market and showing affordability would increase chances of conversion
     

  2. Securing customers through PREXO and No Cost EMI would give Flipkart the first mover advantage because these options were exclusive to our company at the time
     

  3. I introduced the Flipkart Assured badge to promote the company's promise of quality products and fast delivery, keeping in line with Flipkart's strategy of consolidating supply of products among a few trusted sellers in key categories
     

  4. I added a slide-in drawer to make variant selection easier and to create a perception of speed

Product Categories

Previously product categories were hidden under the fly out (hamburger) menu and were also accessible through a link on the homepage. I moved the most popular categories out for better discovery.

category.png

Navigation Bar

I proposed a navigation bar to make it easier to explore and switch between top-level destinations through a single tap. While the bar performed well in the usability tests I conducted, we ultimately decided not to go ahead with this change. Reason being that the engineering bandwidth required to build this feature was high and we knew this navigation pattern would be new/unfamiliar for most Android users because Android N hadn't even launched at the time.

download.png

Nested Alerts

Another change I proposed was removing the fly out (hamburger) menu altogether and moving its contents into the Account page. By moving Notifications into Accounts as well, we would have been able to completely clear up the header space and use that for theming purposes. This change would also be accompanied by Instagram inspired tooltips to alert the user on new messages and notifications.

download (1).png

Product Exchange

In the offline world, 40% people opt for exchange programs when purchasing a new phone while the conversion rate on Flipkart is only 13%.

 

The top three reasons for low adoption are:

  1. Discoverability

  2. Usability issues in the purchase flow

  3. Liquidation value

Exchange.png

Building a quality assessor that calculates the liquidation value based on the condition of your phone in real time is probably the best way to compete with the offline market. However, designing a radically different PREXO flow required time and engineering bandwidth. So I decided to take a phased approach and tackle problems 1 and 2 first. I made usability fixes in the funnel in order to reduce friction and solved for discovery by giving PREXO more visibility across the user journey.

learn.png
bottom of page