Top ↑

← Home

Brand New Notification Center

← Home

Brand New Notification Center

Improved user engagement led to a 11% increase in order completion

Timeline

Dec 2022 - July 2023

Responsibility

End-to-end design process, User research

Company

Carousell

Overview

The Activity tab is visited by 80% of users daily. It's the screen people return to most. But high visit frequency wasn't translating into action: users were missing important notifications, and order completion was stalling.

The problem wasn't awareness. It was that the tab wasn't designed to guide users toward their next step. This project was about closing that gap: turning a passive feed into a surface that actively moves users forward.

Results

↗ 20% increase in CTR for order-related updates

↗ 11% increase in order completion rate

↗ 20% increase in CTR for order-related updates

↗ 11% increase in order completion rate

📈 Let's begin with data to have a understanding of the current situation.

Audit

At the beginning of this project, I sample the CTRs of each section in the current activity tab over a period of 6 months.

We've found that some content, like marketing banner, Carousell news, and marketing messages has a low CTR but takes up a lot of space. This reduces the visibility of account/listing activities, which have a higher CTR and more relate to users.

Additionally, when reviewing the information architecture of this page, it seems the content lacks a clear hierarchy, making it easy for users to miss important notifications.

Additionally, when reviewing the information architecture of this page, it seems the content lacks a clear hierarchy, making users more likely to miss important notifications.

Additionally, when reviewing the information architecture of this page, it seems the content lacks a clear hierarchy, making it easy for users to miss important notifications.

Issues with current activity page

😖

Marketing-related sections have low CTRs but occupying significant space

🤔

The layout lacks a clear hierarchy

🫨

Important notifications are difficult to find

I also want to explore how notification pages work on other products.

Patterns we've identified:

Categorization

Visual layouts for hierarchy

Read/unread indicators

Then I begin exploring design concepts

Based on competitive analysis, I created several design concepts. At this stage, I concentrated on information architecture and high-level layouts.

Key considerations include:

01 Categorizing notifications

02 Highlighting important notifications

03 Indicating unread notifications

🤯
As the number of concepts grew and discussions went back and forth without clear direction.

We decide to conduct user interviews. To make well-informed design decisions and gain an understanding of the user.

User interview

I used internal tool to sample various user segments, including sellers, buyers, who are both sellers and buyers, and pro sellers to interview with.

During the interview phase, we divided the process into two parts.

➊ Card Sorting

We give users different examples of notifications on separate cards and ask them to organize them while verbalizing their thoughts.

➋ Concept Testing

For the second part, we present 3 different concepts to the users and ask them to interact with them while verbalizing their thoughts.

Concept A

Concept B

Concept C

The goal is to determine which concept is worth exploring further and also understand the reasons behind users' preferences.

Based on the research findings, we’ve come up with some principles around the user’s mental model

Things like how users group notifications, their views on each one, and which notifications they tend to ignore. And apply the insights to the design.

More details

By integrating marketing banners and messages into the notification format, we can establish a clearer structure that’s easy to scan while still utilizing valuable screen space for marketing.

Based on user feedback, notifications are grouped by two criteria:
- by topic (e.g., buying, selling, promotions, etc.)
- by urgency

To address urgency, we introduce a new layout that includes a countdown timer and CTA.

This enables users to easily track important notifications and promptly take action.

To address users' concerns about losing track of order notifications, we created an expandable layout.

This design includes a chevron on the right side that lets users expand or collapse the timeline. We also grouped notifications from the same order together to save space.

We further group similar types of notifications, such as likes on items. This enhancement aims to present users with a more organized and tidy activity tab.

Responsive Web Design

We’ve added an activity tab to our web platform, which wasn’t available before. This is designed to provide a consistent user experience across all platforms.

Results

20%

Increase in CTR for order-related updates

11%

Increase in order completion rate

Get everyone onboard

Given the project's scope and its effect on various functional teams, we present it at the tech townhall. This meeting will include all tech team members including c-level executive, where we’ll introduce the new design and answer any questions.

Additionally, we plan to hold a workshop with the marketing team as they also use the activity tab to send out ad and campaign notifications.

Reflection

I went into this project thinking the answer was in the UI. It wasn't. The early rounds of competitive analysis gave us directions to explore, but none of them stuck because we hadn't yet understood what users actually needed from this surface. Running user interviews mid-project was the turning point: it gave us a shared language for the problem and made the design decisions much easier to defend.

One thing I'd do differently is segment users earlier. What works for a casual buyer doesn't work for a pro seller, and some of our early concepts only became obviously wrong once we tested them with the right people. Research isn't just validation: it's how you figure out which problem you're actually solving.

Looking back, the most interesting challenge wasn't the UI. It was figuring out how a single surface could serve multiple competing jobs: tracking orders, receiving marketing, following up on activity. Getting that hierarchy right is what drove the outcome. A notification center is really an engagement loop in disguise, and designing it well means understanding what brings users back and what earns their attention.

Sign-Up Flow OverhauI

Shifting from confusion to clarity drove a 13% increase in new user acquisition

Read Case Study →

Copied!

Copied!

Brand New Notification Center

Brand New Notification Center

Brand New Notification Center

Overview

Results

📈 Let's begin with data to have a understanding of the current situation.

📈 Let's begin with data to have a understanding of the current situation.

Audit

Audit

Additionally, when reviewing the information architecture of this page, it seems the content lacks a clear hierarchy, making it easy for users to miss important notifications.

Additionally, when reviewing the information architecture of this page, it seems the content lacks a clear hierarchy, making users more likely to miss important notifications.

Additionally, when reviewing the information architecture of this page, it seems the content lacks a clear hierarchy, making it easy for users to miss important notifications.

Issues with current activity page

Issues with current activity page

Issues with current activity page

I also want to explore how notification pages work on other products.

I also want to explore how notification pages work on other products.

I also want to explore how notification pages work on other products.

Patterns we've identified:

Patterns we've identified:

Categorization

Visual layouts for hierarchy

Read/unread indicators

Then I begin exploring design concepts

Then I begin exploring design concepts

Based on competitive analysis, I created several design concepts. At this stage, I concentrated on information architecture and high-level layouts. Key considerations include:

Based on competitive analysis, I created several design concepts. At this stage, I concentrated on information architecture and high-level layouts. Key considerations include:

01

Categorizing notifications

Categorizing notifications

02

Highlighting important notifications

Highlighting important notifications

03

Indicating unread notifications

Indicating unread notifications

🤯As the number of concepts grew and discussions went back and forth without clear direction.We decide to conduct user interviews. To make well-informed design decisions and gain an understanding of the user.

🤯As the number of concepts grew and discussions went back and forth without clear direction.We decide to conduct user interviews. To make well-informed design decisions and gain an understanding of the user.

User interview

User interview

I used internal tool to sample various user segments, including sellers, buyers, who are both sellers and buyers, and pro sellers to interview with.

I used internal tool to sample various user segments, including sellers, buyers, who are both sellers and buyers, and pro sellers to interview with.

During the interview phase, we divided the process into two parts.

During the interview phase, we divided the process into two parts.

➊ Card Sorting

➊ Card Sorting

We give users different examples of notifications on separate cards and ask them to organize them while verbalizing their thoughts.

We give users different examples of notifications on separate cards and ask them to organize them while verbalizing their thoughts.

➋ Concept Testing

➋ Concept Testing

For the second part, we present 3 different concepts to the users and ask them to interact with them while verbalizing their thoughts.

For the second part, we present 3 different concepts to the users and ask them to interact with them while verbalizing their thoughts.

Concept A

Concept A

Concept B

Concept B

Concept C

Concept C

The goal is to determine which concept is worth exploring further and also understand the reasons behind users' preferences.

The goal is to determine which concept is worth exploring further and also understand the reasons behind users' preferences.

Based on the research findings, we’ve come up with some principles around the user’s mental model

Based on the research findings, we’ve come up with some principles around the user’s mental model

Things like how users group notifications, their views on each one, and which notifications they tend to ignore. And apply the insights to the design.

Things like how users group notifications, their views on each one, and which notifications they tend to ignore. And apply the insights to the design.

More details

More details

By integrating marketing banners and messages into the notification format, we can establish a clearer structure that’s easy to scan while still utilizing valuable screen space for marketing.

By integrating marketing banners and messages into the notification format, we can establish a clearer structure that’s easy to scan while still utilizing valuable screen space for marketing.

To address users' concerns about losing track of order notifications, we created an expandable layout. This design includes a chevron on the right side that lets users expand or collapse the timeline. We also grouped notifications from the same order together to save space.

To address users' concerns about losing track of order notifications, we created an expandable layout. This design includes a chevron on the right side that lets users expand or collapse the timeline. We also grouped notifications from the same order together to save space.

We further group similar types of notifications, such as likes on items. This enhancement aims to present users with a more organized and tidy activity tab.

We further group similar types of notifications, such as likes on items. This enhancement aims to present users with a more organized and tidy activity tab.

Responsive Web Design

Responsive Web Design

We’ve added an activity tab to our web platform, which wasn’t available before. This is designed to provide a consistent user experience across all platforms.

Results

Results

Get everyone onboard

Get everyone onboard

Given the project's scope and its effect on various functional teams, we present it at the tech townhall. This meeting will include all tech team members including c-level executive, where we’ll introduce the new design and answer any questions.

Based on competitive analysis, I created several design concepts. At this stage, I concentrated on information architecture and high-level layouts.

Key considerations include:

Based on competitive analysis, I created several design concepts. At this stage, I concentrated on information architecture and high-level layouts.

Key considerations include:

🤯
As the number of concepts grew and discussions went back and forth without clear direction.

We decide to conduct user interviews. To make well-informed design decisions and gain an understanding of the user.

🤯
As the number of concepts grew and discussions went back and forth without clear direction.

We decide to conduct user interviews. To make well-informed design decisions and gain an understanding of the user.

To address users' concerns about losing track of order notifications, we created an expandable layout.

This design includes a chevron on the right side that lets users expand or collapse the timeline. We also grouped notifications from the same order together to save space.

To address users' concerns about losing track of order notifications, we created an expandable layout.

This design includes a chevron on the right side that lets users expand or collapse the timeline. We also grouped notifications from the same order together to save space.