
Fluent Design System - wiradikusuma
http://fluent.microsoft.com/
======
sctb
Previous discussion:
[https://news.ycombinator.com/item?id=14317171](https://news.ycombinator.com/item?id=14317171)

------
romaniv
Interface design is very, very important at this stage of evolution of
computing, and I am disappointed in the overall direction taken by the
industry in this regard. What we (desperately) need is work similar to the one
that was done by Douglas Engelbart and still done by people like Alan Kay and
Bret Victor. Instead we get things like Bootstrap, Metro, Material Design and
now Fluent. (I am aware they are very different in scope, but their overall
influence on real applications is quite similar: establishing certain wide-
spread normative patterns.) Shallow and reactive things. They don't invent and
define new ways of UI interactions and information presentation (examples from
the past: clipping window, icon, hyperlink) and concentrate mostly on how
things look.

You might counter that this is the domain of MIT Media Lab rather than
Microsoft and Google, but at this stage new UI concepts have to be adopted by
entities with significant influence to be adopted at all.

~~~
miguelrochefort
I completely agree with you.

I came to the conclusion that we need a completely new language, a new
communication paradigm. We can't continue to build single-purpose apps for
every single thing. We need a single interface that's general-purpose enough
to let people communicate what would today take 1000 different apps (or 1
natural language).

I believe that the future of UI will be a mix of task management concepts (to-
dos, task dependencies, task delegation, timelines) and binary interaction
(Akinator, Tinder, Mechanical Turk). Add a graph knowledge base, a blockchain,
a network of trust, smart contracts and you're set.

I've been trying to start a discussion about this for years, without success.
If anyone is interested in discussing this space, I encourage you to let me
know.

~~~
chiefalchemist
Aren't those things voice/language processing aim to solve? That is to
liberate the user from the device/interface and let ask for - as we typically
do human to human - what then want and need? And voice to VR and many things
change. Some, perhaps, not for the better. Welcome to The Matrix?

~~~
miguelrochefort
Natural language interfaces are horrible. I don't know what people doing voice
recognition and language processing are thinking. This is extremely short-
sighted, and doomed to fail.

I'm thinking about a completely new communication paradigm, one that's short
of a brain interface.

~~~
chiefalchemist
Perhaps. Which I think is why brain interface is the Holy Grail. No
typing/touch. No vox. Just think it.

p.s. Natural language is still in it's early stages. Think of the early (non
UI) PCs. That is, over time voice as an interface will get better, and better.
It will get there. Just not yet.

------
plgs
Link to a channel 9 recording of yesterday's talk about Microsoft Fluent
Design System:
[https://channel9.msdn.com/Events/Build/2017/B8066](https://channel9.msdn.com/Events/Build/2017/B8066)

It has a bit more content than the landing page IMHO.

------
m_fayer
Ugh. This looks like MS trying to one-up Material Design (itself already on
the rich side), and in so doing I think they've gone a step too far.

It does look good, in a sci-fi movie UI kind of way. But it would be a
nightmare if many of the apps I use day to day started to look this way. All
the animation, depth, texture - it's too attention grabbing, self conscious,
and annoyingly, deeply, branded.

Software is not supposed to be a high-design object, taste is very individual
and any object with so much aesthetic weight imposes on our consciousness.
While highly designed things can bring us a lot of pleasure, we should be free
to judiciously choose them for ourselves.

Many pieces of software are non-negotiable high-use tools. They should be,
first and foremost, highly usable - and if there's an insistence on imposing
an aesthetic experience on the user, it should be acknowledged that the user
likely has no choice but to use the software, and may be temperamentally or
socioeconomically unlikely to appreciate the aesthetic experience being thrust
upon them. (I wonder what my 75 year old Russian mom would make of all the
depth effects, Windows 10 already confuses her and hurts her eyes.) So if
we're going to insist on infusing our software with some particular design
aesthetic, it should at the very least be light, minimal, and easy to ignore
for those who aren't interested and just need to get their work done.

------
nxc18
They don't say it at all, but perhaps the biggest change here is that they're
making headings big and bold now. For quite a few years, Apple, Microsoft, and
Google (even pre-material) all seemed to be competing on thinnest, smallest,
ultralight-est headings.

edit: I stand corrected. Their marketing site and all their videos are
(apparently) inconsistent with their guidelines:
[https://docs.microsoft.com/en-
us/windows/uwp/style/typograph...](https://docs.microsoft.com/en-
us/windows/uwp/style/typography)

------
nailer
Also: [https://docs.microsoft.com/en-
us/windows/uwp/style/](https://docs.microsoft.com/en-us/windows/uwp/style/)
for examples and code.

~~~
MichaelGG
The calculator example for Acrylic[0] looks atrocious:
[https://docs.microsoft.com/en-
us/windows/uwp/style/images/ac...](https://docs.microsoft.com/en-
us/windows/uwp/style/images/acrylic_app-pattern_full.png)

What is that trying to convey? Large spaces with no division? Looks broken.

0: [https://docs.microsoft.com/en-
us/windows/uwp/style/acrylic](https://docs.microsoft.com/en-
us/windows/uwp/style/acrylic)

------
stupidcar
I think the trend towards more animation is fine on a micro-scale – buttons
and so forth — but I predict there will eventually be a big backlash against
these huge, complex parallax transformations. They are just too exhausting to
watch.

~~~
DrD4nger
Agreed, but I imagine that the parallax/animation aspect will be used
sparingly, or very discretely, and only within a few applications. I would be
towards the shading, transparency, and having the content cut off flush to the
bottom of the window being the most common use of their fluent design
principles.

I will be very upset/nauseous if they overuse the parallax effect. The
settings will need an off switch.

------
trevman
Just an FYI, click 'Build' in the upper right for actual information.

------
ezekg
That video was essentially useless seeing as the clips never lasted for more
than a split second (maybe I'm just bad at focusing this morning?). Other than
that, this _looks_ pretty good. I really like the white/monochromatic stuff
I've seen floating around on Twitter lately. (I'm a Mac guy that hasn't used
Windows since 7.)

------
have_faith
What is it exactly?

~~~
devopsproject
It uses ML and AI in the cloud to identify people who don't read the linked
article before commenting. It is working brilliantly.

~~~
jdormit
I read the article, and I still have no idea what "Fluent Design" actually
entails.

~~~
devopsproject
It's literally the first sentence

> An eloquent design system for a complex world

It is a set of design guidelines described with flowery language.

~~~
jdormit
Right, but what makes a design fluent? Are there guidelines? Other than using
"light", "depth", etc.?

~~~
devopsproject
flowery language

The next time your read about a tech or new startup that uses really
unnecessary words, come back and visit this thread

------
whowouldathunk
For now it's a few things that are available out of the box for XAML apps that
target the Fall Creators Update SDK:

1\. "Acrylic". It's the blur/color-blend/noise effect that you can see on the
Edge tab bar or top of Photos app in the Fall Creators Update.

2\. Mouse over lighting effects. You can see that briefly in the video when
the mouse over a ListView and tiles.

3\. Lots of small animations

4\. "Depth", meaning 3D transforms and shadows used for emphasis

------
anentropic
Lens flares on everything! To the future!

------
sonar_un
The video wasn't very good at explaining the system, and the website itself
didn't even use the same effects that were used. For instance, there was heavy
use of parallax scrolling in the video, but the website didn't have it at all.
Seems like a missed opportunity.

~~~
nxc18
The website has plenty of parallax scrolling, especially with the background.
Maybe it just isn't on mobile? It is subtle.

~~~
sonar_un
Strange, it is working now. Chrome Mac.

But yes, it is subtle.

------
marsrover
If you're on the fast track for Windows 10 insider builds, you can see a
preview of this by opening your calculator. I expect you'll be thoroughly
disappointed.

------
agumonkey
I like it enough to be curious. It's still a bit fluffy (scale wasn't clear).
Still something there.

------
irq-1
With Firefox on Xubuntu the site is unusable -- zooming down to 30% you can
see most, but not all, of the text.

Maybe it's my system, but Microsoft doesn't deserve the benefit of the doubt.

~~~
DocSavage
It's broken with my up-to-date Chrome on MacOS. I could see the site properly
with Firefox Aurora.

Aside from the sketchy web page, though, the site is very vague. Yeah, I see
there are elements to design but what is the "Fluent Design System" and how
does it champion the use of those elements?

