Fluent Design System – A Quick Introduction

Fluent Design System - Domyinc

Fluent Design System, as they call it, is the latest design tweak from Microsoft, and it is aimed to change the traditional design beliefs of Windows. It features rich interfaces, helps building beautiful and expressive apps with fluidity.

Fundamentals of  Fluent Design System

Fluent primarily consists of five building blocks such as Light, Depth, Motion, Material, and Scale.

 

Light in Fluent Design System - Domyinc1.0 Light

Provide a component to light up the app. The user can quickly identify where they are standing by emphasizing the point by using color or shades. It helps to project the information and guide them through their navigations.

 

Depth in Fluent Design System - Domyinc2.0 Depth

The concept of layers creates depth. It contributes to building a connection between the interface elements in the app. Depth will provide 3D viewing experience in a 2D app.

 

Motion in Fluent Design System - Domyinc3.0 Motion

Motion is that subtle transition that makes the design feel like it is moving during interactions. It will keep your focus on the content by providing the continuity.

 

Material in Fluent Design System - Domyinc4.0 Material

The concept provides visual gimmicks by translating the material qualities to digital environments. Materials can manage how the UI can “bend, stretch, bounce, shatter and glide” as and when a user interact with them.

 

Scale in in Fluent Design System - Domyinc5.0 Scale

Microsoft is changing their design system to more dimensions than 2D. It will help the apps to provide an inter scalability across the devices. It is just not the scale by height or width, but it is all about scale by the medium.

 

Supported devices

The Fluent Design System update is widely available for all the Microsoft devices including tablets, desktop pcs, laptops, phones, VR devices, etc. It also supports inputs such as speak, type, touch, pen and gaze.

When will I get the update?

The windows have already updated it in a couple of apps on Windows 10. The Movies & TV apps have both received a switch with the Fluent Design UI. Fall Creators Update ships in September.

Manikuttan TK

About Manikuttan TK

Manikuttan TK is a passionate web and mobile designer with more than five years of experience in creating simple and compelling interfaces on digital devices. Connect with Manikuttan on LinkedIn. Follow him on Twitter @tkmanikuttan.

Speak Up!