Discord

Notification

Center

Duration:

2 weeks, 2020 Fall

Contribution:

UX research

UI visual design

Prototype

 

New Feature Design | UX Design

Discord Notification Center is a new feature adding to the existing Discord Mobile app. The notification center allows users to modify their notifications flexibly and easily.  

 

This is a project I did for my class. This class assignment requires me to design a new useful feature that adds to an existing mobile app. After research and design iteration, I designed a notification center and create a prototype. 

Click here to play the prototype.

Deliverable:

Tools:

Figma

Adobe Illustrator

Photoshop.jpg

Identifying

The Problem

To identify the problem, I needed to learn what Discord is first. 

Discord-Logo-Color (1).png

Discord is a popular message app that allows users to text and voice chat.

14 million daily active users and 250 million registered users in 2019.

14

million

Asset 8@2x.png

Most of the users are come from game community.

So is there something the users want to add or change in the app?

Since Discord is an existing app, I thought there should be some useful insights from user reviews. After digging through app store reviews, Discord Feedback, and other websites, I found there were some users having problems with Discord notification settings on the mobile app. 

Here are users pain points:

  1. Receiving limited notifications from channels.

  2. Have to go to serves one by one to change notification settings.

  3. Unable to change the notification settings for specific group chats.

  4. Unable to clear all messages at once.

  5. Not sure where unread messages are from.

Based on the users' feedback and my personal experience, I found there was no general notification center in the current app to allow Discord users to manage notifications flexibly and easily based on their needs. Therefore, having a notification center adding to the current Discord app can help users manage their notifications easier.

User Persona

To illustrate the problem better, let’s meet Alex. He is a gamer who is from the same user group as Discord users.

Artboard 3 copy 3@1.5x-100.jpg

The Goals 

and Features

To solve the user problem, I defined the goal of notification center:

The notification center helps the users to customize their notifications, so they can manage their notifications easier.

Here are the features:

  • Clear all unread messages at once

  • Read unread messages from all serves or particular serves or channel

  • Mute or unmute serves at one place

  • Add favorite channels

  • Set up whether want to receive all message notifications from particular serves

Final Design

Following Discord UI style, I created the notification center prototype. In the final design, I have replaced the @ icon(mention screen) with the Notification Center icon because Notification Center will include the messages that mention the users.

See Notifications and Filter Options

See all notifications messages and set up filter options to see particular messages

More Notification Settings

More flexible notification setup including mark to read all unread messages, unmute or mute, and receiving limited or all messages, and adding favorite channels 

Reflection

Through design Discord notification center, I have gained more knowledge on doing research, so I can identify the problems. Also, I learned how to connect the app's goal and users' problems in the presentation. Overall, I got positive feedback on the project especially for the user consideration and UI design part.