In Seattle, an engineer thumbs through a Mumbai-based coworker's edits while walking between meetings. In rural China, an artisan uses their phone to sell their creations. In Johannesburg, a lawyer texts back a client before catching the bus. These real-life snapshots show the diverse and evolving workflows of today's 5 billion mobile users worldwide.

In many ways, mobile productivity is still a code waiting to be cracked. Beyond mobile-first and mobile-only markets where necessity mandates it, we can rarely accomplish as much on a phone as we do on our PCs. However, we believe in empowering everyone to be fully productive on any device. Our teams' focus on emerging markets, inclusive design, and accessibility has broadened our aperture as we create more tailored, intelligent experiences across Microsoft 365.

Today, we]re excited to unveil redesigns to our flagship mobile apps! We've redesigned Outlook, OneDrive, Word, Excel, and PowerPoint. You can also expect new versions of Teams, Yammer, and Planner soon. These redesigns contribute to broader company efforts to take mobile productivity to the next level. At Microsoft Ignite, we publicly previewed our beta Office app and Fluid Framework. Office combines multiple Microsoft 365 mobile experiences in one app, and Fluid is a new technology that breaks broad experiences into dynamic, real-time components ideal for mobile scenarios.

Beyond the public eye, we]re also conducting global research, designing a mobile-born version of Fluent, exploring scenarios for dual-screen experiences, and creating mobile UI toolkits for external developers to build this mobile future alongside us.

Read on for a behind-the-scenes look at our research, design process, and future vision for Microsoft 365 mobile experiences.



How newly crafted shared components were used to redesign our mobile experiences from the ground up.

Research: Understanding microproductivity and the mobile mindset

Human-centered research underpins great design, and our teams dove deep to understand how people think, feel, and act when getting things done on the go. Research in mobile-first or mobile-only markets like India and China allowed us to study everyone from students to factory floor workers. We also leveraged pioneering work by Jaime Teevan and Microsoft researchers around "microproductivity."

Microproductivity exemplifies meeting users where they're at: the modern world has increasingly fragmented work. Instead of solely pushing people to focus more, however, we explored whether those fragmented slices of time could be more productive with "microtasks." A microtask is a bite-sized piece of a bigger task, like writing one paragraph instead of working on an entire Word document. Research showed microtasks increase feelings of productivity.

This aligned with our observations of mobile behavior where, despite spending up to four hours a day on the phone, sessions average just 20 to 30 seconds. Moving forward, we began redesigns by asking two things: What are the most valuable actions that someone can perform on their phone in less than 30 seconds? And how can our intelligent services enrich these actions?

As it turns out, helping people be as productive in 30 seconds as they usually are in 30 minutes unlocks myriad opportunities, and we've released several new features designed with mobile in mind. In Outlook, the new Play My Emails feature lets you listen to your inbox as you would a podcast - ideal for making productive use of idle time. In Word and Office apps, Read Aloud offers a similar benefit. The mobile-first experience of quickly scanning docs and tables with your phone's camera has been added to Office, OneDrive, and several other apps. Microsoft intelligence enhances each of these features to present context-specific, relevant, and personalized information.

Craft: Bringing Fluent to mobile for a post-OS world

Fluent for iOS and Android is a mobile-born interpretation of our Fluent principles that ensures experiences will feel both distinctly Microsoft and at home on mobile devices.

Leveraging native platform conventions also lets us tap into built-in accessibility technologies. This ensures an equally great experience for people who prefer an auditory experience like Android's talkback screen reader, or low vision customers using iOS's dynamic type.

Moreover, any update we make to the system populates to all apps that use Fluent mobile. For example, when we recently updated our color palettes to match the latest accessibility standards and introduce dark mode, all changes automatically updated in each of our app UI components.

Among our new design artifacts are redesigned experience icons, which you'll see in current and future designs.

When designing Fluent for mobile, we focused on consistently designing seven signature elements to create a great end-to-end experience: the app icon, splash screen, cells, cards, typography, people, and file lists. Now, tapping the app icon takes you to a branded splash screen, which leads to your content, neatly framed by a brand-colored header and a simple bottom bar featuring our brand-new, beautiful and friendly Fluent mobile icons ready to take action.

Microsoft 365 applications seen side by side, illustrating the how design language can also unify and bring delight to a system of experiences.

Coherence: Alignment through shareable mobile UI toolkits

For all Microsoft 365 experiences, coherence is an important design tenet, but it's particularly vital in mobile environments. While on the go, we often switch between apps and have shorter attention spans, sharper time constraints, or are in more distracting environments.

When mobile apps seamlessly connect and feel similar, it reduces cognitive burden by eliminating the need to re-learn app patterns and navigation. This is especially important to us as we're investing in side-by-side productivity scenarios on iPad and Surface Duo.

As part of the Fluent Mobile effort, a team of over 40 designers created mobile UI toolkits that enable all designers at Microsoft to build experiences using the same shared components, and collectively evolve the design system over time. These toolkits are also available to external designers and developers to ensure our mobile experiences stay aligned and scale with our customer and platform needs. Start building your own best-in-class apps today with our Fluent toolkit.

A sampling of shared components from the Fluent mobile UI toolkit.

Vision: The future of mobile productivity

When it comes to mobile productivity, we're just getting started.

We're excited to build entirely new mobile experiences with Fluid, whose dynamic components foster microtasking by updating in real time and making it easier to collaborate. As phones increasingly bridge into augmented- and mixed-reality spaces, we'll be evolving Fluent mobile to design 3D experiences that are especially promising for firstline workers and students. Finally, expanded investments in inclusive design propel us beyond leveraging existing accessibility technologies and toward designing entirely new voice interactions for innovative experiences on Surface Earbuds.

So, the next time you’re on the move, grab your phone and give our new mobile apps a whirl.

Source: Cracking the Code to Mobile Productivity - Microsoft Design - Medium

Posted By: Brink
05 Dec 2019