Paul Krill
Editor at Large

Escape from Flatland: Microsoft’s new UI approach

news
May 15, 20172 mins

Microsoft's Fluid Design System concept will help developers create apps for a multitude of systems and input types

apps mobile
Credit: Thinkstock

With the Fluent Design System, Microsoft is looking to accommodate rich, immersive experiences across devices, including in iOS and Android via apps. Microsoft will roll out Fluent Design capabilities in multiple phases. Developers will get the technology after it has already been tested in real-world solutions.

“We’re going from a flat design language … into the immersive, multidimensional one,” said Bojana Ostojic, principal design manager in the Windows devices group. “We’re going from small screen and touch to now appreciate the full range of devices and input types, and we’re moving beyond just consumption and communication into also creativity and curation.”

[ A developer’s guide: Get started with serverless computing. | Microsoft Azure Functions locks in on serverless computing. | Build ’em now! 5 uses for serverless frameworks. ]

The Fluent Design concept features five building blocks: light, depth, motion, material, and scale:

  • Light lets developers assemble systems where light provides a specific mood.
  • Depth is about spatial sound and visual depth.
  • Motion establishes context and continuity of experience.
  • Material pertains to touch and helps establish visual hierarchy.
  • Scale centers on adaptive, responsive, intelligent UIs for an ecosystem of devices.

Fluent’s interaction visualization model works with gestures, inputs, and controls. One visual material, Acrylic, lets developers create visual hierarchy and accommodate different levels of opacity. Fluent Design also features connected animation services as well as conscious controls, providing a responsive, “conscious” UI that takes intent into account. Another feature of Fluent Design, called perspective parallax, deals with depth in UIs.

A planned second design wave will provide 360-degree media playback for multiple modes for playing media, “conscious” headers, speech; z-depth layering, and spatial sound. Microsoft is offering a XAML control gallery for Fluent Design, and it will provide design kits to use Fluent with popular programs, including Adobe’s Photoshop, Illustrator, and XD.

Paul Krill

Paul Krill is editor at large at InfoWorld. Paul has been covering computer technology as a news and feature reporter for more than 35 years, including 30 years at InfoWorld. He has specialized in coverage of software development tools and technologies since the 1990s, and he continues to lead InfoWorld’s news coverage of software development platforms including Java and .NET and programming languages including JavaScript, TypeScript, PHP, Python, Ruby, Rust, and Go. Long trusted as a reporter who prioritizes accuracy, integrity, and the best interests of readers, Paul is sought out by technology companies and industry organizations who want to reach InfoWorld’s audience of software developers and other information technology professionals. Paul has won a “Best Technology News Coverage” award from IDG.

More from this author