Improving the Usability of Large Scale Graph Visualisation

Case Study: Identity Access Management (IAM) Graph

Background:

In computer science and mathematics, a graph is a data structure consisting of a set of nodes (also known as vertices) and a set of edges that connect those nodes. The nodes represent objects, and the edges represent relationships or connections between those objects.

Graph visualizations can be complex and cluttered, making it difficult to identify key relationships and patterns. The layout can be challenging, and interactive features can introduce additional complexity.

The graph should be able to feed the engineering requirements for front-end development. However, sparse representation of the graph may lead to slow front-end rendering of the graph, affecting the overall user experience. It may also cause limited visibility of the graph, making it hard for users to navigate through the graph.

Product Goal:

  • Improving the visibility and usability of large and scalable data graphs.
  • Decrease the time needed for large scalable graphs to load on the front-end.

Challenges:

As a new designer that just joined the team, I was weak in cloud domain knowledge and had to take some time to learn the cloud domain knowledge as well as what Identity Access Management (IAM) is, how the permission can be granted, and how the inheritance of permission works in IAM. I was also the core designer working on this feature from ground zero.

Success Metrics:

  • Users spend lesser time looking for what they need in the graph.
  • Users can clearly visualize all the nodes and edges in the graph.
  • User satisfaction for the decreased time needed to load the graph on the front-end.
Real-world Applications of Graph Visualisations
  • Social Networks: Social networks like Facebook, Twitter, or LinkedIn. By representing each user as a node and each connection as an edge, we can visualize the entire network and explore different patterns of social interaction.
  • Fraud Detection: Large graph visualizations can be used to detect fraudulent behavior in financial transactions. By representing each account as a node and each transaction as an edge, we can detect patterns of behavior that are indicative of fraud, such as money laundering or insider trading.
  • Network Security: Large graph visualizations can be used to analyze network traffic and detect security threats. By representing each device on the network as a node and each connection as an edge, we can visualize the entire network and detect patterns of behavior that are indicative of an attack, such as a denial-of-service or a malware infection.
Frame 625807
Image 2
Image 3

Image sourced from Web. Credits to the original owner.

General Issues with Graph

Graph visualizations can be complex and cluttered, making it difficult to identify key relationships and patterns. The layout can be challenging, and interactive features can introduce additional complexity.

The graph should be able to feed the engineering requirements for front-end development. However, a sparse representation of the graph may lead to slow front-end rendering of the graph, affecting the overall user experience. It may also cause limited visibility of the graph, making it hard for users to navigate through the graph.

Case Study on Identity Access Management (IAM) Graph
figure-11-risk-2-scaled

Ermetic IAM Access Graph

IAM Access Graph is a visual representation of the relationships between Identity and Access Management (IAM) policies, roles, users, and resources in an AWS account. It shows how permissions are granted or denied, and how they are inherited or overridden. It can help identify potential security risks or misconfigurations and can be used to troubleshoot access-related issues. Overall, the IAM Access Graph helps AWS users understand and manage access to resources in their accounts.

The Challenge

Designing a scalable graph for users to visualize the relationship of IAM users, policies and resource in a user-friendly way.

Team

2 Backend Engineers, 1 Frontend Engineer, 1 Product Manager, 1 Product Designer

Design Process
Untitled (7)
User Research and Proposed Solution for Case Study

User Interviews:

Interviews were conducted with individuals who were using AWS IAM and managing access.

Group 6175

Focus Group:

2 internal focus group interviews were conducted to understand the expert’s opinions about challenges on IAM Access Graph.

User Pain Points

– Limited visibility

– Graph rendering time is slow

– Difficulty navigating the graph

Competitor Research
Image 2

Fugue

I did competitor research based on a few of our competitors such as Fugue, Authomize, Ermetic, and Cyberark. The goal is to find out how they have designed their access graph and to analyze the way they design the graph and the pros and cons of each design.

Approach

Meanwhile, if you are interested in finding out more about the proposed solution to large data visualization to enhance usability and how the solution could be applied to real-world applications such as the Identity Access Management (IAM) Graph, feel free to reach out to me for a case-study and design process walk-through.

Mockup 01 (2)
User Testing

User testing was done with 6-7 customers to test the usability of the graph. During the testing, we explained the changes that were made to the graph and allowed the customers to take us on a walkthrough to stimulate how the would use the access graph typically.

Overall, we received great feedback for the improvements made to the graph. The visibility of the nodes and edges on the graphs increased and the number of nodes on the graph generally reduced significantly, allowing our users to visualize and use the access graph more effectively.