App Performance Monitoring Tool
Analytic & Performance Management Software | Enterprise UX | Agile process | Scrum methodology | 2 weeks sprint cycles
June 2015 - Feb 2016
OBJECTIVE
To design an app to monitor performance across any infrastucture and cloud and anticipate issues before they surface.
MY RESPONSIBILITIES
1. To prioritize features and functionalities and produce user friendly UX designs for a product.
2. To provide consistent interaction design patterns throughout the application and highest quality of prototypes and design
specifications.
3. To coordinate effectively with Project Managers and Engineering teams through iterative design process and make sure
everyone is on the same page.
PHASE 1. DISCOVER
I conducted user interviews to identified user tasks, goals, intents, and behaviors and find right problems to solve.
PHASE 2. DEFINE
Based on what I learned from the user research I have identified two users and their problems.
Primary user. Troubleshooter
Information overloading
“What is the most critical one?
I get too many alerts and events triggered everyday. I don’t know what to drill in first."
Hard to find bottleneck
“What are components and the line of code killing my app? It's hard to find a bottleneck. This takes a lot of time and effort."
Lack of contextual info
“Why is it happening?
I need to know why there is an error and
how is it correlated to other metrics.”
Secondary user. App Owner
Huge business impact
“Are there potential problems with my app?
I want to know of any issue before poor performance becomes a problem.”
Busy to look at details
“How am I doing?
I have a whole business to manage.
Don’t expect me to go to a detail level.”
Irrelevant info
“What should I know?”
Too much technical information are not very useful to me. Just tell me what it means”
DESIGN FOCUSES
1. Help users track every business transaction with data insights and summary for a fast diagnostic.
2. Help users prioritize critical problems and locate their cause without having to dig.
3. Help users identify root-cause down to an individual line of code to save time.
PHASE 3. DESIGN & EVALUATE
Since the scope and concept of the project continuously evolved because it was the emerging technology, I had to go over
a lot of trials and user evaluations, constantly communicate with engineering team, create low-to-high prototypes to
address requirements efficiently and effectively, and demonstrate interactive mockups to the organization.
1 Help users track every business transaction with data insights and
summary for a fast diagnostic.
Transaction Summary View: How am I doing?
Top 3 Transaction Views: What is wrong?
Data Table: What should I know?
Design Principle: Know what I am trying to say
When designing a dashboard, I focused on organizing it in a way that is accessible to users. For example, the dashboard has interactive views that guide users sequentially through each important piece of the story: total transactions, average response time, top 3 transactions, errors, transaction list. It was vital that the visualization had a purpose and I had to be selective about what I would include in the visualization to fulfill users' purposes.
Before
2. Help users prioritize critical problems and locate their cause without
having to dig.
Data table/Alert clustering: “What is the most critical one”
Relevant metric: “Why is it happening?”
Flow maps: “What are associated components affecting the system?”
Design Principle: Design Holistic Dashboards
When looking at a dashboard, eyes are usually drawn to the corner first. I placed the most important view at the top of the dashboard, or in the upper left corner. Unless there was an absolute need to add more, I tried to limit the number of views in the dashboard to 5-7. If I tried to add too many views, the big picture got lost in the details. Instead, I designed drill down pages or used multiple dashboards to tell another story and also make it customizable.
Users easily got overwhelmed by hundreds of alerts everyday and needed to figure out what is causing the issue and what are associated metrics. I solved these user problems by providing an alert clustering designs which help them navigate to the most problematic ones and resolve the issues right way.
Before
3 Help users identify root-cause down to an individual line of code to save
developer time.
Call Graph: “What is the line of code killing the app?”
PHASE 4. DELIVER
Design guideline using Zeplin
Hi-fi Interactive Prototype Using Axure
Video Storytelling
I created this video to focus on the needs, emotion, context, motivation of my target user, to keep those central to the strategy for the design and development of the project in a large organization, and to deliver business outcomes to customers and partners, in a simple and compelling way. I won for the storytelling competition ($1000 reward!).
