Microsoft announced the Fluent Design System as the new design language for Windows 10. This was the first major refresh for UI of Windows Operating System after Windows 8’s Metro Design. This is a perfect blend of Aero design of Windows 7 and the new Metro UI of Windows 8 or Windows 8.1. Microsoft’s Fluent Design System just aimed to make Windows 10 look more beautiful. To be honest, I always felt Windows 10 was not properly designed because the operating system looked highly feature rich but was never at that level of attractiveness as Windows 7 or Windows 8 used to be. But now with Fluent Design, Windows is beautiful.
What is Microsoft Fluent Design System
As Microsoft states in their official documentation,
The Fluent Design System for UWP is a set of UWP features and guidelines for creating UWP apps that perform beautifully across devices, inputs, and dimensions. Our guidelines are divided into several categories: layout, style, controls, input and devices, and usability.
Now, this means that the Fluent Design System is not a concept or just a set of guidelines. It is a blend of appearance, behavior, layout, and scalability of UWP apps across environments.
Why you should convert your current UI of your App to Fluent DesignWell, let me first write what Microsoft says after that, I will write it in my own way :
Fluent Design platform features are built into UWP (Universal Windows Platform) and help you create apps that are Fluent. Some of these features–such as effective pixels and the universal input system–are automatic. You don’t have to write any extra code to take advantage of them. Other features, such as acrylic, are optional; you include them in your app by writing code to include them.
This means that if you already have a Windows App, you can convert it to Fluent Design very easily. You won’t need any extra code or something, but your code will be enhanced to more be more attractive once you start making those minor changes. This means you should just go for adding fluent design to your apps! But first, make sure of what brings Fluent Design System together.
Components of Fluent Design System
Well, Fluent Design System comprises of 5 main elements that build it. They are as follows :
• Light
• Depth
• Motion
• Material
• Scale
Light:
Light is the element that draws the attention of the user. It is used to in Windows 10 to guide the user towards the pointer element in the User Interface. This makes the user experience far better than it used to be without it.
Depth:
Depth is an element that takes the user beyond the flatness of the design. It helps them enjoy the layering structure of the User Experience making it more engaging and attractive.
Motion:
Now, Motion is that element of the Fluent Design System that brings all the other elements to life inside of Windows 10. It is responsible for the main transitions of the apps that make the overall behavior of the application.
Material:
Wait, let me tell you that this is not an imitation of the Material Design that Google offers for Android devices. This element is responsible for showing off the real materialization of the app. This mainly consists of Acrylic or in simple words, the typical blue that make the User Experience even better.
Scale:
Now comes Scale, it is that element which enhances the experiences in the old 2D design to give new and modern experiences that were not possible earlier. They will make your user experiences better by using the pixels and lighting them at correct places instead of just showing off the dim old colors. This also means that the pixel density of the modern displays will be used to make your experiences better.
The Verdict:
Well, the Fluent Design System is something that Windows 10 needed since the starting, but as Microsoft is done with the addition of major functionalities to the Operating System, they are now focusing on making it more beautiful as well. And I am sure that other people like me would appreciate this new design language and would be equally excited as to see it being implemented as we see newer major releases of Windows 10.
This is Fluent Design System by Microsoft in Windows 10! You can read more about Fluent Design System in the official documentation by
Microsoft.
Enable or disable Fluent Design in Windows 10Most of the Fluent design elements can be found in Windows 10 Fall Creators Update v1709. There might be chances that you might or might not like this new UI refresh. Or that might be reasons where your machine would not support fluent design ultimately killing the overall performance of the machine.
Before you start, you might see various translucent effects in various parts of the operating system. Just like this:
To begin, open the
Settings app from the WinX Menu. Now navigate to
Personalization settings inside the settings app.
You will now observe a list of submenus on the left panel of the settings app. You have to choose
Colors from it.
Now, on the right side page, you will see a list of options available for you. This will include the selection of an accent color, selection of dark or light theme and more. Among them, select the
Transparency effects toggle.
Here, if you toggle this button on, you will see the transparency effects or else if you turn it off, you will not see any transparency effects.
This is a screenshot without the fluent design elements :
You won’t be asked to sign out or reboot in order to see the changes – the changes will take place instantly.
source
