Redefining security visualization with Hollywood UI design
Most security interfaces today leave a lot to be desired, and many security pros are gaming enthusiasts, accustomed to a sharp and engaging virtual world.
ProtectWise CEO Scott Chasin and CTO Gene Stevens wanted to give them a helpful security tool with an interactive visual dashboard that looks straight out of Call of Duty.
The company, founded in April 2013, recently came out with Cloud Network DVR, a virtual camera in the cloud that records everything on an organization’s network. It allows security pros to discover threats in real time, and check out recorded historical data to uncover threats that were previously unknown using the latest intelligence.
The solution has a Wisdom Engine, which analyses all this network traffic data by dissecting netflow using deep-packet inspection, identifying and classifying threat events, and correlating the findings with threat intelligence from third-party sources.
But the thing that will delight those who use it most is the user interface.
“We wanted to give security professionals full visibility into their network and a way to quickly recognize patterns and interact with massive data sets. We wanted to create something that security professionals, incident responders and network operations teams would want to interact with,” Chasin explained.
The UI is called ProtectWise Visualizer, and its creator is Jake Sargeant, FX pro and a visual designer at MN8 Studio. If his name sounds familiar, it’s because he was the Lead Animated Graphics Artist for the movie TRON: Legacy.
“My cofounder, Gene Stevens and I initially approached Jake because we are huge fans of his work on the movies TRON: Legacy, and Oblivion (starring Tom Cruise),” says Chasin. “I love the movies’ concept of total immersion into a data landscape. The idea of the grid coupled with CGI and how the characters visualize data in these movies is very compelling and inspiring. This is the concept we were going for with the visualization of massive sets of network data, and Jake completely understood our desire to provide a UI that allows for immersion in data.”
They met with Jake and explained what types of data they wanted to visualize – network connections, an attack spiral, a timeline, a priority view of security events.
“We’d discuss how to provide situational awareness in a beautiful interface that offers both an at-a-glance view of data at scale in a way that is actionable, so a user can quickly get a pulse on overall network health and pivot into a deep dive on a specific security event,” he notes.
“We really like the idea of interfaces that give you a lot of data and enable quick pattern recognition – like the Ironman suit. Ironman didn’t have to read every piece of data, he was just able to observe it, quickly recognize patterns and act on the information,” he explained. “Together we’d iterate on the designs.”
Sargeant saw that there was a massive amount of real data to visualize, and accepted the challenge of creating an interface that’s intuitive, structured and not visually overwhelming.
Computer GUIs found in movies are notorious for favoring interesting visuals at the expense of usability.
“On a real product like ProtectWise, it was a much more detailed process of understanding and then interpreting the data visually. It was a welcome challenge and contrast to sci-fi interfaces where I had to think about someone using this product on a daily basis,” Sargeant notes.
“I’d say the most significant challenges working on the interface were the two main circular visualizations on the Heads-Up Display (HUD) that feature front and center in the interface – network connection monitoring graph (to the left) and the attack spiral (to the right). I spent the most time with Scott and team working on these two sections and am really happy with how they implemented it in code for web browsers.”
His toolset for creating the visuals were Adobe Photoshop, Illustrator and AfterEffects. He used Basecamp for project management, and the Internet for “a ton” of data visualization research.
“Today, we have a team of in-house UI designers that continue to implement Jake’s creative direction on the Visualizer,” shares Chasin. “We are still working with Jake to push the envelope in terms of what an effective network security user interface should look like and I’m excited about some of the new capabilities we’re working on. It’s exciting stuff and an area where we are committed to deliver continued innovation.
The solution’s beta testing phase begun in early 2014 and officially ended in April 2015. Fifteen companies of varying sizes and across industry verticals including media and entertainment, technology, financial services, and healthcare participated.
“One of the unexpected, key learnings that came out of our early access program was how valuable the pervasive visibility our UI provided not only to security analysts and incident responders – users we’d targeted from the outset – but the value it provided for network operations teams. For many on the network operations side of the house, this was the first time they had complete visibility into what was happening on their network,” he pointed out, adding that they suggest to customers leave on the default full packet capture setting for a few days after initial deployment (before going in a policy-configuring the sensor) just to get a sense of the types of traffic on their network.
“I think until now it’s largely been a very pragmatic, bare-bones approach to visualization for security products. Most of the UI design in network security products is sorely lacking in imagination and they do not provide the level of visibility security professionals require. Honestly, a lot of the UIs are more reminiscent of the interfaces to set up a router than to detect and respond to advanced threats,” he noted.
“In a day and age where an increasing number of the workforce, particularly the IT workforce, is raised on the powerful visualizations found in gaming, they expect this type of visualization in advanced technology services.”