Deals Hub: A community-driven shopping deal finder

An experience designed to enable users to share and uncover the best deals together. Focusing on user engagement, the app makes shopping a collaborative experience, allowing users to contribute and find personalized offers, making the process more rewarding.
Client
Microsoft
My Role
UX Designer
Duration
3 Months
Team
1 Project Manager and 1 UX Designer

Overview

To craft an experience for deal hunters to discover the best online offers, enabling users to share deals for rewards and social validation. Moreover, an aggregator will offer additional insights to aid users in making informed decisions.
Target Users:
Active deal hunters, who are constantly on the lookout for amazing deals, want to explore the best ongoing deals across top deal categories. These deals are supported by strong insights based on price history, price comparison, and user signals to further build trust.

Asking better questions

  • Most community-driven sites allow users to create aliases. Since login details are fetched from MSA, does that mean users can't create an alias or remain anonymous when posting a deal or comment?
  • Do we want to include shipping charges with discounted prices? If yes how much coverage we have around shipping charges?
  • What will the flow for 'Feedback on finding a better price'? Do we want to encourage users to post a new deal? Or drop the link in comments.
  • What will happen when some tries to post a deal which MS Staff/Merchant has already posted?
  • Do we want 'Posted by' and 'posted on' on Product deals card?
  • What will be the process of product deals posted by Merchants and how it would look on the page?
  • How can we show a person’s credibility who has posted the deal?
  • Do we want claimed number to be shown on the deals?
  • Do we want tabs and different sections for coupons and cashbacks?

Key deliverables

Competitor analysis
Study what other competitors are doing
Find areas of opportunities
Wireframes
Home Page
Deals detail page
Key Flows/Screens
Home Page
Deal cards
Deals detail page

Research

Categorising deal types

When categorising different shopping deal types, the process involves organising deals into specific categories such as Online, Offline store and Sale. This structure allows users to easily navigate the app, quickly find deals that match their interests, and make informed purchasing decisions.
ONLINE
  • Usual Price Drop
  • Website level sale (Prime Day, EOSS etc)
  • Brand/Category level sale
  • Coupons
  • Cashback
  • Card Discount
  • Discount on Exchange
  • First time user Discount
  • App Only Discount
  • Member Only Discount
  • Flash Sales
OFFLINE STORE
  • Store/Brand Level sale
  • BOGO etc
  • Coupons
  • Card Discount
  • Discount on Exchange
SALE
  • Flat
  • Upto
  • Discount with condition
  • BOGO, 5% on spend of $100 etc

Competitor analysis

I conducted competitor analysis by reviewing key competitors’ products, focusing on user experience, features, and design. By identifying their strengths and weaknesses, I uncovered gaps and opportunities where we can improve our product.
Opportunity 1
Users should have control over the deals and coupons they see. Presenting a great deal that isn’t relevant to them may be ineffective.
Opportunity 2
Posting deals is a time-consuming process that doesn't accommodate users who need to post quickly or share time-sensitive offers.
Opportunity 3
Improving methods to prevent duplicate deal posts is essential. Some competitors require users to search for existing deals before posting, which can be automated.

Sorting of information

There was a significant amount of information to include on deal cards and the deals detail page. To make informed decisions, we organized all the data and used card sorting to categorise it into three distinct groups.
Primary
  • Product Image
  • Deal Title
  • MRP
  • Discounted Price
  • Website/Store Name
  • Votes on the deal
  • Deal valid till..
  • Shipping Charges
  • Total Savings
Secondary
  • Posted By
  • Posted On
  • Deal Instructions
  • Price History
  • Other buying options (OBOs)
  • Shipping Charges
  • User Comments
  • Deal Views/Coupon Claim Nos.
  • Product Brand Name
  • Product Category
Tertiary
  • Deal Description
  • Recommendations
  • Feedback on downvote
  • Feedback on finding a better price
  • Expert Insights
  • Deal Share

Information architecture

We created and improvised the information architecture (IA) to organise and structure the content. Main motives were to improve findability, usability, scalability, and consistency. And the goal was to come up with an effective IA which ensures content is meaningful, accessible, and user-friendly, leading to a better overall experience.

Wireframes

We also created wireframes to discuss the placement of elements like headers, footers, and interactive components. The motive was to get early feedback and do thoughtful iteration.

User testing

EMI pricing on deal/shopping cards

Understanding how to display EMI pricing on deals was crucial. We presented three options to users and conducted A/B testing to make an informed choice. This approach was also valuable for applying the insights to other areas, like product cards within the shopping vertical.
A: Down
  • The $0.00 down is telling me that to purchase the phone I will have to put down not money, but obviously have to set up a payment plan
  • Tells me very clearly that I will have to put '$0.00' down' on a initial payment for this phone
  • It is understandable as it clearly states down payment.
  • Down' Is better since pricing 'Now' creates urgency
  • The phrasing of down is more accurate compared to now.
  • '0 Down' is more standard usage than 0 now.
  • "0 Down' says zero initial cost more effectively
B: Now
  • The $0.00 now could lead some to think that you are giving the phone away for 0 dollars
  • Makes it look like there is going to be a catch to the 'S0.00 now' deal
  • $0.00 now is very confusing on the part of the buyer
  • '$0.00 now' seems like the item is for free at no cost.
  • The word Now" is confusing
C: EMI
  • What is EMI? Is it zero down or 0 for the phone & you only pay for the EMI?
  • $0.00+EMI clearly means that buyer can get the unit for free without down payment and he has to pay the monthly installment
  • This is better because it shows that the buyer has to pay a monthly installment after getting the unit at $0.00 down payment
  • The +EMI' lets you know that there will be equal monthly installments, with nothing due first.
  • 'EMI' is more informative if users are familiar with 'EMI"

Conclusion

  • '$0.00+Now' led to some confusion such as if the product is for free. It also created a state of urgency.
  • Although '$0.00+EM"' conveyed the message appropriately but only to the ones who had the understanding of EMI. 14/47 were not aware of the term EMI.
  • Both 'Now' and 'EMI' has their downsides. Hence 'Down' is the best option as it's clear and standard.

Experience Design Solution

Deal card explorations

During the exploration phase, I brainstormed and sketched various design concepts for product cards to maximize user engagement. The goal was to generate multiple variations, discuss their feasibility, and then conduct A/B testing on shortlisted options before finalizing the design.

Prioritising hierarchy and positioning of key information

This involved evaluating various ways to structure and highlight essential details to ensure they are prominently displayed and easily accessible to users.

Displaying a wide range of insights to support & influence user decisions.

Integrating key insights was aimed to incorporating valuable information and data into the design to guide users in making well-informed decisions.

Highlighting only key informations.

Maintaining a minimalist design by showing only essential information on the cards and progressively revealing additional details to reduce cognitive load for users.

Deals hub home page

The Deals Hub homepage includes a banner to spotlight different deal types and important offers. Users can filter deals by category through a dedicated section to narrow down their search. Deals listing area also features banners to prompt users to share more deals.

Deals detail page

This stage acted as a bridge, providing users with all necessary insights to help them decide whether to visit the product website and make a purchase. It included community-driven feedback on the offer's appeal and validity, a comment section for discussions, and additional details from the aggregator such as price history, expert opinions, and alternative buying options to support users comprehensively.

Learnings

  • Through user testing, I learned that cultural backgrounds can significantly influence how people define and understand concepts.
  • Providing extensive information doesn’t always succeed, business objectives and user experience need to be carefully balanced and monitored.
  • Effective organization and prioritization of information help drive decisions when there is an abundance of data to show.
  • In situations with strict deadlines and limited access to real users, it’s better to try a few approaches and learn from failures sooner.
Arrow left
Home
Thank you for your time
Next Project
Arrow right
Made with ♥️ in Webflow and Figma
Updated on April 2024