To view all the professional projects, click here
This project consists of the enhancements that need to be added to vManage Dashboard with the focus on improving the already existing security dashboard widgets and suggest the addition of a few more new widgets. It is an essential component in building and securing the customer network. The more data points we add to the dashboard, the better Cisco SD-WAN stands out against the competition, and more importantly, this will increase customer adoption of the solution.
1. Understanding the requirement doc. with PM
The PM and I did a few early requirement analysis sessions where we discussed the goal for every dashlet, what we wanted to improve and the new flow leading to its details.
I created a questionnaire for every dash let on the dashboard with following questions:
What is this dashlet about?
Why are we designing this dashlet (goal/purpose)?
How are we achieving the goal?
Edge-case scenarios?
Data requirements?
The PM and I completed the questionnaire which helped me get better understanding of the requirements
Dashboard Brainstorming
Requirement Document
2. Analyzing the existing dashboard
The PM and I also analyzed the existing dashboard while discussing the requirements. Below were some of the problems we discovered:
a. The info on dashlets was not meaningful
b. Lack of ability to drill down to find important info
c. Lack of context and hierarchy that resulted in confusion for the user
d. The data, overall, didn’t make much sense!
Existing Security Dashboard
3. Research - Persona
I referred the ‘persona repository’ created by user research team for the Sec-Ops (Security Operations) user. There were different roles for the SecOps user - Chief Information Security Officer, Security Manager, Security Analyst, and Security Operator. I listed the common responsibilities, painpoints and needs across all the roles and created a ‘Generic SecOps User’ persona for the dashboard.
SecOps User Persona
3. Research - Competitive Analysis
I studied the security dashboard examples of some Cisco competitors and other Cisco applications that deal with network security to draw some inspiration for the design
References
Competitive Analysis Synthesis
5. Information Architecture
I created a sitemap of the dashboard and listed the widgets with its link to various pages within the vManage application. It was important that the dashboard leverages already existing UI and only create new UI, if necessary, to avoid duplication.
The sitemap was peer-reviewed multiple times before it was finalized.
(Click on the Info Architect image to see it full screen)
Dashboard Sitemap
6. Initial Design
After requirement analysis, I created a black and white sketch of the UI with temporary data to explore different dashboard flows and overall layout and presented it to the PM. We went through several design reviews with the TME (Technical Marketing Engineer) and the Dev team to finalize the dashboard design.
Security Dashboard
Firewall Enforcement Details
Final Design
Final design is created in Figma using the ‘Cisco’s cohesion design system’ components.
It consisted of the following userflows:
a. Customize the dashboard
b. Hero bar navigation
c. Cross-launch links to Cisco’s other security applications - Talos, SecureX
d. Six dashboard widgets and links to their details
(Click on the individual pages to see them full screen)
The development of the dashboard design is in-progress.
The phase 1 of the dashboard design has been approved by the VP of Engg. Currently, we have outlined the requirements for phase 2 of the security dashboard where we plan to simplify the design further by giving the user only the necessary data and reducing the number of clicks. We plan to do detailed user-research on phase 1 design before beginning to work on the phase 2 UI.
This project was one of the first major projects at Cisco where I was the lead designer. I took responsibility of the delivery process and it was a huge learning experience. I am really looking forward to working on the phase 2 UI with even a bigger support team next year.