Background / Context

Role: Lead Designer
Tools: Figma, Jira, Miro
Duration: June 2023 - February 2024
Platform: Mobile & Web

The purpose of the Inbox is to keep associates informed about critical information and actionable tasks. However, it’s crucial not to overwhelm them with excessive nudges. My main focus has been on designing a robust Inbox system that avoids nudge fatigue while accommodating a variety of notification types.

Part 1
Inbox system

What types of nudges are sent to the Inbox?

As shown below, there’s a wide range of nudge types. Receiving all of them can quickly lead to nudge fatigue, which impacts user experience. To improve efficiency and usability, we need a system that filters and prioritizes relevant nudges, ensuring only the most critical ones surface in the Inbox.

“As a manager, I want to be able to quickly identify priority inbox items, so that I can take action within the given time frame.”

— Manager

Foundational design

Inbox structure

I designed optimized patterns for each platform: linear navigation for mobile to enhance simplicity, and a left/right pane structure for web to maximize screen real estate and usability.

Competitive Analysis

After conducting comprehensive research, I identified best practices for list components and Inbox system action types. We’re adopting these proven patterns as a starting point and will continuously monitor key metrics to iteratively refine the design for optimal performance.

// Inbox list component //

// Inbox system action //

Design Execution

Surfacing relevant inbox items
Inbox anatomy — Associates can receive up to 50 inbox items per day. To help users prioritize tasks, elements such as search, filters, states, labels, and chip status are incorporated to streamline inbox management and improve task visibility.

Inbox System Action

Users can utilize 'system actions' to highlight or remove any inbox items, facilitating a clean and organized inbox where important items are easily identifiable.

Inbox Preference

Users can customize their notification preferences through inbox settings. With only four notification types currently, a simplified configuration works well. However, to ensure future scalability and flexibility, we may explore a nested settings page to allow for more comprehensive and granular customization options.

Part 2
Inbox integrations

With many planned integrations—both internal (mini-apps) and external—our inbox platform must be designed with flexibility in mind. This will ensure that it can seamlessly accommodate various integrations as they are introduced.

Approval Flow

The inbox flow is designed to streamline actions, allowing users to quickly and efficiently take the necessary steps on their inbox items.

Inbox template

The inbox template ensures consistency across various inbox items. Mini-app designers can use this detail page template to integrate their mini-app approvals seamlessly within the Me@Campus inbox.