Year / Platform:
2020 / iOS, Android
Role / Team:
Lead designer (UI, analysis, interactive, prototyping, testing & handoff) / Project manager, researcher, content strategist, product developer, engineering team, accessibility, and QE.
With plans of adding new messages and giving a visual and functional refresh, eBay's home page inline messaging module was selected as it covers the top of the page and serves as a first-hand guide for users each time they visit the site.
Define
Challenge
We set up to provide a better and updated home page messaging experience for eBay users as they wanted to be aware of the most important, relevant, or personalized messages to take action at the right time (live version below).
Goals
Personalize
In previous research users expressed that messages felt detached from the home page content and impersonal.
+ Capacity
Users manifested that it would be helpful to have a larger amount of urgent messages displayed.
Visual Refresh
Visually refresh individual message cards for the upcoming eBay system library and framework update.
Project Timeline
Types of Messages
Defined as a snackable overview of the most important action-oriented information. They are classified into primary and secondary by order of importance to the user.
Primary
- Paid - Ship now
- New offer / Counteroffer
- Outbid
- Seller initiated offer
Secondary
- Order update
- Sitewide coupons
- Campaigns and deals
- Next best actions
Target User
Based on previous research, 92% of signed-in eBay users took action on the three current primary messages (Paid-Ship Now, Outbid, New offer /Counteroffer). The mention of a seller-initiated offer and personalization was brought up by users as a key decision-maker for purchase intent.
eBay Buyer
A constant or casual buyer that does not have all push notifications enabled or likes to open the app to know what’s new.
eBay Seller
A non-enterprise seller that still wants to be on top of shipping and managing multiple items when opening the app.
Design
Mapping & Structure
In the wireframe mapping, we see how single and grouped messages work, guiding the user along the way to complete an action.
Taxonomy & Hierarchy
Color, shape, and messaging card hierarchy played an important role as it tells the user at a glance what is more and less urgent.
Iterations
Individual cells for the module went through different visual treatments to make the message compact, yet still, deliver the required information to help the user.
Deliver
Final Design
After a positive design review consensus, the z-index shadow visual treatment was chosen, as it gave each message a more tactile and individual feel. The accordion module interaction provided more flexibility accomodating more/fewer messages without taking valuable home page real state.
Conclusion
Overall, the new 2.0 redesign was released to the 66 million monthly app users with a positive outcome and higher clickthrough rate in the first month since launch.
For this release, the personalized module title and next best action messages did not make the final release in time but were scheduled for the next release with an updated eBay design system.