Microsoft Office Developer Website Design

The Goal
Improve the information architecture and the content strategy to make the Dev Office website easier to navigate and provide more valuable content for its users.

The Problem

The website design was very clunky and ineffective at delivering the intended content to the userbase of Microsoft Office developers.

The Team

  • Project Manager
  • Software Development Manager
  • Software Developer
  • UX Designer

The Tools

  • Balsamiq
  • Photoshop
  • Illustrator

The Discovery
We began with workshops with the client, in order to better understand the goals of the project and how we could come up with a solution that served the content up more immediately and still keep the visual interest high, all the while adhering to Microsoft Office brand standards. We looked at their information architecture, analyzing their current organization structure and suggesting changes to improve it as well as what content they had and how that matched up with the content that their users were looking for.

The Process
This project was completed over many months and through many iterations, in a more agile approach. We tackled small chunks of work at a time, beginning with the homepage and the navigation. Making the website more mobile friendly was a high priority, so with each sprint we had to include both desktop and mobile to ensure that the website was fully responsive. Other pages got redesigned to be more effective in providing content that was relevant to the users, and new pages were added, including a getting started experience that was an interactive step-by-step process that guides developers that were not familiar with designing for Microsoft Office products set up an app for the Office product they are working on. Interaction design was key in creating this intriguing user experience to make it compelling for our users.

These sprints often started in talking with the client to understand her priorities and workshopping with her to understand the content of the pages. Wireframes were then iterated upon with directive from the client before moving on to finalizing visual designs using Office brand standards. In order to facilitate hand-off to the developers, usage notes were added in the wireframes, and the developers were provided with specific redlines to make sure the final product matched the perfection of the visual design.

The Final Outcome
The website design continued to become more clear and easier to use for developers interested in learning about developing apps for Microsoft Office products. As the user experience improved, the usage of the site increased and eventually the Microsoft team was able to manage the site on their own without our help.

This is a unique website which will require a more modern browser to work!

Please upgrade today!