Following on from revealing a new-look icon for its Chromium-based Edge browser, Microsoft has now taken the wraps off more redesigned icons.

Design teams across the company came together as a collective to develop design guidelines that encourage individuality while "creating a cohesive whole," explained Jon Friedman, corporate vice president of design and research at Microsoft. From enterprise to small business to consumer, product teams ensured each icon "represented both the product truth and the larger Microsoft brand."

The team shared knowledge, iterations, obstacles, and successes. They compared icons in different contexts and made changes for one another.

From tools like a calculator to a mixed-reality app that puts an expert anywhere in the world, the diversity of Microsoft's customers’ needs continues to grow exponentially. "We needed our modern icon system to continuously reflect changing tides," Friedman said.

"With the newest wave of icon redesigns, we faced two major creative challenges. We needed to signal innovation and change while maintaining familiarity for customers. We also had to develop a flexible and open design system to span a range of contexts while still being true to Microsoft," he added.

Miccrosoft's Fluent Design System was instrumental in helping Microsoft navigate both these challenges. Fluent emphasizes building off the familiar — designing for what Microsoft customers already understand, not asking them to develop new habits or learn something new. Fluent is also about creating space for a diverse yet connected system. To account for such a breadth of contexts and experiences, Microsoft expanded their initial library of icon colors, materials, and finishes.

Based on testing and customer feedback, Microsoft introduced rich gradients, broadened our spectrum of colors, and implemented a dynamic motion with ribbon-like qualities.

Microsoft customers are also beginning to use mixed reality to accomplish goals in a completely new way. "Blending the physical and digital worlds in our icons helped us think beyond traditional manifestations of colors, finishes, and materials. We needed to consider the third dimension, so we chose new materials that reflected light and depth and felt more tactile," Friedman explained.

The newest design guidelines helped Microsoft unify icon construction across the company and within each product family.

"We learned what didn’t resonate with people (flat design and muted colors) and what did (depth, gradations, vibrant colors, and motion), all of which drove our decisions," Friedman said.

The new Windows logo look is very much in line with the recently redesigned icons we've seen for Office, as well as the icon for Chromium-based Edge.