Cyber Portal
A global data claims portal for underwriters and customers
Skills
UX Design
UI Design
Design Thinking
Project Management
My Role
I joined a team of 3 others Including 1 Product Owner and 2 Business Analysts in February 2020 with the goal of integrating the Malware Detection features into Cyber using the Agile framework by the end of the year. I was responsible for executing meetings and collaborating with my team to gather user information, develop strategy and synthesize business requirements into modern, user-centered designs. In addition, I ensured a timely delivery of accessibility-approved wireframes and coordinated communication with the development team to produce a working prototype.
Background
Cyber Portal is a global tool developed to aggregate cyber data from various sources – both internal underwriting and claims systems alongside external sources. The portal provides cyber information and cyber analysis for a given company to the customer or underwriter. There are 4 faces of Cyber, each coupled with its own dashboard and features, depending on the user:
Cyber Portal (internal) is provides Cyber information and Cyber analysis for a given company to the underwriter through a dashboard
Customer Portal Prospect (external) is for customers who don’t have bound coverage in which we provide an Executive Summary Report
Customer Portal Client (external) is for customers for have bound coverage in which we provide an Executive Summary Report
Customer Portal Cybermatics (external) is a premium feature provided to customers where the security vendor is integrated, we receive data from them and in return, provide them with real time score
URL Verification
& Malware Detection
Discovery
I like to begin every project by getting down ‘n dirty with curiosity about the space I’m working in to get some background, provide insights and inform future decisions. When tackling Cyber’s new features, I began by attending ongoing meetings with the business, understanding the information architecture of the current system and asking questions to dive into the complex world of cyber claims until I felt like I could really talk the talk.
Define & Research
Now here we are, ready to walk the walk. After I learned the ins and outs of the current tool, I needed to understand the business needs for feature 1: URL Verification & Malware Detection. The end goal for this feature was that our underwriters needed to be able to initiate a malware scan request and view the status of a malware event on the portal dashboard when an event was detected on a given account. The requirements for this feature stated that the underwriter needed to be able to enter URL information for an account, verify URL, answer questions, receive a scan recommendation and initiate a scan request. The requirement also included a request for the user to be alerted when malware was detected and for our underwriter to add/manage an Account Watchlist.
After I get an understanding of the space and the requirements, I like to dive into research. What’s currently out there and can I immerse myself in it or experience it myself? What about those systems are working or not working? Has this requirement been solved before and how did users respond to it?
Ideate
URL Verification: After the requirements were clearly defined, I started with URL Verification because this process would initiate the content for Malware Alerts. We know that our user needed to be able to verify a new URL in order to initiate a scan request, however we didn’t know what this process looked like yet. I began to ask questions and draw up a user flow in order to get a better idea of what this could look like and to better understand the process our underwriter was taking. Where in the current process could this features be integrated to achieve the most efficient solution? Is this a multi-step process or can this be done in one full swoop? What is the hierarchy of information necessary to retrieve this information from the user?
Some of my first iterations for URL Verification included the ability to walk through each step right from the dashboard, allowing our user to achieve this task without leaving the screen (shown left).
Malware Alert: I began with researching different ways a user could be alerted, aligned with the component library and brainstormed different ways this feature could prompt the user and integrate into the current system. How important is this to our user to see? In what ways could they receive this status and how important is it to know at which steps in our underwriters workflow?
Some of my first iterations for the malware detection included a hover feature, funneling the Active events and Scan in Progress events into their own categories, in addition to an accordion feature. However, after some discussion and user flows, we decided to show the specific event request name with an Active or Scan in Progress label (shown below) as opposed to a hover status reveal or accordion because we wanted to decrease the amount and clicks/hover movement and increase ease of visibility and access.
Prototype
In the ideation phase, we discovered that our underwriter needed to complete this process in steps to ensure a newly entered URL was verified, Bitsight details were added and that both were saved correctly . In turn, the solution to this was to use a modal window with a multiple step process that would allow our underwriter to save a URL verification with Bitsight details and continue on to initiate a request or save and exit.
We also uncovered that malware detection alert was a high priority to our user and they needed to be notified in 3 ways: upon visiting an account, on their Cyber Overview dashboard (seen in left photo) and globally (seen in left photo) in case they were working on any other pages. This discovery led to the creation of another feature called the global Notifications tab which we intended to use for additional feature notifications in future versions of Cyber.
Malware Alerts
Modal
When an underwriter visits any given account where an active malware event has been detected, they will receive a modal window alert informing them right away. The window also requests that our underwriter confirm the notification, in turn ensuring that it wouldn’t be missed. This modal window only alerts the user when they open an account’s page and not if the underwriter has already been working within the account. The purpose of this is to not interrupt our user during their workflow.
Cyber Overview Dashboard Event Status
After our underwriter has initiated a scan request (seen below), they will be redirected to the Account’s Cyber Overview Dashboard where they can quickly view the status of which they’ve just requested. This takes any mystery out of what steps they’ve taken to detect malware for a given account URL.
Notification Panel & Icon
If, perhaps, the user is working on another page within the account and a malware event has been detected, they will receive a bubble on their notification icon that, when clicked, will reveal the alert notification. The user also has the ability to view their notification history modal window by clicking the blue view additional page icon in the top.
Additional Feature Components
Add Account to Watchlist
In addition to verifying the URL, the business required that we incorporate a Watchlist function. The purpose of this is to allow our underwriter to add a given account to their watchlist, in turn allowing them to receive emails with updates for the accounts they’ve requested to include in their Watchlist.
Manage Watchlist
In addition to this functionality, our user needed the ability to view and manage their watchlist from one place. Seen above is the modal window which allows underwriters to do just that, in addition to turning all of their watchlist notifications on or off. This modal can be accessed by clicking the User settings icon in the top right corner of the global navigation and choosing Manage Watchlist.
View Active CVE Remediations
In the process of defining the different forms of Event Status’s we needed to present to our underwriter, we uncovered that the Active CVE status pertaining to Bitsight had additional important information to display. Here you can see the expanded view and hover of a few of these CVE’s.
Challenge
One of the challenges I tackled while working on Cyber was transforming the tool through the release of AIG’s new branding guidelines with emphasis on a new approach to accessibility requirements. In turn, it became a priority to reevaluate all of the tool’s current color systems and text formatting in order to adhere to the new accessibility requirements and brand guidelines. This involved an in depth look at each feature, screen and document attached to Cyber, testing for any formatting that didn’t pass the accessibility requirements and providing passing specifications to the development team to ensure a seamless approach to successful accessibility.