The Microsoft Partner Center portal allows customers to understand and manage their business with selling Microsoft products. For several years Partner Center had been without direct design support and was suffering from outdated UI, confusing site navigation and inconsistent UX. I was hired on to help realign the experience with customer's expectations.
When looking at the old Partner Center experience I identified several design issues that needed to be addressed:
- Site navigation and architecture were overly complicated and the nav
bar dominated the page.
- UI needed to be updated and teams needed standard page templates to implement consistent layouts across the site.
- User flows needed to be standardized and documented for teams to leverage in their scenarios.
To help simplify information architecture, the design team proposed a hub and spoke nav model and developed the concept of “Workspaces” that were defined by a collection of common tasks. The workspaces were connected through a Dashboard that acted as a jumping off point for partners.
To further simplify site navigation, I redesigned the nav components and structure to help users understand the context of where they were within the site and how to easily route to relevant tasks.
- The portal menu was tucked into a hamburger menu, helping users focus on their current tasks rather than a bulky nav bar.
- I redesigned the Task Menu to look more native to the page content.
- A breadcrumb was applied across the site to help contextualize each page.
- Pivots were used for in-page navigation to help relieve the Task Menu of too many sub-items.
The current page layouts in Partner Center were overly cramped with information, and inconsistent from page to page. To help workspace team build consistent page layouts across the experience, I knew we needed standard page templates that teams could easily leverage.
To help structure the templates I brought in a 12 column grid to organize all page content and maintain constant margins. I then added 4px baseline grid to ensure consistent vertical spacing.
I applied the template structure to several standard page types including a form, data table, and homepage dashboard. Each template was built with updated UI to help Workspace team easily drop in content for their own scenarios.
Once the new nav structure, page templates, and updated UI were defined, Workspace teams began incrementally implementing the changes into their scenarios, resulting in improved page performance and satisfaction for users.