Re-imagining the shopping experience for Microsoft Office.
Year

2018

Client

Microsoft Office

Role

Art Director

Conceptualization, Positioning, Customer experience, Web design, Photoshoot, Marketing

My Impact

As an Art Director, I lead a team of designers and copywriters to strategize, reshape the retail experience, and create concepts for the campaign. I was responsible for deciding on the methodology, research tools, and pace of the project to deliver an improved customer experience on time and within budget. Also, I supported directing the photoshoots to ensure they were on brand, tell the campaign story, and showcase the product in the best possible way.

Office 365 product page on desktop and mobile with new photography style

Background

Every two years the Office product team revises the in-store and online printed collateral. They take the time to look at all the different assets and challenge their status quo. The Office product team asked our agency to help with this improvement process. The research indicated that most customers are confused between the perpetual and subscription options of the Office product offering. The layout of the existing collateral was hard to decipher, leaving customers confused about which SKU they should purchase. Research has shown that over 60% of buyers choose an inadequate Office product.

Goal

Re-think the in-store and online assets to support the customer journey and improve customers' understanding of the product options. Reduce the number of mistakes at the point of purchase.

7 process steps: 1 synthetizing research from the marketing team, 2 analysing assets in relation to the four stages of purchase, 3 Field research of the current purchase experience, 4 creation of user personals and journey maps, 5 iterating on key assets to define approach, 6 testing the assets in purpose-built shop environments, 7 applying changes and flowing them into all the assets

Process

As the first step to gaining insights, we went for field research. We went to different stores that sell Office products, collected information on what kind of assets they have on display, and interacted with customers and shop staff. We found that many people recognize Word and PowerPoint products but are not as familiar with the Office as the overarching umbrella for many products.

The field study led to the definition of two primary purchase scenarios and associated personas: a primary persona who decides to purchase the Office product when buying a new device and a secondary persona who goes to the store intending to buy an Office product. The next step was to define user purchase experience flows that represented the behaviour of the personas. We used two hero assets to test the main scenarios and how they help navigate the Office SKUs.

 Field study images from different shops and user experience flow with main pain points and a map of all the assets in customer purchase experience phases to find gaps and opportunities
Iterations of the hero asset designs: sketches, wireframes, and high fidelity mockups
Final office 365 hero assets with large photography, bringing in the human aspect

Solution

We worked closely with the Office research team, performing usability tests and checking which assets would be the most successful. For instance, an evaluation of an advert stimuli study has shown that people browsing social media websites are more likely to notice a lifestyle-style banner over other types of banners. On the other hand, when browsing products at online shops such as BestBuy, adverts with the product mocked up on a computer screen drive the most clickability. Words are critical in driving conversion. Referring to Office rather than a new feature makes people more prone to click. All these considerations were taken into account when creating the final layouts.

We have learned that the videos on the landing site need to be featured on the top of the page to get clicks. As a response, instead of zig-zagging users down the page, we made a featured video screen with the hero video. We created a visual thumbnail ribbon of the new product features underneath the video. Further usability tests confirmed that this approach was more successful.

Progression of web assets: from iconography to simplified layout and large photography and videos showcasing the product
Animated banners with few text options
Office 365 product detail page on mobile
Office 365 iterations for posters: focusing on step-by-step decision-making, side-by-side comparison, and recommendation of 365 over other versions