Microsoft has announced Fluent 2, an updated version of its design system that is described as enabling more seamless collaboration and creativity. 

Fluent began is an open-source, cross-platform design system that provides a framework for the design of apps for Windows, and Fluent Design was itself based on Microsoft Design Language.

The updated release has a cohesive color system, new token system, and more options for customization. For developers, Fluent 2 comes with components for Web React, iOS, and Windows. The developers say Android components will be added in the future.

Microsoft says Fluent 2 has been used by the teams developing Microsoft apps including Teams, Loop, and Office. Loop is a new app that is currently in public preview, and which uses components for content including lists, tables, and notes that sync across apps. It's intention is to foster fast, dynamic collaboration.

Kay Davis, the principal Teams design manager at Microsoft, said that Fluent 2's:

"robust theming system built with design tokens allows us to seamlessly integrate with other products built using Fluent 2 and enables us to make holistic design-language updates in an efficient and systematic wa.y"

Fluent is also being used in Visual Studio, according to the Visual Studio design team, who say Fluent has been used for early design changes to the Visual Studio UI, command shelf, menus, tool window chrome, and document tabs.

The team says that "by aligning with Fluent, Visual Studio will look and feel more seamless with the rest of the operating system and other Microsoft products."

The changes are designed to make Visual Studio more accessible and easier to use by adjusting target sizes to make them easier to use while maintaining information density, using color more intentionally to decrease visual noise and draw attention to the active areas of the IDE, and using lighter weight controls to make it easier to distinguish different actions.

Microsoft also says developers can create "Fluent 2 experiences" using React and the Fluent UI React v9. Fluent UI React is built on React and Typescript, and has components that are styled using CSS in JavaScript. Microsoft uses Griffel to render styles and insert CSS into the DOM when needed.

Fluent 2 is available now.

More Information

Fluent 2 Website

Microsoft Loop

Related Articles

.NET MAUI Adds Fluid UI Control Styling

To be informed about new articles on I Programmer, sign up for our weekly newsletter, subscribe to the RSS feed and follow us on Twitter, Facebook or Linkedin.

Comments

Make a Comment or View Existing Comments Using Disqus

or email your comment to: comments@i-programmer.info