Booklet

author

Harsh Shah

Design

Microsoft is bringing new fluent design for their apps

design

Design

|

Microsoft is bringing new fluent design for their apps

This unified mobile design system borrows a lot from the work Microsoft has been doing on Outlook in recent months, with improved iconography, identical file lists, updated typography, new splash screens, and a focus on dark mode.

DARK MODE

Apps like Word, Excel, PowerPoint, Outlook, and OneDrive will now all share common design elements and look far more similar. You'll soon notice a brand-colored header at the tops of these apps (like what exists in Outlook) and a simple bottom bar with Microsoft's new Fluent design icons.

MICROSOFT LAUNCHED A NEW PLAY MY EMAILS FEATURE FOR OUTLOOK

This uses Cortana to read out emails and even calendar invites when you're driving to work, cooking, or commuting. This feature was born out of designers wanting to design email for people who are visually impaired.

MICROSOFT COLLABORATING WITH GOOGLE

Microsoft obviously faces big challenges here because the company doesn’t own or control the platform on which it’s trying to build apps. To counter this, the answer seems to be close partnerships with Samsung, Google, and others.

MICROSOFT’S FRESH APPROACH TO MOBILE DESIGN WILL BE INTERESTING TO FOLLOW IN THE YEAR AHEAD AND BEYOND.

Combined with the company’s promises < jr Fluid Framework, it feels like Microsoft is truly embracing mobile and the web as the foundations of its future.

As Satya Nadella said recently, “the operating system is no longer the most important layer for us.” For Microsoft, it's all about apps and services and building useful features that help people get work done on the go just that little bit quicker.

THANKS

I WOULD LOVE TO HEAR YOUR VIEWS

More booklets by Harsh Shah

More Design booklets

Your recently viewed booklets

  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
  • booklet-slide-images
See all booklets