SharePoint Managed-metadata UX

Story of re-designing for SharePoint metadata and taxonomy services

Role & Impact

  • Designed the new admin system for SharePoint metadata and taxonomy services
  • Worked with multiple teams to align with the global vision and design language of Microsoft Admin centre
  • Designed several new UX and interaction patterns that are now used across multiple Microsoft admin systems
  • Built and standardized components for Fluent Design system

Work at Microsoft

At Microsoft, I managed a team of designers that focussed on building file experiences in Microsoft Teams, consumer & enterprise versions of Microsoft Lists, and features for the Microsoft 365 suite.

My work involved defining the product UX and strategy by working in close partnership with Leadership, Product Management, and Research teams. As a Manager, I was accountable to deliver high-quality products and building a culture of design excellence & better craft.

During my earlier years, I worked on OneDrive for Windows and mobile devices, and modernized the SharePoint Metadata Admin Center (part of Microsoft Syntex), besides several features for Microsoft 365. A lot of this was foundational work for my team in India.

Beyond my product work, I led the Design Internship program for the Design Studio and several key University Recruitment initiatives, that had a direct impact on our culture and growth at Microsoft India.

Related: My work on building Microsoft Lists for web and for mobile devices.

SharePoint taxonomy services

A taxonomy is a formal classification system. A taxonomy groups the words, labels, and terms that describe something, and then arranges the groups into a hierarchy.

Example of a classification system for shopping data

Organizations manage their taxonomies and metadata centrally, using SharePoint. This helps them to organize, search, and handle information easily, and often for compliance, and data intelligence purposes.

My role as the Lead Designer on this product was to design interactions for navigating hierarchical content, and to lead the redesign effort for the existing admin system.

Designing a better 'tree'

This was one of the seemingly simple, but intricate features I ever worked on. I closely experienced that achieving simplicity in design is hard work.

The first task in this initiative was to redesign the taxonomy navigation experience for end-users of SharePoint. The current system used a tree in a classic mode, and I set out to invent a new design paradigm. For this, I came up with multiple options, and after various reviews, we took two of them to the users to test them.

The tree navigation designs that were tested with users

The research output was intriguing. The new design didn't make the cut; the classic model fared very well. The new design resulted in longer time to complete the intended tasks as it made decision-making complex. With more insights from the data, I decided not to deviate from the classic model and set out to solve the rest of the problems and requirements based on that design.

There were several requirements and features, and the challenge was to create a robust tree structure that would not be too distant from the original classic design in terms of experience. Due to practical challenges like page load times and scalability, this was a better choice to proceed with too.

The robust tree was now ready. I added further interactions to add items and to show descriptions contextually. We went ahead and standardized it, so that it can be reused across the product as a standard control.

Video: The improved tree design with modern interactions

Designing the tree for admin scenarios

The second part of the project was designing the admin & management system for taxonomy. This required modifying the tree created so far to include additional actions, like search and manipulation. I had to ensure that the design is scalable enough to absorb new features without deviating too much from the original form.

Scalability of UI was a major factor in several design decisions. For example, what would the behaviour of a tree with 10,000 items be? How would we gracefully degrade such an experience? How would users access an item that is 10 levels deep?

During this, I worked with several teams globally to design and standardize the tree structure and it's interaction patterns for Microsoft admin centres.

Managed-metadata admin system

The final leg of the project was designing the metadata and taxonomy admin system within the SharePoint admin centre. The existing system was built long back and there was a need to modernize it, and align it with the modern design language of Microsoft Admin centre.

The metadata admin centre inside SharePoint, before 2020

One of the major challenges when I started was to understand the complex system and the domain. I worked in close collaboration with the Engineering team, as a lot of scenarios were driven by technology. I interacted with several users to understand their jobs and challenges better; it also helped in prioritizing our feature roadmap.

I worked closely with PM and Engineering to chart the product development plan and to conceptualize newer offerings like the analytics dashboard. The dashboard utilized massive telemetry data to show usage patterns and intelligence. Further, I collaborated with the central Microsoft Admin centre team to align my work with the overall vision and design language.

I even made an early POC to visualize the taxonomy telemetry data using Microsoft PowerBI tools, long before the initiation of this project. For this, I won an internal Hackathon award. 🏆

Early concepts for the admin centre
Key screens from the new and improved metadata admin centre

Learnings