Microsoft reveals the future of its Fluent Design for Windows 10

Microsoft first unveiled its Fluent Design changes for Windows 10 at Build last year, adding subtle animations to many apps and core parts of Windows. We’ve seen a number of changes to the design of apps in the Fall Creators Update and the recent April 2018 Update, and now Microsoft is unveiling some future Fluent Design plans today at Build 2018.

During a session on Fluent Design at Build today, Microsoft unveiled a number of new subtle changes that will appear in Windows 10 apps this year. Microsoft is using shadow effects across Fluent Design, alongside modernizing context menus and implementing consistent back button controls in apps.

The changes make for a more refined version of Fluent Design, and should hopefully avoid the somewhat inconsistent implementation of Fluent across Microsoft’s own first-party Windows 10 apps. Third-party app developers will need to adopt the Fluent controls to get access to these newly designed elements in their apps, and even Microsoft will need to bring these to its Windows applications.

The shadow effects for Windows 10 apps provide more depth in apps, and Microsoft is also emphasizing the use of color. All of these subtle additions should add up to prettier apps, but Microsoft is also acting on feedback over the touch-focused UI elements of Fluent Design.

A number of the controls you find in Universal Windows Apps that use Fluent Design are rather large, and optimized for tablets and touchscreen devices. Microsoft admits that its heard from developers that the UI is too big, especially for mouse and keyboard users. It’s balancing that out with smaller controls, and even a compact mode that’s designed for more dense and complex applications.

Microsoft is even tweaking the back button placement in Windows 10 apps to make it more consistent. At the moment app developers can place a back button within the app, or at the very top, but it’s not always clear for Windows 10 users. The navigation changes for Fluent Design apps also include support for keyboard shortcuts and even the Xbox One controller to navigate around apps.

All of these Fluent Design changes are being introduced this year, allowing developers to take advantage of them in Windows 10 apps. Microsoft is slowly changing the design direction of Windows 10 and modernizing apps in the process, and these subtle changes help freshen up the overall look and feel of Windows.

Comments

Looks a bit like MacOS actually.

Where? What? When? Who?

How? I use Macs almost exclusively for the past 3 years and I dont see it.

These people are basically only speaking about the side-bar thing where Mac holds weather, stocks, calendar update. Or maybe the mild similarity between the Acrylic panels and the transparency with blur that the Apple Apps use on their menu/title bars.

Other than that, I find that Fluent is a far cleaner, more appealing design standard, or at least it will be when they introduce that Compact Mode, and tidy up the consistency across applications.

The only difference between the two is Microsoft is using sharp corners on the menus and the use of a condensed font. The rest seems very similar — but well done, regardless.

Thank you for elaborating.

Not only that, there is also the translucent left sidebar in apps and the translucent drop down menus, plus the overall color palette and cleanliness of the UI that is very mac like, but I’m not complaining it looks very good while maintaining its windowsness.

Two words: window shadows.

Yes, Windows has had window shadows forever, but the softer father casting shadows make that last screenshot feel very MacOS-like.

Yup. It has boxes and icons and buttons and stuff. It’s practically a clone.

Jesus, I said it looks ‘a bit’, ok? The acrylic just vaguely reminds me of the soft white windows that you see in MacOS.

Can you blame him? Apple did sue Samsung because they also had a square phone with rounded corners….not far off from boxes and icons.

This is a running meme. Honestly, macOS has been borrowing from Windows and Android more so than being copied, these days.

Yeah. Imagine that. They both employ windows that can overlay each other; have buttons to maximize, minimize and close those windows; and use graphical icons as shortcuts to launch things.

Clones.

Yep. I can’t believe Microsoft would copy Apple like that. They have no dignity.

Looks a bit like MacOS, if it was completely redesigned and modern, actually.

ftfy.

How does this look any more modern than macOS? This is literally the same UX we’ve had for decades now with some aesthetic tweaks. It’s still windows on a desktop with a task bar at the bottom.

For starters, it doesn’t have Fischer Price looking rounded corners. It looks elegant and mature, which lends well to a more clean and confident modern design language. It utilizes the workable area efficiently, while on it’s own isn’t modern, but combined with iconography that isn’t over-styled with respect to negative space, creates an aesthetic that feels fresh and confident.

Yeah I have to disagree. macOS doesn’t look Fisher Price. The biggest difference between the two outside of the same basic UX differences since Windows 95 is macOS has some gradients and Windows looks a bit flatter. I really don’t think rounded corners are the difference between being modern or not lol. It’s one thing to have an aesthetic preference, I certainly do, but neither is more modern than the other —it seems like a pretty ridiculous claim to me.

It’s not really a preference; harder liners are a principle of a more modern design language:

most components of modern design…includes clean, straight lines with no additional detail. This differs slightly from contemporary design, which uses curves and sweeping lines; modern design’s lines are crisper, sharper and very spare.

I admit that it’s probably a subtle distinction that I am over analyzing (it is the field I work in) and not something most would consider or even notice.

The use of clean, straight lines doesn’t mean every single line has to be straight lol.

really, if you show me this then i will have proof!

Looks like a flat Aero to me

a flat Aero…looks like you got one without the bubbles…i’d take that back!

I haven’t seen an orange Aero for ages…. I miss them

View All Comments
Back to top ↑