Office.com

Office.com began as a simple launch page, but evolved into a comprehensive platform through collaborative efforts with various product teams and partners. With my contributions in strategy, information architecture, and user experience/interface design, we successfully transformed the Office experience, enhancing it from both vertical and horizontal perspectives. The result is a new and improved Office.com that excels in UX/UI excellence and maintains a coherent user experience throughout.

What is Office.com?

‘A great wayfinding tool for helping customers get back to their apps and relevant files’

Office 1.0

New Information Architecture

2019 - 2020

How can we evolve Office, and bring our customers along the journey?

Our goal is to develop a captivating, user-friendly productivity solution that empowers our users to stay focused, feel competent, and exude confidence, whether they are collaborating with others or working independently. By creating an intuitive and engaging platform, we aim to assist users in achieving their objectives and aspirations with ease.

My role

I played a crucial role in redesigning and implementing a new information architecture (IA) for the Office app. Working closely with product managers, researchers, and engineers, we ensured end-to-end (E2E) implementation of the new features. I pitched and presented my ideas to the leadership team (LT), effectively communicating the vision and value of the changes. Our efforts resulted in successfully shipping the new features, enhancing the Office app's functionality and user experience.

Business asks and considerations

Obtain new customers but not lose existing

With millions of customers visiting our site, we had a difficult task to make design changes that would maintain customer engagement and increase retention
“Don’t move the cheese”

The leadership team emphasized that we don’t introduce new design changes that would be too hard for customers to follow, but at the same time set the fundamentals for a North Star beyond 1st upgrade
Coherence across other products

Take into account our identity as a product but also our new role within the Microsoft 365 product portfolio

The Information architecture evolution

Before

After

Info and decisions

Consideration kept in mind were:

Made sure to address customer frustrations
Checked that design proposal mapped to user Jobs to be done (JTBD)
Utilized past and recent research insights

The design suggestions were:

Create a navigation by utilizing the app tiles
Distinguish ‘core’ Office experiences from other apps
Bring the content higher in the viewport area

Design evolution

Customer feedback

“ I very much like the new design. I often forget about online docs because I just go to 365 for my email, but now I will have the tabs on the side to efficiently switch back and forth.”
“There are more things on the page, so I have to do less scrolling to find what I'm looking for.“
“It looks cleaner and more organized”

Office Hub 2.0

Design facelift and new features

2020 - 2021

What is the soul of Office that can bring value to customers?

To achieve our goals efficiently, we held multiple design sprints to identify key areas for our 2.0 release announcement at Ignite. These sprints allowed us to enhance existing features, introduce new additions, and deliver a compelling release that resonated with our audience.

My role

As a design lead, I led or co-led most of the design sprints for our 2.0 release. During a 6+ month period without a manager, I provided support and guidance to the design team. This included task tracking, refining research processes, facilitating connections, mentoring team members, and onboarding new members. Our collective efforts resulted in a successful end-to-end (E2E) product release.

Role and contributions

Short term and long term flows

I contributed to the development of both short-term features announced at Ignite 2021 and long-term features planned for the following year, working on end-to-end implementation.
Digital design sprints during a pandemic

I led and co-led multiple digital design sprints with the goal of exploring and inspiring different formats for the product's future direction. Working closely with the design and research teams, we discovered innovative possibilities and envisioned exciting paths for its evolution.
IC + leader role

In the manager's absence, I took on leadership responsibilities, guiding and supporting my design teams to maintain focus, organization, and progress. I facilitated effective communication and fostered team connections, driving productivity and cohesion.

The Information architecture evolution

2.0

Cross app design coherence

App bar 1.0

Inconsistencies with sorting order, icons style/size, colors and states
App bar 2.0

Sorting order with core apps up top, followed by launching apps below
Updated visuals to Fluent icons, brand colored states, and neutral grey backgrounds