2022 -- 2024
Helios
Runtime observability tool for software development teams and architects
Interaction / Visual / Product Design, Design Systems, Information Architecture, Frontend Development (React/TypeScript), Data Visualization
Helios was a startup developing a runtime observability tool that gave software teams unprecedented visibility into their deployed code. Before its pivot to security and acquisition by Snyk in 2024, the platform helped developers understand the actual behavior of their distributed systems in production.
Users reported the tool was "priceless" and "opened their eyes" to their runtime environment -- finally seeing how services actually communicate, where bottlenecks occur, and why errors propagate through their systems.
The Challenge
Developers are essentially "blind" to their deployed code in modern distributed systems. They lack visibility into runtime behavior, bugs, performance bottlenecks, and errors. The challenge was to extract meaningful, actionable insights from massive amounts of transaction data.
My Role
I joined Helios when the company was just a few months old, becoming the sole product designer responsible for the entire user experience. Over two years, I shaped the product from early concepts into a mature platform -- designing the information architecture, interaction patterns, and visual system that made complex observability data accessible and actionable. I worked hand-in-hand with Product and Engineering, and contributed directly to the frontend codebase.
Main View & Entity Dashboard
The main view serves as the command center for understanding your distributed system. It combines a services sidebar, API/operations lists, and contextual mini-dashboards that appear when selecting any entity -- showing stats, charts, and actionable information at a glance.
Powerful Search & Filtering
A robust search and filter mechanism allows instant filtering across the entire system by any important attribute. The filter operates globally, narrowing down services, APIs, and traces simultaneously -- turning overwhelming data into focused, actionable views.
The seemingly simple tokenized search component was a design-intensive element to get just right. It required countless micro-interactions to support diverse use cases: multi-attribute queries, keyboard-driven navigation, mouse selection, autocomplete suggestions, and graceful handling of complex search patterns -- all while maintaining a clean, intuitive interface.
Service Map
An interactive graph visualization of the entire services environment. Users can filter by Request rate, Average duration, and Error rate using percentile sliders, and drill down from service type to individual API level. The map reveals dependencies and communication patterns that would otherwise remain invisible.
Trace Visualization
The trace view provides a visual representation of request flows through the system. Each span shows detailed information including AWS Lambda functions, FaaS events, HTTP details, and timing breakdowns. Filtering highlights relevant spans while dimming the rest for context.
Trace-to-Test Transformation
A key innovation: one-click conversion from trace visualization to test configuration. Users can select which spans to include, define assertions on event data, and generate runnable test code in Mocha, Jest, or pytest. This bridges the gap between production observability and development workflows.
Labels & Alerts
Labels allow users to save complex queries and create monitoring rules. Each label can trigger alerts based on configurable conditions (span counts, time windows, severity levels) and notify teams via Slack integration. This turns one-time investigations into ongoing monitoring.
Collaboration & Developer Tools
Beyond observability, Helios included features to support team workflows: trace sharing with colleagues, commenting for async discussions, flow replay for reproducing issues, and integrations with Jira, Slack, Sentry, and more.
Learning from Real Users
As a startup that didn't shy away from shipping features to production fast, we relied heavily on session replay tools like FullStory to understand how users actually interacted with our product. This approach completely eliminated the need for traditional usability testing.
Both the lead PM and I committed to spending at least an hour every week watching real user sessions. This practice gave us priceless insights: we discovered obvious mistakes we had made, found hints on how to improve interactions, and validated assumptions and previous fixes. Watching users navigate the product in their own environment -- with their own data, their own pace, and their own confusion points -- was far more valuable than any scripted test could have been.
Hands-On Code Contribution
Beyond design, I actively contributed production code to Helios. As the #2 contributor on the repository with 763 commits, I was deeply embedded in the engineering workflow -- implementing designs directly, maintaining the design system, and ensuring pixel-perfect execution.
GitHub contribution statistics: May 2022 - Aug 2023. 763 commits, 56,076 additions, 51,256 deletions.
More Screens
