Introducing IDE Debugging Paradigms to a Low-Code Platform
DEVELOPER TOOLS | ENTERPRISE B2B SAAS
PROJECT OVERVIEW
SKILLS
UX for Technical Workflows
Error Handling & Guardrails
Design System
ROLE
Lead Product Designer
TIMELINE
6 Weeks (June-July 2023)
PLATFORM
Web
OVERVIEW
Unqork is a low-code platform used by enterprises to build complex workflows without writing traditional code. As configurations scale, debugging server-side execution becomes critical, especially for Solutions Architects (SAs) and advanced configurators responsible for reliability, performance, and error handling.
I led design for Server-Side Execution Testing, an internal debugger tool that allows users to test, inspect, and diagnose backend logic before deploying configurations.
DESIGN CHALLENGE
When I picked up the ticket, the brief was intentionally vague: “Update UI and some enhancements.” While the main objective was to reskin the UI with the new Unqork design system, it was my job to go beyond the surface and improve the usability and adoption of the tool.
Although the Server-Side Execution Testing tool already existed, there were no clear guardrails, documented workflows, or success metrics - only a dense, interaction-heavy tool with many opportunities for improvement.
This required:
Comfort operating under ambiguity
Defining the problem space before solving it
Designing for multiple expertise levels using the same surface area
USERS
The same debugger needed to support first-time users and power users without fragmenting the experience
Our primary users are Solutions Architects and advanced configurators across all levels of proficiency. Each level used the tool differently and I needed to ensure that the tool met the needs of different workflows with clarity.
PROBLEM
Users relied on trial-and-error deployment rather than structured debugging
Although powerful, the debugger was underutilized and misunderstood. Even advanced Solutions Architects didn’t know how to use it effectively.
DESIGN APPROACH
Navigating ambiguity by referencing mental models and first principles
1. Debugging Mental Models: Grounding in familiar debugging patterns
Even in a low-code environment, I borrowed mental models from traditional IDEs to reduce user friction and speed up diagnosis.
2. Information Architecture: Reframing the experience around inputs, execution, and errors
A clearer hierarchy helped users understand what they control, what the system returns, and where failures occur. I mapped out the user flow to solidify the overall structure before going into the details.
3. Error Discovery & Classification: Helping users quickly find and understand failures
Errors were surfaced, searchable, and categorized to reduce time spent scanning dense execution output. Through each design sprint, I tested for feedback with my design team and internal Solution Architects at Unqork.
DEVELOPER HANDOFF
Extending the Design System for Debugging Workflows
Not only did I migrate the SSE debugger to the new Unqork design system, but I also introduced new components that the design team has since used in other surface areas. I prepared detailed annotations with these components for the front-end development team.
OUTCOME
Server-side execution testing became more discoverable and approachable
While usage metrics were still ramping at handoff, the redesign aligned teams around a clearer mental model for debugging within a low-code environment. Key outcomes include:
Reduced reliance on guesswork during deployment
Helped users identify, search, and understand errors more quickly
Brought the experience closer to a true IDE-like debugging workflow
Established a scalable foundation for future debugging enhancements