Designing Microsoft's First Blockchain Application

Called "Workbench", Microsoft's first blockchain application allowed users to configure and deploy a private blockchain, reducing development costs and increasing time to value from six months to one hour. 

The design challenge was: How might we enable enterprise customers to deploy and manage their private blockchains?

ROLE

Lead Product Designer

YEAR

2017 - 2018

USERS

Highly technical, early adopters of blockchain technology at Starbucks, Nestle, and 3M

Impact

With the help of many talented individuals, I took this solution from 0 to 1 in seven months, with its debut at the 2018 Microsoft Build Conference. Workbench was later used by Starbucks in 2019 to track the journey of coffee beans from farms to stores, giving consumers more transparency about their coffee's origins. It was also a featured product in the 2019 Microsoft Build Satya Nadella keynote. 

This was the first product I designed as a new UX Designer.

Process

1. Absorbed All I Could About Blockchain and Azure

I took online courses, read blockchain and smart contract white papers, researched the industry, and absorbed Microsoft's manuals for how to stand up a private blockchain on Azure.

Photo by Andras Vas

2. Created a Day Zero User Flow

I then diagrammed the App Admin’s day zero after initial discussions with my Product Managers. This led to deep insights that would help define the information architecture.

3. Determined the Contstraints

Microsoft set aside a limited budget for Workbench, as blockchain was a new initiative. These constraints are what made this project so wonderfully scrappy and exciting.

4. Outlined the Critical User Journeys 

Now that I had established the user flow and constraints with my Product Managers, I wanted to bring it back to the user. I started by writing out each user story in order to bring a human-centered mentality to the design process. 

This also allowed us to prioritize features, as well as track Product sign off and engineering work.

Implementation

1. Iteration - Whiteboards and Initial Wireframes

We were on an extremely tight deadline, so I met with the Product team for design reviews three days each week. This ensured we kept our communication open and there was team collaboration throughout the design process. 

2. Designed the Information Architecture 

I determined that the Workbench MVP would require three levels to its information architecture, allowing the user to dive further into their application and smart contract details with each layer.

3. Aligned on a Design System

Our users had strong familiarity with Microsoft Azure, therefore many of our design choices were influenced by Azure’s design patterns as shown below. 

Final Design

Applications View

This view is at the top of the Workbench Information Architecture. Each application represents a different industry or category. 

Contract Instances View

This is a view of each of the transactions within an application. Similar to Craigslist where each of these line items could represent a different product, for example a computer, car, or furniture.

Transactions View

And then each line item has details where the user needs to take actions on the transaction. I designed this hierarchy so that we can go from the big picture down to the minute details - and quickly jump between each view through the breadcrumbs.

Reflection

Being mentored by top design leaders and immersed in a supportive design community was a transformative experience. I gained hands-on knowledge of defining and building an MVP from scratch, which enabled us to launch on schedule. I also discovered the critical role of strong relationships in bringing Workbench to life, highlighting the power of collaboration.