Digital Asset Notification

Notification System Redesign

Digital Asset management cover page
Arrow Icon

Overview

The Digital Asset Notification was a redesign project done during my time working at Tenovos. Tenovos is a Digital Asset Management software solution that provides an efficient approach to storing, organizing, managing, retrieving, and distribute digital assets/ files within an organization. Redesigning the notification system on the platform plays an integral part in providing updates regarding processing details and status changes for the end-user's digital assets.

Role: Product Designer
User Research, Visual & Interaction Design, Design System Management, Information architecture
Project Duration
Sept 2022 - Dec 2022
Stakeholders
Product Design Director, Product Manager, Front-end Developers
Client /Team
Tenovos - Clients

The Problem:

Users lack context regarding the status of their digital assets resulting in a lack of trust with the performance of the platform.

1. Define

Context & Insights

Who are the users that use a Digital Asset Management (DAM) application?

Majority of the Tenovos's Digital Asset Management users fall into the category of creative and marketing within the retail space. This specific core feature within the application impact every user: this spans to individuals in Marketing, Design, Product management. and individuals on teams that specialize in Digital Asset Management (DAM).

User blobs

Heuristic Evaluation: Case #1 (Download/ Download request)

The 2 most common actions performed within the application is a Download/ Download Request and an Upload of assets.

1. Content store

Select assets in the Digital asset management platform to be downloaded within the Content Store.

Homepage 1

2. Download request form

Certain assets within the applications require the need to be approved by another member of the team. The end-user is required to fill out at download request form that would be submitted.

Download Request page

3. Download request toast message

In the case of the user selecting assets with a combination of assets that do and do not need to be approved, there are 2 confirmation toast messages that appear at the top right corner of the screen.

Multi task messages

4. In-progress for soon to be ready to download assets

Processing jobs of any actions with multi-selected assets get displayed in a page called the "Job Centre." Users need to navigate to a separate page to view the status of their assets.

Jobs page

5. Processing completed

CTA buttons page

Case #2 (Upload assets)

Primary method of uploading assets into the application.

1. Select files to upload and fill out metadata

User selects the assets that they want to upload into the application. They will then proceed to selecting a metadata template and fill out the fields that will be applied to all the assets.

Upload Screen

2. Upload processing and toast message confirmation

Upload Processing

Current State: User flow

Flow Chart

Approach:

How do we make activities and updates of assets visually more transparent to our users?

Goals Of Redesign

Scalable Icon
Scalable Notification UI for all actions
Status Change Icon
Clear visibility to the changes in status/ update
Balance UI
Notification "Alerts" users but are not a distraction

2. Develop

Ideate and Iterate

Competitor Analysis: Notifications are not a new thing

The key elements that I looked out in the competitor analysis was to see how these applications update user's regarding key pieces of information, how they action on these updates and overall how these notifications are organized.

Inspiration markups
Inspo markup 2

Wireframing: "Lets get all the ideas out"

This was an opportunity to take all of my findings from what I knew about the users and from the insights gathered from the competitor analysis and really exploration all the assumptions that I had.

Wireframe 1
Wireframe 2

Placement: How do we ensure that notification messages don't become a distraction from our assets

Toast Message placement

Low-Fidelity: Defining the views

Toast messages exploration
  • Addressing multi actions
  • Users do not have a clear visual of how far along their digital assets processing job
Lo-fi mockup 1
Low-fi Mockup 2
Fly-Out menu
  • Notification relevancy (New to old)
  • Life cycle and expiration of a notification
Low-fi Mockup 3
Low-fi Mockup 4

New Flow: Multi asset processing

This was an opportunity to take all of my findings from what I knew about the users and from the insights gathered from the competitor analysis and really exploration all the assumptions that I had.

New user flow

High-fidelity iterations: Scalable for majority of Tenovos's users

Stakeholder & User Feedback
Toast message and drawer iterations
Full page iteration concept

3. Final Design

The New Notifications

Due to restrictions upon showcasing the final outcome, please email me with my email address below to request access to the full case study. Jacobhoang.design@gmail.com

3 Components

Toast Message
New Toast message
Notification Panel
New Notification drawer
Full Page
Full page Notification

Asset processing visual and call to action

Toast message pop-up

Number of toast messages cap out


Users can easily have their screen populate with notification updates, if they are do not get dismissed, resulting in key screen real estate being covered.

Toast message roll-up

Everything gets backed up


If users dismiss a toast message but realize that it was something important that they want to deal with later on, they can open up the notification panel to still view and action on it.

Open Drawer

Different groups of notifications to action


The Notification Panel is split up with notifications for processing actions performed on select assets and users that get notifications for reviewing and asset approval from their team members.

Notification Drawer CTA

Notification expiration


Notifications displayed on the panel expire and get removed after 30 day. If needed, users can access all their past notifications after the 30 days but can only be viewed.

Full page notification

Responsive mobile web consideration


With the interactions that had to be considered for mobile, the user experience for users to access notifications was designed slightly different to the web application version.

Mobile View

4. Reflection

Next Step

Potential metrics


This project is still in development but once it is in production, these would be the different metrics that I would measure:

Rate of dismissal toast message icon
Rate of toast message dismissal
Notification panel icon
How often users check the notification panel
User retention icon
Customer/ User retention