Proteus

An innovative prototyping tool that emulates operating systems and contexts.
Designers and developers now have realistic, interactive storytelling tools.

Shaping the future of Microsoft prototyping

Opportunity

A small team at Microsoft sought to create an interactive prototyping platform allowing for rapid testing of new applications, operating systems, or hardware devices.

Proteus was created as a context simulator and storytelling tool for demonstrating complex interactions between apps and operating systems.

I joined the team to help grow the product, assist with branding, define the road map, and add innovative new features over 3 years.

Planning out the future

When I joined, the product was in a functional place and looked quite good already but lacked a lot of the features that the team had been dreaming of.
The Proteus tool could be so much more, but there was no concrete vision of what the next steps were or what the long-term plan was.

I interviewed the team and some of its users to get an idea of the desired features and user stories. Next, I did a thorough product audit, looking for inconsistencies or areas where the user experience could be simpler or more intuitive.

From all this I built a new Information Architecture diagram, taking into account all the features we were looking to add over the next several years.

The tool was split out into two main areas:

”The Launcher” which let users learn about Proteus, get into dev documentation, or pick a specific Scenario to interact with.

“The Emulator” let users interact with a Scenario, like clicking through a new version of Windows, rotating a device to see apps change shape, or changing the time-of-day and watching as everything entered Dark Mode.

I separated out all the features depending on if they should be accessible in the Launcher, Emulator, or both, and defined the navigation flow between everything. This provided a really long, detailed road map for the team to work through and keep a long-term vision in mind while working on short-term goals.


Adding Context

The first big feature to add was Time of Day. By adding in time controls our users could simulate real-world scenarios, like using their products throughout an entire day from morning to night, or across different time zones.

I designed the interaction as a user controlled handle along a timeline. By directly manipulating the slider the user could change the clock and see the ambiance of the scenario change with changing color and lighting effects. The goal was to give a sense of context to that time of day, while still keeping maximum focus and attention on the digital products being showcased.

The timeline could also act as a type of story-telling bar, where users could have key points or chapters where their prototype would highlight specific moments or features.

Adding depth

Along with feature improvements to the Emulator, the Launcher needed a lot of love. When I started, the only way to navigate between scenarios was a simple list, or by creating your own bookmarks. This worked for the meantime but would have problems scaling as we brought more users and teams into the product.

The creative vision for Proteus was to feel as if it were an organic, moving system that flexed to its users’ needs. As users progressed through the different areas of the site, they should always feel as if they were in the same world, but zooming in and out of content, or feeling as if the site were adapting to them and providing helpful tools when needed.

Out of this vision I broke the main areas of the site into distinct “altitudes” that the user would smoothly zoom in and out of rather than harshly navigate between.

After some user testing, the core user goals were found to be:

“I want to see my team’s stuff”

“I want to quickly try out a device or OS”

I highlighted these prominently on the Launcher, and added a level of hierarchy where users could view their team’s prototypes in a focused list.

&

Results

Proteus has been successfully used in many executive presentations and customer facing keynotes, helping to announce and promote new Microsoft features and products. New features in Windows and Microsoft’s web tools are regularly tested and compared by using interactive Proteus prototypes.