[BR] Notification Center
Document Status | COMPLETE DESIGN APPROVED BY MOE |
---|---|
Last updated | |
Document Owner | |
Designer | |
Developer |
|
QA |
|
Notification Document | https://docs.google.com/spreadsheets/d/1IwybW_MYu0lgq257aw5BZzcU0CWV93ta5AYC2fcDzrU/edit?usp=sharing |
Sprint | Gamification 1.0 |
Design | https://zuum.invisionapp.com/console/share/DS1IV0JAJT/480652067 |
Problem
Since we don't have a notification center on our platform, we can't see and track all our alerts and notifications.
Solution
Create a notification center that stores all the alerts and notification.
Reference: Monday notification center
Notification Button: Inactive
Design: here


Notification button placement
We want to place the button next to the user name on the main header
Report Bug or Feature Idea
Move this button to the far left side
Notification Icon
Outline button is when it’s inactive
The filled button is when it’s clicked or active
Badge
Place this red badge when there are any unread notifications
Notification Button: Active
Design: here

Active notification button
The button becomes solid when it’s clicked
Option button
Gives you the option to “Mark all as read” and “Settings”
All Tab
Display all the alerts and notification coming from the system
For Me
Only display the alerts/notifications and load activities that are assigned to you.
For Everyone
Displays all the alerts/notifications that need to be seen by everyone in the system
EDI Tender MVP
Receive new EDI tender
EDIs being accepted or Rejected
*FYI, More notifications will be added down the road*
Zuumanity
Only display the alert/notification/activities that are related to Zuumanity
Your activities
Team member’s activities
Unread
Display all the alert/notification/activities that aren’t clicked
Please refer Monday notification center
Unread Item
Read Item
Unread Item

Unread Bar
Unread items will have this bar
Profile Picture
Username
Name of the operator
User’s rank
Rank Badge
Display badge
Verb
Will always start with the verb
Will color it blue
Body
Text will be varied based on what action this person has taken
Load #
The text will be varied based on what action this person has taken
Timestamp
The time this action was taken place
Parent Page
Where this action was taken place
Read Item

The blue bar on the left is gone
The background color is changed to light gray
See invisionapp for detail spec
EDI Tender Accepted

Zuum Notification

Zuum logo on the profile picture
Name: Load #
Please see below for the detailed instruction for the content
Settings


The setting is divided into three parts
Notification when my shipment…
Notification when someone…
Needed for accounting team when assigning appointment task
Zuumanity
Department dropdown
If you click the department dropdown, you will get a dropdown like a screenshot on the left side.
Here, you can deselect a department that you don’t want to receive a notification on or you can go very specific by clicking the department and deselect a certain user.
Types of Notification
We’ve decided to manage the notifications in google sheet: https://docs.google.com/spreadsheets/d/1IwybW_MYu0lgq257aw5BZzcU0CWV93ta5AYC2fcDzrU/edit?usp=sharing
Type | Action | Verb (Colored Blue) | Body | Supporting (bold) |
---|---|---|---|---|
My Shipment | When my shipment is assigned to a carrier | Is assigned | to a carrier: | Carrier Name |
When my shipment has been picked up | Has been picked up | at | Location Name | |
When my shipment has been delivered | Has been delivered | at | Location Name | |
When the driver reports an issue | Has been reported an issue | for | Issue Type | |
When it’s missing a POD | Is missing | a | POD | |
Someone else | When someone assigned a task to you | Assigned | you to an [task name] for | Load # |
When someone accepts the EDI tender | Accepted (via Platform used) | the EDI Tender for | Load # | |
Zuumanity | Has leveled up | Has level up! | to Specialist | |
When someone reaches a kill streak | Has reached | a | kill streak! | |
Brought a new customer | Brought | a | new customer! | |
Received a purple heart | Just received | a | Purple Heart |