Enhancing diagram clarity and UI performance with GoJS
Klea, a legal tech company focused on AI-driven entity management, wanted to refine the UX of its Group Chart tool — not just to polish its look, but to streamline performance and create a more intuitive experience for legal teams. From faster load times to clearer visuals, the project focused on boosting engagement and usability for a global user base. That’s where we came in—reworking the GoJS diagram to be faster, cleaner, and easier to use.
We focused on:
- Redesigning UX and UI of the Group Chart.
- Optimizing GoJS diagram layout.
- Refactoring front-end performance.
Klea – a legal technology platform focused on AI-driven legal entity management and global collaboration for in-house legal teams.
Enhance the user experience and performance of the Group Chart feature built on GoJS. Key goals included moving functionality from server to client-side for faster response times, redesigning the interface for better clarity, and improving diagram accuracy.
UX/UI redesign of the Group Chart; GoJS diagram layout and alignment optimization; frontend performance refactor (client-side logic); custom filtering system enhancements; codebase cleanup for better maintainability; visual updates to support clarity, retention, and engagement.
Solving UX, performance, and data complexity challenges
Before engaging with Synergy Codes, Klea’s internal team was facing a series of design, usability, and performance hurdles with their Group Chart tool:
Outdated UX slowing users down
The original interface made it harder for users to navigate the org chart intuitively, affecting task efficiency and increasing error rates.
Diagram layout inefficiencies
Without automatic layout improvements and refined node alignment, users spent too much time manually adjusting visuals to make sense of complex org structures.
Server-side load bottlenecks
Certain features ran server-side, slowing down load times and placing unnecessary strain on backend resources.
Low filtering feature adoption
Although filtering options existed, their design wasn’t intuitive enough, which led to underuse and inefficient information retrieval.
Inconsistent visual clarity
Visuals didn’t always reflect the org structure clearly, leading to confusion and increased support queries.
Scaling without a mess
With future product growth in mind, Klea needed a maintainable, scalable diagram foundation that wouldn’t add tech debt.
From performance lags to polished, user-first diagrams
We began with a thorough review of Klea’s GoJS-based group chart. Our goal was to understand where inefficiencies were hiding—whether in layout mechanics, server-side logic, or visual complexity—and plan fixes that would move the needle fast.
Working from real user feedback, we redesigned the interface and experience to feel more modern and intuitive. At the same time, we optimized the layout engine and alignment behavior to improve navigation clarity and eliminate time-wasting adjustments.
Shifting logic from server to client, we drastically reduced load times and improved responsiveness. The refreshed visuals also made the org structure easier to interpret, contributing to higher engagement and a noticeable drop in support queries.
To help users retrieve information faster, we implemented a new filtering UI and upgraded the navbar. These changes led to higher feature adoption and made navigating complex legal structures much more efficient for everyday users.
Turning legal complexity into visual clarity
Rethinking the org chart experience
Klea’s Group Chart was due for a transformation. We redesigned the UI and UX from the ground up, making the diagram easier to read, faster to navigate, and more engaging for users. Our updates helped reduce error rates and boosted task efficiency—especially for teams working with large, complex structures.
Streamlining performance from server to client
One of the major performance bottlenecks stemmed from server-side logic. We moved key features to the client side, significantly improving load times and responsiveness. This optimization not only boosted user retention but also cut back on server load and made the platform easier to maintain long-term.
Improving engagement through better interaction design
We introduced a custom filtering UI and upgraded the navigation experience to help users quickly find the information they needed. These improvements led to higher feature adoption, reduced support queries, and a more satisfying overall user experience.
Better performance and collaboration in legal tech
Elevate your legal workflows with interactive diagrams that do more than just display data. We helped Klea transform their GoJS-based group chart into a fast, responsive, and intuitive tool – backed by high user adoption and reduced support needs.
No need to re-architect your entire platform. We plugged into their system, streamlined visuals, optimized client-side performance, and left the codebase cleaner than we found it.
- Our team of frontend experts and UI/UX designers modernized Klea’s diagram interface, making complex entity data easy to understand at a glance.
- We moved key features from server to client, cutting load times and improving responsiveness without burdening internal resources.
- We designed filtering and navigation components that users actually enjoy using—boosting feature adoption and reducing drop-offs.
- Our solutions aligned with Klea’s long-term goals: scalable, visually clear, and fully optimized for legal teams managing global entity structures.
Refined visuals, improved performance, and better user interactions
Improved performance, higher adoption, and smoother user journeys
The redesigned UI and UX led to faster task completion and fewer user errors—especially in navigating complex legal structures. The refreshed visuals made it easier for users to engage with the org chart and understand key relationships.
Shifting key features to the client side, Klea reduced load times and enhanced platform responsiveness. The improvements also helped optimize server usage and retain more users through a faster experience.
The addition of a custom filtering UI and revamped navigation features drove higher adoption and faster information retrieval. These upgrades also contributed to improved accessibility and a notable drop in support queries.
Ready to make your diagrams smarter and faster?
Let’s build a more intuitive, performant solution for your team – just like we did with Klea. Tell us what’s holding you back. We’ll help you move forward.