Work Main Image
Company
Splunk
Service
Web app
Tools
Figma
Year
Aug 2021- Oct 2021

About the project

Simplified query creation with a point-and-click interface, reducing complexity and improving usability.

Team

I worked with Chief Designer, Senior Director, Director as well as the main team involving Design PM, Principal Designer, Designer (Me), Product PM, EM, Tech Writer, and Engineers.

Understand the users and content

Splunk Enterprise users access the platform to analyze and visualize data. Experienced users often manage administrative roles with advanced coding skills, while less experienced users focus on daily operations without deep technical knowledge

Problem

The product was in its early stages, lacking visual strategies, proper hierarchy, and sufficient contrast, leading to usability challenges.

Solution:

Streamlining the User Experience

Developed a cohesive visual strategy, establishing a clear hierarchy across navigation, panels, and goals. Enhanced contrast to improve usability and user focus.

Design Process

  1. Kick-off & Discovery
  2. Research & Insights
  3. Ideation & Concept
  4. Design Iterations & Feedback
  5. Prototyping, Handoff & Launch

Challenge & Visual Strategy

The Jr. Director pushed back due to insufficient contrast when reusing existing design system colors. After several iterations, I aligned the design with the Splunk Design System, ensuring consistency while creating an intuitive hierarchy and enhancing user experience.

Color themes & accessibility

I collaborated with the design system and accessibility teams to create new color themes that ensure consistency and meet accessibility standards. This aligned with the product’s vision for both light and dark themes.

Design handoff & component kit

Created detailed specs for engineers to ensure design consistency. Developed a reusable design kit that included components, grids, and accessibility guidelines, streamlining workflows and accelerating delivery.

Specs & Design kit

Combine applied color themes & components

Applied the new color themes and built components following the atomic design methodology. These components were integrated into the design system, ensuring seamless application across all themes.

Layout & components

Key impact & Takeaways

  • Overcame the challenge of multiple theme iterations, introduced new color themes, and enhanced usability.
  • Adopted a consistent visual identity across products while aligning with Splunk’s brand values.