Get Inspiration from our recommendation - Product Design
3 Months - 2019
Adobe XD, Figma
Make it easier for customers to encorage to purchase one or more complementary products. Customers can add additional products right to their cart along with the base product.
As a UX designer, My role in this project is by analyzing users' behavior, goals, motivations, and need. Research leads to understanding the problems and identifying solutions. It allows improving and figures out how to engage users to change their consumption habits. Collaborating with Product Manager, Designers and Developers to create intuitive, user-friendly software.
This recommendation has one main goal: Increase average order value. 'Frequently Bought Together' suggestions aim to up-sell and cross-sell customers by providing product suggestions based on the items in their shopping cart or below products they're currently looking at on-site.
The merchant controls which products include this feature, and Which Products are available. We decided to exclude the collection, Big Ticket such as furniture, and apperal.
I dentify with a high degree of confidence products that are frequently bought together
Exclude matches with low support level/purchase frequency
Only one set of related products will be shown
Only provide recommendations for a related product(s) when we have a high degree of confidence in the match
Goal is to instill confidence in customers that these items are truly frequently bought together and not that Macy's is 'pushing' an additional product
Customers should be provide with a streamlinked UX that allows them to quickly and easily add the related item
The frequently bought together recommendations should not detract from a customer purchasing the original product
The frequently bought related item should not be a replacement for the original product
Cross selling is considered to be aggressive sales behavior and in most cases customers find it irritating and annoying In the long run this technique can alienate the customers. Therefore, for sustained positive user experience, a user centric approach rather than a company centric approach must be followed when it comes to cross- selling and up selling.
As a customer, I want to know when two(or more) products are frequently bought togeteher so that I can easily buy both.
I like the recommendation, but I think they have different options such as color or size, how can I find them? what's the algorithm of recommendation?
Our target audience ir customers who are both uilitarian and lesiure shoppers. With its core target group of middle-class women between the ages of 16 and 34, Macy’s quality products at reasonable prices attract a clientele of largely busy people – either engaged at work or out enjoying the social scenes with friends.
Show only one product recommendation
Excluding Gift with purchase and purchase with purchase (The product is eligible for getting a discount with purchase)
Show products with only one UPC (Universal Product Code / Options)
Customers are not albe to select or change the options
Based on algorithm, Macy's suggests default option.
2020 Macy's Discoverly / Selection team meeting
Can we apply the Pick up and Pick up filter?
Have a rought line item to look at carrying facets and session signals across shopping funnel. - will discuss
Do we include the Big ticket on Frequently bought together - (e.g mattress, furniture)
Currently, Big ticket should be excluded because it needs a zip code lookup for availability check.
Will include services/Insurance (e.g AppleCare, WNM)
Will these be featured on Product Detail Page in 2020?
Which "frequently bought together" items design best matches customers mental models?
You are looking for [X item] and while reading the product's description, you found 'frequently bought together' section.
What would you do? when you see the recommendation which you don't know much information
If there is different color, but we are suggesting based on what people bought, what would you do?
What do customers expect to see recommendation product?
Do customers expect to change the option depending on the product?
If customers like the recommendation, how would you do?
If customers don't like the recommendation, how would you do?
Do customers want to see the recommendation product's detail? if yes, do they want to see whole information?
How many customers know there is the frequently bought together feature?
What do customers think about 'frequently bought together' copy?
Do customers consider to add in wishlist?
Concept - User Testing - UX Feedback & UI Change
We believe that customers want to know when there are accessories/related items that are frequently bought together with a product.
If we provide a streamlined way for customers to add both items to their cart
Then customers will be more inlcined to purchase both the original and related product
Resulting in increased AOV(average order value), product/order ATB(add to bag) conversation, ATB's visitor & purchase conversion.
Expanding multi UPC Level (Options)
If there are different Color or Size Options, how are we going to present?
Including "Gift With Purchase" and "Purchase With Purchase"
Do customers want to see the photo of gift?
Do customers want to view the detail about the promotion?
Rapid Testing - Learning
Gift with Purchase
5/5 customers prefer to see the image of the gift
Customers also want to see if there is different option for gift. Current website, free gift is automatically added in your bag, therefore customers can change the option in their bag
Customers click the photo or text to view more detail
Customers barely catch the function of three dots (view more information)
Customers acknowledge the function of carousel to check out the product's full description
Buy Together sounds cheaper : Macy's currently doesn't provide bundle sale. If both items are eligible for promotions, how could we show?
5/5 Customers check out the product detail as their next step
0/5 Customers try or attemp to change the different options
Customers want to view simple description(Need to bring back - quick view?)
If customers don't have information of the recommendation item, customers want to see the rate of how many people already bought together
Add to bag button with total price makes customers confused
Rapid Testing - Synthesis
This is not how I buy make-up products
This doesn't tell me anything about promocode detail!
Account - The housewife
Red text looks cheap! Buy two and get discount?
University student - The Student
I want to see the detail even it has long desription
University student - The Student
Feasible Design Update
Minimize vertical height (particularly for mobile - perhaps a collapsed vs expanded state?) while also allowing customer to see multi UPC lever info if they're interested?
Can we make alternate state CTA(Call to Action) option or change copy from buy both to buy anchor and view recommendation product?
Giving several options on product detail page may causes customers to lost their shopping journey.
GIFT AS THIRD RECOMMENDATION
Customers not only easy to catch the information, but also they can see the exact photo of product which they would get when they make a purchase
SIMPLE MULTI OPTIONS INDICATE
If current Macy's.com is not providing live update, having sub-title as color or size could possibly make customers to get confused. -Consider the live update feature based on customers' selection for the next iterations
Select vs Deselect
In order to make a difference between selected and deselected checkbox for customers, I would recommend to have different opacity or remove deselected item.
Based on rapid testing - Ideation
Recommendation panel on Product Detail Page
Frequently Bought Together panel on the single product page, I wanted to make sure to recommend the product which can give consideration to customers without losing their shopping journey. Also, I minimized the height for mobile web.
Desigining a mobile-first apporach, designing pages for smaller screen first (focusing on the really important features and simple solutions) usually comes easier.
What I designed
Single UPC -> Multi UPC
Macy's currently has 'frequently bought together'panel on product detail page. by expanding to the multi upc, we'll provide the upc level on cross-selling panel
Call to Action
To prevent any confusion for customers about price and amount of selected products, I designed the button with seperate price text
selected / unselected
By having different opacity between selected and deselected product, customers can easily define the product they want to get
Currently viewing item
By having this item tag, customers know the item they are currently viewing
What I've learned
I loved creating this product, especially for mobile, since I found it more challenging - mainly becase of the small screen size, I needed to figure out what is the most important feature in this product. Also working with engineer team, product manager and merchandise team, I realized again how important the communication is.
Unfortually, the product couldn't go to the product review, I really enjoyed the change to work on Macy's.com tech company with some truly amazing people! Having real experience by working and learning close with different team was great opportuinity for getting to know a lot about both the fashion industry and e-commerce UX. THANK YOU!