Following up on my previous post about TypeScript workflows and distributed systems, I want to share the user experience challenges we faced when dealing with complex workflow visualization. While the technical implementation was solid, the user interface was a cognitive nightmare.

The Problem: When Technical Excellence Meets UX Reality

We had built an incredibly sophisticated workflow engine. Our TypeScript-based system could handle thousands of interconnected nodes, complex branching logic, and real-time state management. From an engineering perspective, it was beautiful. From a user perspective, it was overwhelming.

The Technical Reality:

• Workflows with 500-2000+ nodes were common
• Complex branching logic with 15+ decision points
• Real-time state updates across distributed processes
• Multiple user roles needing different views of the same data

The User Reality:

• Users spent 20+ minutes trying to understand single workflows
• Support tickets increased 300% after workflow launches
• Only 12% of users successfully completed workflow setup
• Teams avoided using the system, defaulting to manual processes

The disconnect was clear: we had optimized for technical capability, not human comprehension.

The UX Challenge: Cognitive Load vs. Information Density

The core challenge wasn’t technical; it was cognitive. How do you present complex, interconnected information in a way that matches human mental models?

• Challenge 1: Visual Overwhelm Traditional flowcharts become incomprehensible at scale. A workflow with 1000 nodes creates a visual maze that no human can effectively navigate.
• Challenge 2: Context Switching Users needed to understand both the big picture and granular details, but traditional interfaces forced constant zooming and panning.
• Challenge 3: Progressive Disclosure Not all workflow complexity is relevant to all users at all times. We needed smarter information hierarchy.
• Challenge 4: Mental Model Mismatch Users think in terms of conversations and sequences, not node graphs and state machines.

The Solution: Conversation-Driven Design

The breakthrough came from observing how users naturally described workflows. They didn’t say “Node 47 connects to nodes 52, 53, and 54.” They said “After the user responds, we either send a follow-up or escalate to human support.”

• Design Principle 1: Linear Narrative Over Node Graphs Instead of showing the entire workflow graph, we presented workflows as conversational sequences. Users could follow a story from beginning to end.
• Design Principle 2: Contextual Depth Allow users to dive deeper into any part of the conversation without losing their place in the overall narrative.
• Design Principle 3: Progressive Complexity Start with the happy path, reveal edge cases and error handling only when relevant.

Before & After: Visual Comparison

The following comparison illustrates the stark difference between the traditional flowchart approach and our conversation-based redesign:

The Results: Measuring UX Impact

The transformation from flowchart visualization to conversation-based design had measurable impact:

User Comprehension

• Setup completion rate: 12% → 78% (550% improvement)
• Time to understanding: 20+ minutes → 3-5 minutes (75% reduction)
• Support tickets: Reduced by 65% within 30 days

User Feedback

• “Finally, I can actually understand what’s happening”
• “It’s like the system is explaining itself to me”
• “I can focus on the business logic instead of fighting the interface”

Technical Adoption

• Workflow creation: 3x increase in new workflows created
• Team adoption: 85% of teams actively using the system (up from 23%)
• Complex workflow handling: Users now comfortably work with 500+ node workflows

Key UX Lessons Learned

1. Technical Capability ≠ User Understanding

Just because your system can handle complexity doesn’t mean your interface should expose all of it at once.

2. Match Mental Models

Users think in terms of stories and sequences, not graphs and state machines. Design interfaces that match how people naturally think about processes.

3. Progressive Disclosure Is Everything

Give users the information they need, when they need it, in the amount they can handle.

4. Context Preservation

When users do need to see technical details, don’t make them lose their place in the bigger picture.

5. Conversation > Configuration

Wherever possible, frame complex configuration as a conversation rather than a form or technical interface.

Conclusion

The shift from flowchart visualization to conversation-based design wasn’t just about making things prettier; it was about making complex systems comprehensible to humans. By focusing on how users naturally think about processes and providing progressive disclosure of technical complexity, we transformed a technically impressive but unusable system into something teams actually wanted to use.

This experience reinforced my belief that the best technical solutions are worthless if humans can’t understand and use them effectively. Sometimes the most important engineering work happens in the design of the user experience, not just the underlying systems.

The conversation-based approach has since influenced how I think about presenting complex information in other projects, always asking: “How would a human naturally explain this to another human?” The answer usually points toward better UX design.

This post is part of a series on UX challenges in technical products. Next up: “Designing Psychological Safety into Digital Interfaces” - exploring how interface design can make users feel confident to explore and experiment.