JetStream is a web-based surveillance platform that enables security operation teams to protect what is important. The platform gives users flexibility in ways that legacy security systems never could. By allowing users to create custom views with all the tools they need right where they need it. Smart analytics keep your blindspots closed and automatically prioritize potential threats in a easily digestible interface.
In this project the focus was to restructure the platform's framework and optimize dashboard widgets to include better layouts and functionality.
12 Weeks, 2022
Product Designer
Project Lead
Research
Figma
Illustrator
Zeplin
Jira
Over the years the development team has developed a solid functioning front and backend for the platform, but have struggled to make it look and function a way their average user would understand. A common complaint was that users didn’t know how to simply navigate the UI since there was no clear hierarchy to navigate. Functions were buried into convoluted menus. Widgets didn’t give the users the info they needed.
As the market for data intelligence continues to grow in the surveillance space, the existing experience could no longer effectively support the business.
Creating a platform in the domain of security involves quite a few considerations. Based on the Product Requirements received from the stakeholders, I outlined the key tasks we had to accomplish for the MVP.
How might we build a new product framework that wont require retraining of existing users while empowering them with new tools?
How might we optimize dashboard widgets to show more useful and relevant information?
How might we lighten the cognitive load of users, but still display all the details?
Before the design process we needed to assess who our user base was. The company’s business model is primarily B2B and B2G meaning that our end users would consist of personnel hired by the client.
By looking into most security staff systems we found 2 user archetypes with their mapped day-to-day priorities.
They are the ones in charge of the day to day priority. Field staff will usually report to the Supervisors. Supervisors are usually based in security control rooms.
It is their responsibility to set the response priority and communicate clear and decisive information to field staff.
The admins oversee all the reports and data that are collected. They set the overall security procedures and response measures.
Mainly look over all the ongoing and completed reports. They make sure that everything is filed correctly.
Government (Local to Federal)
Infrastructure
Schools
Retail
Enterprise
Small - Medium Businesses
In the initial phase of the project, my PM and I took time to first take a look at our competitors. We studied our direct and adjacent competitors to get a sense of what we are missing in our market place. Through studying the functionalities offered by these applications, observing the recurring trends, and assessing their distinctive qualities, we acquired numerous valuable perspectives.
The process was initiated by first facilitating collaboration across multiple departments. The CTO, Project Manager, and Product Manager expressed their ideal vision of the platform. Out of many discussions had, we pulled a few points to focus on.
Creating a consistent UI framework makes it so users can easily navigate across the platform.
The player is arguably the most important piece in a security platform. Creating a player that puts the content front & center while giving the user countless functions is a big priority.
Widgets should have all the day-to-day functionality all built in to them. A user should never have to leave the dashboard.
This is a glimpse of the wireframe ideating phase. At this period we focused on formulating a framework in low-fidelity. It was important to first make the data streams understandable for the end user.
After creating the early wireframes we shared them with our end users. Our goal was to get key insights on what the users thought of the basic layout and whether the hierarchy of information made sense. The interview process consisted of video meeting and surveys where we asked pointed questions and for a general vision of what they’d like to see.
The following are samples of the interview process:
Navigation across the system and widgets is too convoluted
Information needs design hierarchy
More helpful search and sorting features within widgets
Make the framework more adaptable through side panels
Lessen the cognitive load by prioritizing what info is needed
A common pain point of the legacy UI was that the it was difficult to navigate because of no hierarchy in the menus.
With this new framework, navigating the UI is much clearer. By merging the navigation menu and the view selector into one nav panel it eliminated any confusion of what the view selector does. The new framework also gives the ability to add the Case Manager function to the panel.
Users reported their cognitive load levels decreased to a normal level as a result of not having to dig through nonsensical menus for daily tasks. The improved navigation resulted in 65% faster task to task navigation.
The concept of this panel is to keep users in the know of what is going on even when they’re not looking. Users can do other tasks, reports, and checks without having the risk of missing a potential situation. The panel displays all the relevant information. Non-video events show icon descriptors for quick glanceability.
A Case Manager summary is also shown in the panel for quick access.
Users reported that the panel allowed them to get other tasks done with much more peace of mind. Productivity on average increased 26.8% as a result of implementing this panel.
Users reported that the new widget design made their workflow more focused and eliminated distractions caused by navigating to other pages. Dashboard user retention increase by 54% as a result of widget optimization.
In the world a surveillance systems the most important piece is a good video player. Our core focus was to make the player as unintrusive as possible, while keeping all the necessary tools within reach.
Through a simplified layout and combining components together, the player has more room for what matters most, its content.
In cases where users need to get to a device, setting, or report quickly the Quick Search function comes in handy. It allows users to use short key words to effectively find anything they are looking for through out the interface, so no need to dig around.
Users found that they took advantage of deeper setting since they could find them easier. Users found it every helpful that they could search by device names and quickly find related reports and cases.
Working on this dashboard project was quite interesting in the aspect that stakeholders wanted a complete UI/UX overhaul but wanted it to stay familiar for training reasons. Throughout the design process I needed to find that balance, while evolving the experience into something fresh and more useful.
Starting with reviewing the platforms framework and navigation, we found lots to restructure as many components were too compartmentalized and missing relation. After finding that sweet spot the widgets were next. One of the major stakeholder goals was to keep users retained to the dashboard as much as possible. Through careful prioritization of what features and preferences were necessary, we were able to integrate most aspects of user's workflows into the widgets without making it overwhelming.
Stakeholders and users will often think its best to pack as many features as possible into one place. Thats the case of what happened during the design process of the widgets. What happens is when given too many options users quickly get confused and make rash decisions. The best thing to do is talk with your users, find what they use the most, and narrow it down.
When reworking an existing product the ideation phase can sometimes go out of hand. Stakeholder want to pile on features, they want the whole nine yards. Its easy to get lost in all of it but every designer runs into the reality check, the developers.
As product designers we learn a lot about prioritizing user and stakeholder needs, but very little about how we should work with the people that essentially piece everything together. Understanding what are the developer's constraints and preferences are makes for a much more dynamic design process. It minimizes back and forth semantic conversations as both the designers and devs know what the other are capable of.
