ProjectManager Custom Views
ROLES
Research
User Testing
UX Design
UI Design
Prototyping
Project Management
PLATFORM
Web
Tablet
YEAR
2023
(Under Construction)
When embarking on the ProjectManager redesign, we recognized a critical area in need of improvement: dashboards. Our data analytics NPS ratings were underperforming, demanding immediate attention. After thorough research, we set out to develop a system that not only addressed our customers' existing needs but also had the flexibility to cater to the evolving needs of future customers.
The result was a dynamic dashboard builder featuring components tied to system data and reports. These views were designed to be highly flexible and fully customizable. Users gained the power to create, save, and share their own dashboards, whether for customer-exclusive use or exclusive to the C-suite—truly limitless possibilities. Our redesign empowered users to filter and drill down into multi-layered data structures, a capability they previously couldn't achieve without exporting our data to another platform. Additionally, this innovation opened doors to new revenue and subscription streams.
Credits: Ira Dennis, Steph Ray, Marco Caadiang, Leon Kim
Research
During our research we found a significant number of users exported their teams data from PM and would put in another platform to manipulate for presentations. When asked why, the common response was they wanted to change the size, order and/or filter different values. Ultimately users wanted a customizable dashboard or view for their data. A large percentage said they would prefer not to have to take this step every time and was a major friction point for them.
Design Development
The cornerstone of a successful customizable dashboard lay in crafting a dynamic, flexible, and tactile grid that users would relish manipulating to create their ideal dashboard or view. We invested considerable effort and expertise to ensure the final product not only looked fantastic but also provided an enjoyable and engaging user experience.
Overlaying Grid on existing framework
M sized blocks
S | M configuration
L | M | S configuration
XL | M configuration
Early wireframes exploring widgets
Hover Interactions
Moving Widgets
Dragging Widgets
Hover menus
Different arrangements
Working wires - Titles and Filters
working wires - active & dragging
Widget edit
Grid concepts
Dragging and dashboard reorganizing
Weaving the dots into the grid fill
Proof of Concept - Custom Canvas
Early data visuals - Line Chart
Early data visuals - Bar Chart
Early data visuals - Stacked Chart
Early data visuals - Donut Charts
Refined data visuals - Line Chart
Refined data visuals - Bar Chart
Refined data visuals - Bar Chart
Refined data visuals - Donut Charts
Final Design
The revised design showcases a top band for quick summary insights, paired with a detailed section below featuring graphical representations, data summaries, and filter choices. Each widget functions as a modular component, ensuring the system maintains simplicity while offering deep customization. Every visual element corresponds to a report within our system. Previously, these reports were concealed from users; now, we're handing them the reins to their data. They can harness any data point to craft a visual representation.
Project Dashboard
Hover Controls
Widget Dragging
Add Widget
Widget Selector
Widget Settings
New Widget ready for placement
Light Mode
Dashboard Home