SHAREPOINT DESIGN SYSTEM
2022
While working at Office Media Group / Microsoft, I was asked to contribute to the SharePoint design system, given my system design responsibilities and experience at the time. Below are several examples of my creative contributions to this design system.
CAPABILITIES USED
System Design, UI Design, UX Design, Responsive Design, Iconography, Typography, Documentation, Figma
MISCELLANEOUS
Work created at Microsoft
CAPABILITIES USED
System Design, UI Design, UX Design, Responsive Design, Iconography, Typography, Documentation, Figma
MISCELLANEOUS
Work created at Microsoft
THE DESIGN GUIDANCE
The following is a collection of brand-specific colors which I identified and documented across light and dark themes.
I identified and documented a type-ramp which I converted into Figma styles for our designers to use when designing the product UI.
I also documented the shadow treatments which I converted to Figma styles.
Iconography design is one of my favorite tasks, and this project was no exception, where I got to contribute with several custom icons, which I added to the MDL2 library.
I created visual guidance for the target breakpoints, which was available as a library asset for our design teams.
Creating visual layout grids is one of my favorite parts about designing UI systems.
I created visual layout grids to show UI guidance and reflow behavior across our target breakpoints.
FINAL UI PREVIEW
Here's a small preview of the SharePoint UI which I designed, based on all the technical guidance provided above.
