Messaging

messagingintro

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_square_drk

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).

msg_live

Goals

bell

Personalize

In previous research users expressed that messages felt detached from the home page content and impersonal.

Modernizepro

+ Capacity

Users manifested that it would be helpful to have a larger amount of urgent messages displayed.

time

Visual Refresh

Visually refresh individual message cards for the upcoming eBay system library and framework update.

Project Timeline

ntimeline

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.

important_icon

Primary

  • Paid - Ship now
  • New offer / Counteroffer
  • Outbid
  • Seller initiated offer
nonimportant_icon

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.

muser_1

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.

muser_2

eBay Seller

A non-enterprise seller that still wants to be on top of shipping and managing multiple items when opening the app.

design_triangle_drk

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.

mtaxo

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_circle_drk

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.

m_lightmodepro m_darkmode

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.

View