Wireframe redesign of Azure solution gallery

This site was designed in June 2018. My role in this project was to deliver wireframes of the solution gallery based on the results of user research and requirements from product manager and engineering team.

What is a ” Solution “

“Solution” could be seen as a package of products based on a scenario. Most of the cloud users are aware of this term.

Background

Why we need a solution gallery? Solutions on Azure.cn now are developed by each product team. Each team independently developed the content and this resulted in great inconsistencies. Moreover, some of the solutions overlap with each other and the categories frequently lead to confusion. The content should be updated as well. Therefore, we are in desperate need of a new solution gallery.
Cooperation with Bebit. The project started in the middle of April when we launched the user interviews with the cooperation of Bebit. They recruited target users, conducted the interviews and delivered the persona, the pain points and user journey map. I participated in 4 rounds of interviews where I observed the user behavior and listened to their comments and opinions. Below are some of the interview records.

User research

Find the target users through the survey. We plan to have 8 interviewers with 2 dimensions. A survey was conducted to filter out users that didn’t fit out requirements.

Successfully purchased products within 6 months
Compare Azure, AWS and Aliyun when purchasing, at least compare two of them
No more than 3 users from vendor
Their needs are complicated and not precise. This tends to be the most common reason why users choose solutions instead of individual products.
Find service provider mainly through the official websites.
Products or solutions they were interested in are more likely in business intelligence, big data and analytics, retail and manufacturing.

User interview and observation. Below are part of the questions asked in the interview, my list of questions also included, and the record I made during the observation.

Analyze the data, find the similar patterns, formulate persona and create user journey map.

Here is the summary. Users visit the solution page when their need is complicated, and IT has no experiences to develop a solution. Otherwise, they visit the product page because they clearly know what they should buy and how to build it.

There are 2 Personas and their journey maps as below.

Their pain points and thinkings are clearly shown on the map.

A website plays an important role in the solution researching phase for both IT and business users. And the architectures have great influences on IT users and can significantly influence their conversion.

Competitor analysis

I also had done the competitor analysis and listed questions and hypothesis based on it before the interview. Below are the summary and a few slides in the report.

Solution Design Competive Analysis-201801_页面_06

Wireframes and card sorting for navigation

I designed the new solution gallery based on the learnings from the interview and the competitor analysis.

Information architecture and wireframes

Below is the template for the solution gallery. It is much like the wireframes, just more details for writers. Most of them are from service teams or architects, do this was a cross-team collaboration. The detailed definition is super important for us to achieve consistent and rich-content solution gallery.

Here are the key takeaways from the wireframes.

Users prefer a landing page instead of the top navigation. Keywords or phrases that users are familiar with are sufficient on the page and there is no need for detailed description.
Keywords and phrases are also popular for the features of a solution. Both business and technical orientation are good for features, including how to help customers with cost control or when extraordinary technology is applied.
Show technical architectures in the most critical position with the largest area. They are incredibly important for the IT users. It is even the standard to judge whether a solution is good or not from the interview. Although IT users have technical background, they still can’t figure out complicated scenario implementation themselves. They have to rely on the architectures.
Show the total price for a solution package and allow expert users to calculate themselves based on the package settings. Almost all the users aren’t as sensitive as expected for the price in the beginning stage. It is OK as long as it is within their budget. An estimated total price is sufficient. Users don’t need to be distracted by additional parameters of the services.
Provide step by step guidance and correlated documentations with the architectures so that IT users could explore it of their own. The dev tools, SDKs, API, extensions are listed, as well as the operation guide which tells users the most frequently committed mistakes here. Related webinars and courses at Azure School will help the beginners ramp up much faster. All the things above lower the difficulties of complex scenarios building.