design bootcamp
case study
I attended a 5 day long design bootcamp at Microsoft ILDC and this is the case study I worked on during that time.
P.S: A few months later, I was hired as a design intern for this product, which I would love to tell you more about in a future portfolio review, so let’s talk!
P.P.S Thanks to the bootcamp founders & my colleagues Michal & Ganit
for changing my life! ♥
Microsoft Defender for Endpoints helps organizations secure their enterprise with a comprehensive slate of capabilities across prevention, detection, investigation and hunting, response and remediation, awareness and training.
The Alert page tells the alert story, which is the chain of events and alerts related to a specific alert in chronological order.
User feedback that came up stated that users are looking for more visual, easy to understand proccess trees in order to investigate alert stories. In order to help them.
The goal is to find ways for the interface to be less cluttered and more intuitive. Make connections between components and tell the story in a clearer, more visual way.
In the existing version, before expanding the nested alerts, the information felt like a mystery; they needed to be opened and searched through to understand and investigate, requiring too many clicks, making it hard to gather the information.
My solution was to reveal as much detail as possible, before you click anything. Make the nested information accessible, all while avoiding cognitive load.
The color coded summary reveals all: it tell the user everything and links them quickly to the type of alert they are looking for.
Additionally, each event has an indication for the amount of alerts in it, marked by a number and lightning bolt icon.
OLD VERSION
MY SOLUTION
REVEAL THE PROCCESS TREE
A few more fixes to help users navigate
OLD UI
Visual overload and hard to understand components that I found fixable such as:
Icons I didn’t recognize - what do they mean?
Time is important to the user (by User Research) but hard to read
Repeated events that could be reducted to one
Sidebar feels detached - how is it related to the content?
False alerts and true alerts look the same but have very different significance
MY NEW SOLUTION
Quick visual recognition fixes:
Hover explanations
Time an event took place is now revealed on the event and while hovering over time
(for example: “This action was executed in 0.3 seconds”)Repeated events reduced to one, now we gained an advantage because the fact it is repeated is important to the user and it is highlighted. If an event is repeated in a way that is not human, for example, too fast - it could mean it is automatic and malicious!
Sidebar no longer feels detached - the selected event has a blue line on it’s left, and the sidebar has the same line. Now they feel connected.
False alerts have lower significance so now they are greyed out a little - Helps distinguishing!
MY SOLUTION