Han-Yi Shaw is group program manager and design manager for Office for iPad.
Hello once again from the Office for iPad team. Weâ€™ve hit a great milestone with over 27 million downloads of Office for iPad and we would like to say thank you to everyone who has tried out the apps and provided feedback to help us continually improve Office for you. Today we want to give you a behind-the-scenes look at the design and creative journey we took as we reimagined Office from the ground up for iPad.
From its inception, the Office for iPad projectÂ has been a blend of imagination and passion.Â When we had our firstÂ tantalizingÂ glimpse of the iPad, we were intrigued by the huge opportunity ahead: enabling Office customersâ€”over 1 billion around the globeâ€”to rediscover the power of mobileÂ productivity in new and exciting ways.
A scenario-driven design approach
Over the past few years, touch-enabled devices have changed the way we engage withÂ technology, but the promise of mobileÂ productivity had yet to beÂ fully realized. MobileÂ productivity is about getting things done, no matter where you are, so we began by taking a deep look into how peopleâ€”including ourselvesâ€”aspired to use mobile devices to get work done. We identified several key mobile scenarios that people said they wanted and needed to do most on their iPads. At a high-level, these included:
- Packing up for the ride home
- Starting from scratch
- Last minute scramble
- Buttoning things up
- Collaborating with coworkers
- Taking notes
By taking a scenario-driven approach, we made our starting point â€œdesigning for iPadâ€ as opposed toÂ â€œporting to iPad.â€ AsÂ the worldâ€™s most powerfulÂ productivity suite, Office has tremendous breadth and depth, but we knew that bringing over hundreds of Office commands, toolbars, and dialogs to the iPadÂ would be, simply put, a mistake. A key measure of success for productivity software is: how productive are the users who are using this software? This means offering the right set of features appropriate for the device. The mobile scenarios we identified served as important criteria for our decisions about what goes in, what gets left out, and what has yet to be invented for Office for the iPad.
Based on these mobile scenarios, here are a few examples of what we put in. We included the top-most editing commands and one-tap visual galleries for instant and beautiful results that do not requireÂ repetitiveÂ steps. We included designer templates so your documents are beautiful and professional from the get go. And we also included best-of-breed track changes in Word and reviewing comments across all the applications. And, to help you take great notes, we included a significantly updated OneNote on iPad.
What we left out was based on these mobile productivity scenarios, too. For example, creating unweighted cross-tabulations withÂ PivotTables on your way to work orÂ adding cross-references to masterpieces like War and Peace onÂ theÂ commute homeÂ is not how most users use their iPads. The scenarios helped us focus ourÂ energy on the tasks that mattered most for the first releaseâ€”and it was liberating!
So whether youâ€™re reading through documents on your evening commute, putting the final touches on your way to your big presentation, taking notes in class, co-authoring documents with others, or hitting that fast-approaching deadline (such as for this blog post!), Office for iPad offers the tools that will get you there with the quickest and best results.
User experience goalsâ€”unmistakably Office, optimized for iOS 7
While the mobile productivity scenarios above helped us define theÂ â€œWhat,â€ we also wanted to nail theÂ â€œHow.â€ When we looked at how people were using existing productivity solutions on the iPad, we observed that many users found themselves being â€œperpetual beginners.â€ This means they found themselves spending more time learning the product than actually using it, which of course is contrary to the goal of productivity. So when it came to defining our user experience goals, it was important to us that users could just pick up our product and get started right away. With that in mind, our userÂ experience goals were:
- Familiar Office experience, with no learning curve
- Unmistakably Office, optimized for iPad
- Immersive and removes distractions
- Document content, not UI, takes center stage
- Experience is always beautiful, fast, and fluid
The purpose of a familiar Office experience is simple: a low learning curve and high user confidence. However, itâ€™s just as important to strike a balance between â€œunmistakably Officeâ€ and â€œplatform optimization,â€ which means optimizing for iOS platform conventions and touch-first user expectations. The most important, yet challenging, goal was finding the sweet spot between the essence of Office and iOS. Fortunately, since the Office for iPad and Mac team (formally known as the Macintosh Business Unit) is made up of Apple platform specialists, we were able to apply our deep knowledge of Apple platforms to the task.
Hereâ€™s how these user experience goals guided us in redesigning the Office Ribbon for iPad.Â We wanted the next-generationÂ Ribbon for iPad to offer the familiarity of the desktop, but be touch-first and slate-optimized. Time and again,Â I stressed the need for it to be â€œno heavier than a feather.â€ ToÂ achieve its thin and light-weight appearance, we tucked the Ribbon inside the standard iOS navigation bar and included only a single row of commands. We designed it this way to let youÂ easily browse the capabilities of Office, withoutÂ requiring you to unearth features buried deep inside menus. We didnâ€™t want to overwhelm users by showingÂ all of the depth of Office all at once. Thanks to the Ribbonâ€™s tab-based design, youâ€”not the Office for iPad teamâ€”get to decide what youâ€™d like to expose based on the task at hand. And, to enhance the Ribbonâ€™s overall fluidity, responsiveness, andÂ sense of direct manipulation, we added subtle animations.
We also added Quick AccessÂ commands toÂ the left and right of the Ribbon, so you can access the most commonly usedÂ globalÂ commandsâ€”such as Undo, Redo, Search,Â and Shareâ€”without having to switch to a specific tab.
Another keyÂ aspect of the Ribbon for iPad is that itÂ dynamicallyÂ adapts to theÂ constantly changing screen size and orientation, portrait or landscape. When space is constrained, Ribbon controls flow into popover menus with precise positioning. This ensures that the Ribbon for iPad is built for the future, because it canÂ scaleÂ nicely with the evolving Office feature set and adapt to new screen sizes.Â The Ribbon can also be fully collapsed, so when you just want to read your document, the user interface (UI) is â€œout of sight, out of mind.â€
Once the Ribbon and other basics of the suite-wide interface were defined, the designers and program managers across Word, Excel, PowerPoint, and OneNote worked closely together to incorporate applicationÂ functionality into this suite-wide user experience framework. Throughout, we were also fine-tuningÂ the core user interface elements to make sure theyÂ accommodated the rich yet highly diverse functionality across applications while maintaining suite-wide consistency. Â For example, Excel sheet tabs and OneNote section tabs reflect their distinctive app personality, but behave consistently when adding, naming, and scrolling through tabs.
In addition toÂ optimizingÂ Office for iPad for touch, we also wanted the visual display to be refreshingly modern and beautiful. The Microsoft Modern Language and Appleâ€™s iOS 7 design language share a commonÂ philosophy:Â a fierce reduction of complexity. This applies to the information architecture, but also to the visual language as well. With iOS 7â€™s more flexible theming capabilities, we were able to deliver the Unmistakably Microsoft, Optimized for iOS 7 experience we had intended. That meant stripping out extraneous detail and focusing on clear informationÂ hierarchy. OverÂ the course of designing Office for iPad, if there was a visual treatment or text label that wasnâ€™t absolutelyÂ necessary, we stripped it away. The result isÂ a clear information hierarchy, whereÂ everything is moreÂ functional and efficient, yet still beautiful in its own right.
Signature designÂ tenetsÂ from the Microsoft Modern Language include:
- Pride in craftsmanship
- Fast and fluid
- Do more with less
- Win as one
Each one ofÂ these tenets played an important role in our design process.
Pride in craftsmanshipÂ speaks toÂ the belief that when there is attention to detail, customers notice. The level of craftsmanship is further elevatedÂ since every pixel and every movement we rendered on the screen was also Retina Display ready. The result is that Office for iPad offers the crispest text and graphics on any version of Office yet.
Fast and fluid. With four times more pixels to render, the crisp text and graphics we were after required deepÂ engineeringÂ investments to ensure that the userÂ experience remainedÂ fast and fluid. This was especially true in the motion department, for example, for things like the spreadsheet grid â€œscroll bounceâ€ and gliding â€œcell selection animationâ€ in Excel. ToÂ achieve the best performance, we leveraged Appleâ€™s CoreAnimation APIs for UI animations; and the native Office AirSpace APIs for in-document animations.
Do more with less speaks to ourÂ belief thatÂ reduction is a creative act. WeÂ believe inÂ â€œcontent over chrome,â€ meaning that the usersâ€™ documents should always take center stage, not the UI. Â Shading or drop shadows were reduced to aÂ minimumâ€”and available only toÂ aid usability or conveyÂ hierarchalÂ depth on iOS 7â€”while remaining â€œfelt but not seen.â€
Win as one is about Word, Excel, PowerPoint, and OneNote for iPad offering coherent experiences that workÂ beautifully together. We didnâ€™t just stop with our iPad offerings. Collectively, we applied these cohesive design qualities of the Microsoft Design Language to ensure that function and form work together to exceed expectations.
Thatâ€™s the story of how we aspired to bring the gold standard of productivity to iPad, while setting a new standard for mobile productivity. I hope you enjoyed this journey of how we put Office at your fingertipsâ€”and I hope Office for iPad brings out your own creative touch.
from Office Blogs http://ift.tt/1qY8Zlk
Filed under: Office 2013