Jarvis - A Database Monitoring Tool

Project

Jarvis is an ebay application for database monitoring. It provides a 360 degree near-real-time and historical view of all eBay’s database events. Database events are virtually anything which happens to a database, including metrics about the number of active sessions, cpu load, etc.   

My role

I teamed up with three developers.

I worked on develop scenarios and task flows to conceptualize designs and create user experience specifications. I translated product requirements into interaction models. In addition, I was responsible for low-fidelity wireframes, high-fidelity clickable mockup and some widgets coding.   

Tools and technologies

Research: Competitive Analysis, Interview, Survey

Wireframe & high-res: Sketch 

Development: AngularJS,  Gulp, NodeJS, SVG, D3

Before I begin...

At the very beginning, I was not that interested in this project. The target users for this project are Database Admins & Engineers. I want to do more consumer-facing projects. But my manager told me, those technical employees are also consumers. There is no reason for them to suffer from those internal horrible apps and live a miserable life. We should try our best to foster better internal experience and then make their lives easier.   They expect the same ease-of-use and simplicity in their work tools they have come to anticipate in the consumer Internet.  

How Jarvis works?

Circle size represents the number of errors. The bigger the circle, the more errors that database contains. Emergency level are shown in color, red means it has problems. 

main item


Filter: sort by size.  Green means databases are safe.

main item


Take a closer look

Here are some screen captures from live code.

Collapsible Filter Menu


Config Metrics - a shopping cart-like checkout experience


Customize Time Range


Select Timezone

Behind the Scene

We did 1 Competitive Analysis, 2 User studies, 20+ pages of low fidelity mockups, 40+ high resolution mocks,  and 40+ rounds of code review. 

Below are some examples of design mockups.


Top Menu VS Left Menu - There are a huge number of filters. How to organize them become a big challenge.

main item

main item

main item

main item

main item


Logo Exploration

main item

Besides the design

Besides the design, I also worked on some widgets development, like time-range customization, metrics configuration and timezone selection.  The one that I feel most proud of is timezone selection widget, which allows users to select two timezones, and then calculate metrics/errors within that certain period of time.  I built this one from scratch. 

main item