soluble-cover2.png
 
 

Soluble Fusion 

Background

Soluble Fusion is a cloud security platform that helps developers check vulnerabilities and policies to accelerate the development process. For security teams, the platform provides visibility and oversees user activity.

 

My Role

• Lead Product Designer (Only Designer)

• Responsible for major features

• Helped with product requirements

• Series A startup team

Deliverables

• Product Design for Major MVPs

• Workshop and Brainstorming Sessions

• Interviews, Persona, Competitive Analysis, IA, Prototypes, Animations

• Design System


Why Soluble

75% of organizations are extremely concerned about cloud security. Cloud misconfiguration remains the biggest security threat for organizations in the cloud, but it is also preventable.

The reason is that human error is the most common cause of misconfiguration.  

 
 source: labs.ripe.net

 source: labs.ripe.net

 
 

Soluble is a SaaS product that use DevOps way to rationalize security , to provide faster and safer way for development teams to deploy code.

 
 

Target User

Securities

Developers

developers.png

Challenges

  • Developer had hard time working on large and dynamic security requirements and solve it one by one.

securities.png

Challenges

  • Security does not have right among of access, and time to deal with security issue in development team

 

Business Goals

Engagement

  • Increase retention by 5%

  • Increase task completion rate by 20%

business goal.png

Conversion

  • Increase conversion by 10%

  • Increase sign up by 10 %

Constrains in the projects

Screen Shot 2020-11-15 at 11.34.54 PM.png
 

Our Solution

Development Lifecycle

Development Lifecycle

Based on experience in the dev-ops, cloud security pioneers, and interviews with our design partners like the Snowflake, Amazon, Gitlab, and more. We target the code and test phase of the development life cycle to help developers deploy code safer and faster.

 

Developers

• Provide visibility,reporting, and compliance

• Permission Control

Securities

• Provide visibility,reporting, and compliance

• Permission Control

 

Soluble Information Architecture

Within all the features that I worked on, Alerts feature is most impactful and also primary tool that developers use.

 

Introduction

Cluster Watch (Alerts)

The primary tool for detect vulnerability and violation of policies. The following screen is the first version of Alert feature that we developed.

 
alert-first-launch.jpg

Starting point: Alert Main Page

alertdetailpage.png

Previous Alert Detail Page

 

Define

Looking At Data

people-confuse.png

Sign up is increased for 10%

5 Design Partner signup

But…

Users didn’t interact with the system again in 7 days.

• Measuring 7 days retention is important to know if user received value that we provide.

• SaaS product need to remain retention to keep user engaged and bring values.

 
people-why.png

Asking Why

Why user does not engage with alerts?

What can we do about it?

User Feedback

 
  • Received feedback from 6 design partners including Snowflake etc.

  • Brainstorm sessions and discussions with teammates to evaluate needs, prioritize and provide solutions.

illustration.png
 
 

User Pain Points

Onboarding Drop-off

  • Intimated onboarding flow.

  • Unclear instructions.

Previous Landing Page

Previous Landing Page

Users worry about uploading clusters

  • Uncertainty of what happen next to after uploading cluster.

  • Some user does not have skill set to set up clusters.

Previous Landing Page

Previous Landing Page


Confusing Visual Hierarchy

  • Unclear how many critical alerts are there.

  • User does not understand relationship between Alerts and Monitors.

Previous Alert Main Page

Previous Alert Main Page


Prioritizing Information in Alert Detail Page

 
Previous Alert Detail Page

Previous Alert Detail Page

  • No clue of who configured what

  • Want to switch between different Alerts faster

  • Do not know where to look at


Defining the problem

Storyboard:

  1. Imagine you are a developer that you find a great tool to detect vulnerability in your clusters.

  2. You are excited and finished signup.

  3. The first page you land on is the upload cluster page without clarifying what will happen next and what you will need to go through it. You feel like not continuing the process because you do not have the skill to set up clusters. Also, you do not have access.

  4. In the end, you left the application. Soluble did not demonstrate the importance of uploading and cluster and assist you in making upload easier.

User Drop-off Story

User Drop-off Story

 

Research

To clearly define user needs, we did 25 interviews with different companies, and we had a brainstorming session together to lay out the goal, use cases, reasons, and how we can fix it.

Our team identified where we are in the market and layout our competitive advantages, opportunity, and threat in parallel to research.

Screen Shot 2020-12-08 at 2.59.35 PM.png
 

Design Solutions

Preventing Onboarding Drop-off:

 

Provide product value in front

For most of the onboarding process that I worked on, I needed to eliminate onboarding steps to keep the user's attention span. But for this SaaS product is different. We need quickly demonstrate product value to users to be able to keep them coming back. Adding a sample cluster as one of the suggested steps are more informative and more engaging.

Before - Onboarding workflow

Before - Onboarding workflow

After- Onboarding workflow

After- Onboarding workflow

 
  1. Users have the freedom to continue with optional items or not.

  2. Users will receive “Success“ instantly after finish two steps.

 

Building Confidence:

Providing sample clusterUsers will land on the get started page.

  • Cluster contains important information about client data

  • Users will have a sample cluster to work with for an hour.

sample-cluster

Dashboard:

Prioritizing value for users

Based on user behavior and feedback that users want to focus on critical issues, active alerts and be able to have a holistic view of them. We created four sections that help them see how many Alerts, how much increased and the tendency over time.

 
Alert-main-page-menu2.png

Overview Section Iterations:

Screen Shot 2020-11-16 at 12.32.40 AM.png

Iterations on Alert Detail Page Presentation

  • Users want to be able to switch between alerts quickly.

  • Only want to look at 2-3 essential things:

    • Severity

    • Summary

    • Activity History

Screen Shot 2020-11-16 at 12.33.57 AM.png

Final Design

  • In the end, based on collaborative discussion and internal test, we decided to go with right drawer option.

 
Alert-main-page-rightdrawer.png
 

Adding Value to Overall Alert Experience

Additional Features: Notes

  • Redesigned list component for clear sections

  • Comment sections to know who changed what and when

 

Additional Features: Activity history

  • Activity history for overview of actions

Alert-main-page-activityhistory.png
 

Impact

Helped removed onboarding block, increased task completion rate by 39.25%

 

Design System

Collaborating Consistency and Scalability

  • Show initial prototype early and communicate ideas

  • Handoff with different roles

  • Communicating instantly and prepare for discussion

  • Design beyond the screen

Screen Shot 2020-11-21 at 3.52.12 PM.png

Legibility : IBM Plex Sans was designed for legible for both small and large font sizes. Also provide variety of font weight to clear reading hierarchy. All the numbers are easy to read.

Consistency: Choose purple is for royalty and power. For Green is for purpose of for dominant CTR Buttons for the interface.

 
typography.png

Daily Digest + Email Templates

Screen Shot 2020-11-21 at 4.11.27 PM.png
success-girl.png

Thanks for YOur time.