Project stats
Role: Lead Designer
Team: Me, 1 PM, 2 FEE, 1 BEE
Duration: 12 months
The problem
Internal directories are typically treated more like a giant bucket of names that everyone has to sift through. Our customers wanted a way to actually "direct" their agents to the right person or queue by importing, assigning, and editing entries team-by-team.
How it was solved
A dedicated workspace for directory management
A navigable interface that can offer both a bird’s-eye view of the entire org or a hyper-refined view for a single team
A robust import process that can handle thousands of entries at once and ensure they’ve been imported without error
Unique directories assigned to any amount of teams
1:1 user experiences between dashboard and app
I didn’t feel it was necessary to come up with something clever to manage thousands of entries; we all have computers of our own, each with their own immense volumes of files that we’re comfortable navigating.
I went with an experience akin to the MacOS Finder’s column view as it provides a better picture of an entry’s position relative to its parent folders, while still keeping plenty of vertical space to show entry details without needing to resize.
Another consideration for the admin’s experience was that the app the agents use is rather narrow at 336px wide (or smaller!) and can only afford to render one folder at a time.
By extrapolating the agent’s app experience to the dashboard, an admin can be more mindful of how they are configuring their team directories and ensure a team is only getting precisely what they need to see.
Yet another way these two experiences were brought together was by implementing a “Team Filter,” allowing admins to mimic a specific team’s permissions and experience what an agent would actually see in the app.
A simple 3-step import process was implemented to ensure that entries are imported cleanly and error-free:
Upload - This feature has strict formatting rules, which are described upfront and include a downloadable template
Assign - Once the format was deemed correct, you are asked to assign your data column headers to our categories: Label, Type, and Number
Validate - Each row is scanned for errors and, if any were detected, display a report of entries that need to be reviewed, as well as the option to download the entire report as a .csv
Upload
Assign
Validate
Add / Edit entry
Add / Edit directory
Add / Edit folder
Promote folder into a directory
Demote directories into folders
Drag and drop anything
Duplicate detection and management
Search results
Icon specs
Team permissions specs