Redesigning the Mix Platform: Improving the User Experience
Redesigning the Mix Platform: Improving the User Experience
Redesigning the Mix Platform: Improving the User Experience
From scattered workflows to unified structure, creating a unified experience for real world execution.
From scattered workflows to unified structure, creating a unified experience for real world execution.
From scattered workflows to unified structure, creating a unified experience for real world execution.
Company
Microsoft
(Nuance Communications)
My Role
Principal Visual UX/UI Designer,
Team Lead
Principal Visual UX/UI Designer, Team Lead
Principal Visual UX/UI Designer,
Team Lead
Collaborators
Product Management,
Engineering
Timeframe
2-3 Months
Strategic Speed
Strategic Speed
Strategic Speed
Delivered a platform-wide navigation restructure in 2-3 months
Delivered a platform-wide navigation restructure in 2-3 months
Delivered a platform-wide navigation restructure in 2-3 months
Proven Durability
Proven Durability
Proven Durability
Remained unchanged for 5+ years and survived acquisition by Microsoft.
Remained unchanged for 5+ years and survived acquisition by Microsoft.
From scattered…
From scattered…
→
→
to unified.
to unified.
About
About
About
•
Nuance Mix is a platform for building conversational AI experiences used by Fortune 500 and Global 2000 companies.
Nuance Mix is a platform for building conversational AI experiences used by Fortune 500 and Global 2000 companies.
My Role
My Role
My Role
•
•
•
Proposed a navigational restructure to consolidate and improve the user experience.
Proposed a navigational restructure to consolidate and improve the user experience.
•
•
•
Partnered with Product Management and Engineering for agreement to fix the problem.
Partnered with Product Management and Engineering for agreement to fix the problem.
•
•
•
Delivered the adjusted and improved interface to users within a 2-3 month window.
Delivered the adjusted and improved interface to users within a 2-3 month window.
THE CHALLENGE
A fragmented path to production
A fragmented
path to production
•
•
•
The path for users was scattered across multiple areas.
The path for users was scattered across multiple areas.
The path for users was scattered across multiple areas.
•
•
•
A missed feature critical to project visibility was missing.
A missed feature critical to project visibility was missing.
A missed feature critical to project visibility was missing.
Restructuring for Clarity: The Manage Tab
Restructuring
for Clarity:
The Manage Tab
Restructuring for Clarity:
The Manage Tab
The Challenge
The Challenge
The Challenge
How do you harmonize fragmented, scattered workflows into a logical, unified structure without disrupting the existing user patterns and mental models?
The Solution
The Solution
The Solution
I created the Manage tab to consolidate the different points of confusion into one areas as they related to each other.
•
•
•
Fixed user confusion on previously hard to discover functionality and stopped the user from bouncing around in the interface, which resulted in a poor user experience.
Fixed user confusion on previously hard to discover functionality and stopped the user from bouncing around in the interface, which resulted in a poor user experience.
Fixed user confusion on previously hard to discover functionality and stopped the user from bouncing around in the interface, which resulted in a poor user experience.
•
•
•
Maintained the user experience by integrating already established user interface layout patterns.
Maintained the user experience by integrating already established user interface layout patterns.
Maintained the user experience by integrating already established user interface layout patterns.
•
•
•
Corrected terminology for better user comprehension.
Corrected terminology for better user comprehension.
Corrected terminology for better user comprehension.
From scattered workflows to unified structure
Before:
Scattered and confusing
From scattered workflows to unified structure
1.
1.
Centralized Hub:
Centralized Hub:
Created the Manage tab as the single-entry point for all administrative workflows.
Created the Manage tab as the single-entry point for all administrative workflows.
2.
2.
Relocated Applications:
Relocated Applications:
Builds:
Moved from top navigation into Manage to group with related post-model tasks.
Moved from top navigation into Manage to group with related post-model tasks.
3.
3.
Builds Unified:
Builds Unified:
Manage tab:
Merged creation and history into one view, removing the split between side panels and tabs.
Merged creation and history into one view, removing the split between side panels and tabs.
4.
4.
Integrated Organizations:
Integrated Organizations:
Builds:
Tucked standalone admin controls into the Manage hub for a logical hierarchy.
Tucked standalone admin controls into the Manage hub for a logical hierarchy.
Reusing Patterns to Maintain User Trust
Restructuring
for Clarity:
The Manage Tab
Restructuring for Clarity:
The Manage Tab
The Challenge
The Challenge
The Challenge
How do you change the interface on users without introducing more confusion?
The Solution
The Solution
The Solution
I reused the two-panel structure established in other areas of the UI to maintain platform-wide consistency.
•
•
•
Introduced a lefthand panel:
Introduced a lefthand panel:
Introduced a lefthand panel:
•
•
•
Reduced cognitive confusion because the user will recognize this from other areas of the product.
Reduced cognitive confusion because the user will recognize this from other areas of the product.
Reduced cognitive confusion because the user will recognize this from other areas of the product.
•
•
•
Fixed a previously clunky user interface and experience which is now has a consistent interaction pattern.
Fixed a previously clunky user interface and experience which is now has a consistent interaction pattern.
Fixed a previously clunky user interface and experience which is now has a consistent interaction pattern.
Image top left
Image top left
Projects tab: left panel
Projects tab: left panel
From Left panel selection → right panel
Images middle and bottom right
Images middle and bottom right
New Manage tab: left panel
New Manage tab: left panel
Not shown:
Manage Organizations
Manage Organizations
Winning Buy-in and Approval
Restructuring
for Clarity:
The Manage Tab
Restructuring for Clarity:
The Manage Tab
The Challenge
The Challenge
The Challenge
How can we make this change quickly while balancing business needs and requirements?
The Solution
The Solution
The Solution
The goal was to create the least amount of work possible for everyone involved and I focused on what was already there.
•
•
•
By focusing on relocating what already existed meant no new code to minimal code which resulted in agreement with Engineering.
By focusing on relocating what already existed meant no new code to minimal code which resulted in agreement with Engineering.
By focusing on relocating what already existed meant no new code to minimal code which resulted in agreement with Engineering.
•
•
•
By consolidating the interface and user experience to fix confusion and a bad experience for users prevented future problems for Product Management. This also helped to protect current and win new revenue.
By consolidating the interface and user experience to fix confusion and a bad experience for users prevented future problems for Product Management. This also helped to protect current and win new revenue.
By consolidating the interface and user experience to fix confusion and a bad experience for users prevented future problems for Product Management. This also helped to protect current and win new revenue.
Impact
Impact
Impact
2-3 Month Delivery
2-3 Month Delivery
2-3 Month Delivery
Delivered a platform-wide navigation restructure via a "lift and shift" strategy, bypassing the need for a costly full redesign.
Delivered a platform-wide navigation restructure via a "lift and shift" strategy, bypassing the need for a costly full redesign.
Delivered a platform-wide navigation restructure via a "lift and shift" strategy, bypassing the need for a costly full redesign.
5+ Years Unchanged
5+ Years Unchanged
5+ Years Unchanged
The architecture survived the Microsoft acquisition and platform evolution without structural revisions.
The architecture survived the Microsoft acquisition and platform evolution without structural revisions.
The architecture survived the Microsoft acquisition and platform evolution without structural revisions.
Enterprise Scale
Enterprise Scale
Enterprise Scale
Unified workflows for Fortune 500 teams managing global AI deployments.
Unified workflows for Fortune 500 teams managing global AI deployments.
Unified workflows for Fortune 500 teams managing global AI deployments.