Shoppingo

Shoppingo helps customers find the best prices, deals, and delivery times across multiple e-commerce websites.

Project Details

Duration: December 2016 to Present
Platform: iOS and Android
What I Did: Conducting competitive research, Requirement Gathering, Requirement Analysis, Low fidelity mockups, High fidelity screens, Cross-platform mobile app development

Ever wondered how much time does one spend after discovering a product online that they want to purchase and actually buying it? They look at reviews, prices and deals across various websites, delivery times and more. Shoppingo helps customers reduce this time by providing an all-in-one experience to get the best deals, prices, offers on their purchases.

Following the recent outburst of e-commerce in India over the last decade, I discovered the need for a service which provided the best deals for products across a variety of shopping portals to advance the user’s experience of product discovery.

The Problem

Lack of an online shopping assistant which provides users a clean & to-the-point experience for finding the best deals, cashbacks, credit card offers, fastest delivery times across e-commerce websites.

Current Situation

Presently, the average shopper opens the same product on at least two different e-commerce apps to check for prices, deals, delivery times and more. And that’s just the best case scenario. In reality, users often wait for sale festivals, exchange offers, heavy discounts before making large purchases.

Identifying problems in the process

  1. Spending time checking same product on different websites

  2. Manually checking product page on apps to find better prices with time

  3. Staying updated/notified of various sales, festival discounts

Gathering Requirements

After analysing the current situation and discovering the underlying problem and scope for improvement, the next step was to understand the important components of the solution.

After organising a user survey with a small sample size from the target demographic, it boiled down to these few points:

  1. Product Discovery & Search are must-have features

  2. History / Recently Viewed products help give context

  3. Price Tracking + Notifications

User Flow

The Online Shopping Lifecycle

Sketches

Home Screen

Following the principle of the first point of contact being the most essential, the home screen needed to have a gist of everything that the app did. These components were:

  • Search Bar

  • Navigation for three sections: Deals of the Day, Recently Viewed Items, and Settings

Sketches for the home screen

While exploring the sketches, I had a couple of different ideas for the layout, some being: - Bottom vs Tabbed Navigation: The most challenging decision was figuring out where the main navigation of the app would be towards the bottom or top. After researching a bit, I realized both could fulfill the purpose. But after diving further in and referring the Material guidelines, I went with Tabbed Navigation because it’s better suited for sibling views.

  • Search Bar Positioning: Since the Search Bar + Tabbed Navigation UI element is a standard across Android, thus owing to familiarity - I decided to place the search elements just above the tabbed view.

  • Grid vs List vs Card View: I went with a Grid View Layout because it allowed for displaying the maximum number of products at an instant, this was important - especially in shopping apps.

When the user knows what he’s searching for, the search bar needs to allow them to see their “product query” clearly along with their recent searches in case they’re checking up on a product they’ve previously searched for. Since this was an essential component of the app, I went with a full screen search experience as compared to a quick dialogue box as seen in the left-most sketch.

Another important aspect of the search tab was the intelligent auto-completion. Product names are often hard to remember, and thus to enhance the user experience, it becomes essential to assist them with similar product names.

Sketches for the search screen

High Fidelity

After exploring more mockups, getting feedback and iterating on the sketches - I moved on to creating some high fidelity mockups.

Takeaways

  • Design using platform guidelines (in this case: Material Design), they make development a lot easier & users feel more familiar with the interface

  • Use customer feedback to upgrade features constantly

  • Work with developers, understand their concerns & try your best to accommodate their needs

Development

This case study represents the third version of this product. Shoppingo started off as a Chrome Extension back in December 2016. Seeing the success of the extension, time was invested in the making of an Android app. After about a year of operations, I picked up the mantle on the development of the apps using React Native and re-designed the mobile experience for Shoppingo from the ground up.

It was a challenging experience as this was my first project with React Native, but thanks to Expo I was able to release the app after a month of continuous development.

Launch

Android AppiOS App StoreWebsite