microsoft web Framework
The purpose of creating a standard Microsoft web framework is to create a cohesive design system that is functional, useful, and valuable to customers. The design system, featured for use on getmwf.com, informs how our technology looks and feels across all consumer-facing websites.
I helped design foundational components as well as robust modules. Considerations were interactive states, layout, options, responsive story, accessibility, and cross-Microsoft usage. Our highly collaborative team consisted of 2 designers, 6 developers (contractors), and our Design Manager.
Users may find our sites inconsistent and difficult to find what they are looking for. Microsoft websites vary greatly in usability, interface, and overall visual design and architecture.
Microsoft.com consists of commerce as well as editorial sites. We needed visual and functional alignment across all sites to embody the One Microsoft concept.
A consistent and cohesive design system that includes a common web framework and components will help unify Microsoft’s web properties and make the site easier for the user to navigate and find great products.
Any future changes to common components or styles can be done within the code so all affected elements are universally changed. All Microsoft sites will be unified while retaining its own brand identity.
The framework and assets are available publicly for agency use at getmwf.com, the Microsoft design language Web Framework website.
Design System for Microsoft web properties
(Please click to see enlarged images.)
Microsoft Web Framework Design tenets
The design system informs how our technology looks and feels across all consumer-facing websites