Microsoft wants Android app devs to adopt its Fluent Design style

Microsoft wants Android app devs to adopt its Fluent Design style

We may earn a commission for purchases made using our links.

Windows Phone and Windows 10 Mobile are dead, but that hasn’t stopped Microsoft’s mobile efforts. The company has transitioned from a hardware company selling smartphones to a company that wants users to use its apps in Android and iOS, the duopoly that dominates the mobile operating system industry. To that end, Microsoft has an entire portfolio of first-party apps ranging from Microsoft Office (newly integrated into a single app), Outlook, OneDrive, OneNote, Translator, Edge, To-Do List, Launcher, and more. All of these apps were designed using MDL 2, the design language that Microsoft used in designing Windows 10, which itself succeeded the Metro/Modern design language of Windows 8 and Windows Phone. In 2017, however, Microsoft announced that a new design system called “Fluent Design” would be its design language going forward, and it would be a revamp of MDL 2. Since then, newer versions of Windows 10 have started incorporating principles of Fluent Design. Now, Microsoft has designed a mobile-born version of Fluent, and it wants app developers to adopt the design language.

Fluent Design

Microsoft has already redesigned Outlook, OneDrive, Word, Excel, and PowerPoint with mobile Fluent design, and the company says users can expect new versions of Teams, Yammer, and Planner soon. Microsoft’s design team has been exploring scenarios for dual-screen experiences (such as Surface Duo) and it states that it has created mobile UI toolkits for external developers.

Fluid is a technology that breaks broad experiences into dynamic, real-time components ideal for mobile scenarios. Microsoft’s mobile philosophy is to increase the mobile productivity of users, using terminology such as microproductivity and micro-tasks (such as writing a single paragraph of an Office document instead of the entire document). According to Microsoft, there is a lot more that can be done with mobile productivity, and the company observes that users rarely accomplish as much on a phone as they do on a PC, with the exceptions of mobile-first and mobile-only markets such as India and China.

Microsoft has observed mobile behavior where users spend up to four hours a day on the phone, but their sessions average just 20-30 seconds. This led the company to ask itself which is the most valuable action that someone can perform on their phone in less than 30 seconds, and how can Microsoft’s services “enrich” these actions?

Microsoft, to that end, has released several new features that are mobile-first, such as Outlook’s Play My Emails feature, which lets users listen to their inbox like a podcast. The same functionality has made its way to the Word and Office apps in the form of Read Aloud. Microsoft now offers features in Office, OneDrive, and other apps that let the user quickly scan documents and tables with their phone’s camera, and all of this is said to come with context-specific and personalized information.

Fluent Design for Android and iOS

Microsoft now thinks of itself as a company where the operating system doesn’t matter, and it’s building experiences for a post-OS world. To that end, design languages become even more important to differentiate Microsoft’s development from others. Fluent design for Android and iOS is “a mobile-born interpretation of our Fluent principles that ensures experiences will feel both distinctly Microsoft and at home on mobile devices”, Microsoft states.

Microsoft leverages native platform conventions to tap into built-in accessibility technologies. Moreover, the company promotes the fact that any update it makes to the system populates to all apps that use Fluent mobile. The company recently updated its color palettes to match the latest accessibility standards and introduce dark mode, and these changes were automatically updated in each of its app UI components. These new design artifacts include redesigned experience icons, which will be seen in current and future designs.

Microsoft says that when designing Fluent for mobile, it focused on consistently designing seven signature elements for a great end-to-end experience: the app icon, splash screen, cells, cards, typography, people, and file lists. Branded splash screens are now a feature that leads to the user’s content, framed by a brand-colored header and simple bottom bar that features the new Fluent mobile icons.

Shareable mobile UI toolkits

Microsoft values coherence as an important design tenet that is “particularly vital” in mobile environments, because of shorter attention spans and sharper time constraints. The company is also concentrating on side-by-side productivity scenarios on iPad and the Surface Duo.

A team of 40+ designers created mobile UI toolkits that enable all designers at Microsoft to build experiences using the same shared components, while collectively evolving the design system over time. The big news here is that the company has announced these toolkits are now available for external designers and developers as well. Why? Microsoft wants to ensure its mobile experiences stay aligned and scale with customer and platform needs. The company wants app developers to build their apps using the mobile UI toolkits.

Microsoft states that it’s “getting started” when it comes to mobile productivity. The company has invested in Fluent Design since two years now, and it has arrived in mobile. The question is: Will Android app developers be interested enough in Fluent mobile to take up Microsoft’s offer and use the mobile UI toolkits for designing their apps? If Microsoft’s strategy succeeds, it would almost certainly be a big win: third-party apps will look and feel the same as Microsoft apps, which may entice users to turn towards Microsoft services as an alternative. At the same time, this sets up as obvious competition for Google’s Material Theme, which may lead to fragmentation in app design and confusion for users.

Android app developers now have a choice. Should they design their app using Google’s Material Theme, or Fluent mobile?


Source: Microsoft | Via: The Verge