2022
Role
User Experience Design Intern
Services
User Interview
User Experience Design
User Interface Design
Prototype Design
Collaborators
Yingying Sun
Jaeyon Lee
Microsoft Web PubSub Landing Page
The Azure Web PubSub project marked a key initiative in advancing real-time messaging services, aimed at transforming how data is shared across web and mobile platforms. As a premier entity in this sector, Azure Web PubSub focused on elevating its digital presence by spotlighting its sophisticated technical features, especially those catering to the Metaverse.
This endeavor involved an extensive overhaul of the landing page to accentuate the latest enhancements and functionalities. The redesign prioritized user experience, incorporating responsive design elements and highlighting Azure Web PubSub’s state-of-the-art technology.
As the Designer, my responsibility was to develop and execute a design that was not only aesthetically engaging but also highly functional. I ensured that the landing page effectively communicated the service’s value and capabilities, simplifying for users how it could meet their demands.
The problem we are facing
The current landing page fails to highlight the latest updates
The current landing page fails to highlight the latest updates to Azure Web PubSub's technical capabilities and its new features designed to support the Metaverse.
The noticeable decrease in user traffic to the landing page recently
Recently, there has been a noticeable decrease in user traffic to the landing page, and the conversion rate has fallen short of our expectations. We need to implement strategies to enhance the customer conversion rate.
None of the members in the team is familiar with AR/VR design
In order to demo the newest product capability, I have to learn Unity and AR/VR development from scratch within a limited time.
Outcome
Increase User Traffic 6-7%
"Since the website's relaunch, the landing page has observed a monthly increase in visitor numbers of 6-7%. The team eagerly anticipate attracting even more potential users to Web PubSub's services."
Build Metaverse Demo from 0 to 1
I learned Unity design and development within 3 months and built our first Metaverse Demo from scratch.
User Interview
“Mainly through internal referrals and a small percentage through customer’s self-nomination.”
—— FastTrack Team, EU
“FastTrack would like to be ahead of customers about Azure services. It would be great if the documentation can help them quickly build a mental model and provide ways to quickly hands-on experience.”
—— FastTrack Team, EU
“In the world of technology, engineers don’t want to talk to salespeople… We are not buying shampoo or soap to see which one is cheaper. We want to understand how the technology should work for us and how to use it.”
—— Action Technology Group, UK
Design Chanllenge
How could we keep updates with our internal consulting group
How did we persuade our prospective engineering clients to trust our product
How might we supply instant support for our consumer?
Desktop Research
After establishing the design direction, I embarked on a competitive brand analysis. This involved closely examining several service providers that offer similar real-time messaging services, notably ably and PubNub. My analysis focused on identifying the features presented on their websites, observing the design and layout to understand how they address user needs and questions. Additionally, I catalogued the features of the Azure Web PubSub website. This allowed me to directly compare Azure Web PubSub's strengths and weaknesses in a clear and straightforward manner.
From analyzing customer feedback and user studies, it became clear that our primary users consist of two separate categories: managers, those who handle buying choices, and engineers, who oversee the associated implementation. Consequently, the solution zeroes in on resolving the pressing inquiries: 'What does Web PubSub mean, and what's its application?' and 'What's the initial step?' My goal is to significantly improve the navigability of the service landing page.
Redesign the Landing page
Virtual Space Demo site
Product Documentation
GitHub page
After thorough analysis and discussion, we have identified four key user touch-points for managers and software engineers conducting desktop research: the Azure Web PubSub service landing page, the Web PubSub demo site, product documentation, and the GitHub page. Our goal is to ensure that users can swiftly find the answers to two critical questions in the least amount of time, regardless of the touch-point through which they encounter our servic
For Engineer
New Information Architecture provides One Click access to development resource
“Quick start” and “Resources and support” can help users find the start information and debug information quickly.
For Engineer and Manager
Swiftly grasp the product's capabilities
By incorporating interactive components, such as a list highlighting Web PubSub's key features, both managers and software engineers can swiftly grasp the product's capabilities. For each feature listed, links to detailed documentation are provided, facilitating easy access to in-depth information.
For Engineer and Manager
Flowchart build mental model quickly
A flowchart is provided to illustrate the process of deploying Web PubSub across various systems. This visual aid enables software engineers to assess quickly and efficiently whether the feature can be integrated into their existing system.
Takeaway
In this project my key takeaways are from three aspects:
