SharePoint Design System Branding
Role: Branding, Illustration, Design System, UX +UI
Company: Microsoft
Microsoft SharePoint is a collaborative platform that empowers teams to securely share, manage, and organize information, documents, and projects. It features a robust design system with customizable components, enabling users to effortlessly create and tailor their own web pages.
The SharePoint team aimed to establish a unique identity for their design system, setting it apart from Fluent, Microsoft’s overarching design system. Their goal was to create modern, engaging branding that would inspire users and encourage greater adoption of their components.
Iterative Process
I collaborated closely with the SharePoint team throughout the design process, starting with rapid ideation and sketching multiple iterations of banners to represent the SharePoint Design System (SPDS). This approach allowed us to quickly evaluate what resonated and break away from the familiar constraints of the Fluent system, which we typically work within. Adopting a “fail fast” mindset encouraged experimentation and led us to explore fresh, unexpected design outcomes, as showcased below.
Our design exploration evolved from using abstract shapes symbolizing SPDS components and their modularity to incorporating more literal iconography for clearer representation.
Materiality
While the initial design explorations were bold and distinctive, we soon recognized through quick user testing the importance of maintaining a visual connection to Fluent to avoid confusing SharePoint users. One of Fluent’s defining characteristics is its use of materiality, which we chose to incorporate into our illustrations through a glass metaphor. The glass symbolizes the user’s unique perspective, highlighting how they can leverage their own lens in combination with SPDS elements to craft personalized, distinctive web pages.
Illustration Library
To support the adoption of materiality, I developed an illustration library tailored for the SharePoint team to use as they roll out their new branding. This library features abstracted UI elements inspired by SPDS components, designed to be modular and versatile. These elements can be combined or deconstructed into an infinite variety of compositions, providing the team with a flexible foundation they can expand upon to meet evolving needs.
Impact
The SPDS brand is set to launch in early 2025, and initial user testing with current SharePoint users has already shown a notable increase in engagement with SharePoint components. Leveraging the illustration library, the SharePoint team has successfully developed a range of collateral to introduce the new branding, including Teams banners and email marketing campaigns. This cohesive approach ensures the brand rollout is both impactful and consistent across channels.
