Inspired by Fluent Design

Michael Gillett
My Microsoft Life
Published in
3 min readMay 29, 2017

Since rumours of Project NEON first surfaced people have been excited to see what Microsoft had planned for the UI of Windows. At Build Microsoft made public its Wave 1 vision for the Fluent Design System, formerly known as Project NEON, and following that there’s been a lot of excitement about the new animations, materials and effects.

Fluent Design System elements — Igor Pavlinski

Fluent Design has inspired many people to create concept apps and experiences, this is not something that a Microsoft design has done for some time, and its great to see.

To that end I thought I would share some of the Fluent Design inspired concepts I have found. (I say “inspired” because they don’t all adhere to the guidelines of Fluent but they originate from Microsoft’s new design style.)

Email app by Neko

From Dribbble

I’m sure we’d want the email app to open quicker than this but goodness me this looks good! If we start seeing aspects of this in our apps it would be fantastic. The animations here present a clear hierarchy of the panels and would make the loading of data feel “fast and fluid” to use a term from the Metro UI era.

Email App by Ghani Pradita

From Dribbble.

Keeping with email apps here’s a slightly different look at how an email app could look using elements of Fluent. The acrylic material is being used here on the navigation and secondary content, whereas the primary content (the email itself) has a solid background behind it. I like the pop out window’s acrylic background, it again adds to the impression that it is not part of the primary content but is linked to it.

This approach to emphasising content is very nice and one I expect to see in many apps over the coming months, a similar emphasis is already applied in the updated Photos app.

Chat App by UISTAR

From Dribbble.

This Chat App concept makes use of some of the layers that Fluent introduces to give depth to the content within the app. Notice the panel on the right extends out of the window and the list of media even extends further out again. It would certainly be interesting to experience this kind of UI, it looks good in a concept but I wonder how well it works in a real use case.

This looks like a Skype app, if the official Skype app gets updated to look partly like this I would be very happy.

I hope to be able to find more Fluent inspired concepts over the coming weeks and I will share them too. What do you think about these designs? Are you looking forward to the arrival of more Fluent Design inspired apps on Windows 10?

--

--

Michael Gillett
My Microsoft Life

Windows Insider MVP (MVP since 2012) | Lead Web Dev based in Camden, London