Mark Tse
  • CV
  • DEUS
  • PRE SALES TOOL
  • SYSDIG
  • OTHER PROJECTS
    • C.A.T. LOGO
    • CISCO CX
    • HEALTH 2047
    • MOTION INSTRUMENTS
    • O-BOX
    • SAIC: MAXUS HMI DESIGN
    • SAIC: NEXUS SHUTTLE
    • SAIC PROPOSAL
    • VR GESTURE
    • XCELLA BIOSCIENCE
  • 3D/MOGRAPH
    • SUB-SURFACE SCATTER
    • Z-BRUSH ANATOMY
    • Z-BRUSH TUTORIAL 01
    • Z-BRUSH TUTORIAL 02
    • Z-BRUSH TUTORIAL 03
  • GAME ART
  • Blog
    • AS A DESIGNER
    • FORD IDEATION
    • GV DESIGN SPRINT VS APPLE
    • LIVEFYRE
    • NEXON EXPERIENCE
    • TESTIMONIAL VIDEOS

Sysdig

WHAT: A tool to monitor data of deployed environments at the system call level using an agent.
WHEN: 2019-2020
WHERE: Sysdig
ROLE: PRODUCT DESIGNER
RESPONSIBILITY: OWNER OF 12 MAJOR FEATURES SINCE AUG 

PROJECT 1: RUNTIME IMAGE SCANNING (AUG-SEPT 2019)

On the SECURE product line, Sysdig offers a series of features and tools. Among those tools is Image Scanning, which is section to way for the user to view a security infrastructure. Image scanning will compare the passing and failing of images in a table but users found this information to be rather useless and flat without a narrative for that information. This is the process in which I found a fix and solution.

PERSONAS

At Sysdig, our director created 2 main personas made from an amalgamation of various roles across existing clients and determined that there are two user types that need two types of information from this.
​
  • Axle Longo, Security Operations  - Axle would be someone who looks at the deployments such as a dev ops engineer. In other organizations such as Visa or Chase would be a Security Engineer.
  • Kelvin Chen, Security Stakeholder​ - Kelvin would be more of a security officer who makes reports to higher level dev team.

​ORIGINAL RUNTIME SCANNING FEATURE

Picture
Part of the a typical nature of my role is to fill some of the duties of the PM. This includes reaching out to our clients and internal Security or Dev ops as surrogates for our personas. To really understand the user journey story of each personas. What I found is that users that represented both personas has a problem with the old Runtime Image Scanning feature.

  • It's just long list of images passing and failing.
  • Gives no context
  • Are Images getting better or worse
  • How severe are the the vulnerabilities.

DESIGN SPRINT WITH PMS AND DEV

Meeting with product and dev is really important. Product particularly sets the vision for the product, the requirements and the requests of current clients. Design solves for those requirements while taking the existing design system into account. The Dev has to take feasibility, development strategy as well as time into account. We find spending sometime to work on mockups and design sprints that can be tested to save on wasted iterations on development which can be costly. Although we don't use the Google Ventures Design Sprint strategy, we have the same philosophy in mind. The philosophy is to spend time to test and work on trying ideas to save on costly and time consuming development with prototypes.

SOLUTION

Picture

DARK THEME

Picture
How I improved the design.
  • Percentage of passing and failing images gives context and trend of improving or degradation of deployments
  • KPI Bar at the top gives an overview for Stakeholder Persona
  • Toggle between Scanned Images, Top CVEs, and Latest CVEs
  • CVE Severity Count added to the table.

PROJECT 2: COMMANDS AUDIT VISUALIZATION/DARK THEME EXPLORATION (SEPT 2019)

Commands Audit was feature where the lead designer, Albert Leung and the UX Manager worked on. I only acted as a designer to flesh out the data visualization part of the design system library by creating markers that would be able to indicate key events such as a kubectl, a command, along with other alerts and events.

STACKING EVENTS

Picture
  • Hard to align with historical data
  • Hard to decipher meaning.
Picture
Illustrate events related to a single Kube Exec command. Activates when expanding the collapsing table for that Kube command.
Picture

BULLET AND BAR

Picture
  • Cleaner solution
  • Easy to read​
Picture
Comparing events to performance metrics.
Picture

PROJECT 3: IMAGE VERSION COMPARISON (DEC 2020)

Picture
This little is about comparing and showing the changes in vulnerabilities between versions of the images.

The Design revolves around the Axle Longo, Sec Ops persona under the premise that users want to know what changed between updates and fixes to vulnerabilities discovered by the images.

PROJECT 4: SECURE OVERVIEW (FEB 2020)

Overview, is a dashboard that surfaces key secure performance metrics over the user's environments. I was tasked to lead the discussion on what would be an ideal design for the Security Administrator persona to look at their builds and runtime environments and ultimately create a dashboard. What you see below in the final design for the Overview environment.

DESIGN SPRINT WITH PM, STAKEHOLDERS AND DEV

IDEATION: 3 PART SECTION DESIGN

IDEATION: BUILD/RUNTIME SECTION

Initially the requirements as in the form of a list. Designing along side PMs in a design sprint allows to expore how to conceptualize these concepts and ideas.
During our PM and Designer design jams, we felt another valid perspective is to see our environment in terms of build and runtime.
Picture
PROS AND CONS
  • Easier to compare historical diagrams with each other for correlation.
  • Organize information into three parts.
  • Easy to get lost  without Titles and context.
Picture
PROS AND CONS
  • Able to clearly distinguish from Static and Runtime Environments
  • No scrolling one pager
  • Compliance seems tacked on
The PM and myself met with three clients and conducted some user studies and showed a couple solutions. While a couple clients preferred the 3 part rows, we had an even split with the other solution. My design incorporated both toggling between the List View and Card View using a toggle in the upper right hand corner.

LIST VIEW

CARD VIEW

Picture
Picture
The final design had two modes. One was a list view and the other was a card view. While the design was superior. The finished product was only the card view due to development time constraint though I am confident the list view  would be in the future pipeline.

RELEASED FINAL DEV BUILD

Picture

 PROJECT 5: SINGLE SIGN-ON AUTHENTICATION (MAR 2020)

Picture
Picture
Picture
Picture
Picture
Mark Tse
​2016
  • CV
  • DEUS
  • PRE SALES TOOL
  • SYSDIG
  • OTHER PROJECTS
    • C.A.T. LOGO
    • CISCO CX
    • HEALTH 2047
    • MOTION INSTRUMENTS
    • O-BOX
    • SAIC: MAXUS HMI DESIGN
    • SAIC: NEXUS SHUTTLE
    • SAIC PROPOSAL
    • VR GESTURE
    • XCELLA BIOSCIENCE
  • 3D/MOGRAPH
    • SUB-SURFACE SCATTER
    • Z-BRUSH ANATOMY
    • Z-BRUSH TUTORIAL 01
    • Z-BRUSH TUTORIAL 02
    • Z-BRUSH TUTORIAL 03
  • GAME ART
  • Blog
    • AS A DESIGNER
    • FORD IDEATION
    • GV DESIGN SPRINT VS APPLE
    • LIVEFYRE
    • NEXON EXPERIENCE
    • TESTIMONIAL VIDEOS