15 September, 2024 — Key lessons learned from addressing UI/UX complexities and developing resilient, scalable solutions as a full-stack engineer

Retrospection: Theme Builder at Synthesis

Synthesis is a creative data consultancy that helps businesses make sense of complex data by combining human insight with data science to provide actionable solutions. The company has partnered with brands such as Netflix, Amazon Music, Airbnb and Heineken, as well as other companies across various industries.

In my first quarter at Synthesis, I jumped headfirst into the Theme Builder project. What began as a backend role unexpectedly evolved into a fullstack challenge, where I teamed up with a product designer, also new to the team. Together, we built the final features and put the finishing touches into production before smoothly transitioning the product into maintenance mode.

For context, to help the company's strategists and data scientists make sense of vast datasets from sources like Reddit, Google, and Twitter, the software engineering team developed internal tools designed to streamline and accelerate the analysis process.

The predecessor tool of this endeavor, Topic Discovery, is (and continues to be) a staple in the team's workflow, helping identify key conversations and themes through clustering algorithms. But, its lack of flexibility fueled the creation of Theme Builder.

Unlike Topic Discovery's automated approach, Theme Builder gives users freedom to fine-tune clusters by adjusting boundaries with Boolean queries, offering more control and customisation. Building on that, Theme Builder also includes powerful new features that allow users to cut, merge, and compare data, making it a faster, more customisable alternative to traditional tools like Tableau. These updates bring the consultancy team closer to the start of their analysis, enabling a more adaptable, interactive approach to data exploration.

Theme Builder, built by just two people, moves quickly with new features rolling out every few days. This focus on speed and agility drives our scrappy, lean approach, prioritising rapid improvements over perfection. We've made missteps, but each one, along with user feedback, has ultimately shaped a better product.

This experience taught me valuable lessons in engineering, user-centered design, and the art of rapid iteration—often learned the hard way. Here's what I learned while wrestling with Theme Builder:

Context Menus

Theme Builder was a data-intensive tool with a lot of interactions. To reduce clutter, we used right-click context menus to hide less-used actions. However, this decision led to low user engagement with the feature. Our click tracking data showed only 0.5% of clicks were from right-clicks, indicating that users weren't discovering the menu.

Right-click context menus are more commonly associated with software applications. In web applications, overriding this inbuilt behavior is generally considered poor affordance and goes against Nielsen's 10 Heuristics, particularly the principles of discoverability and feedback.

If absolutely necessary, custom context menus must be carefully designed to ensure they enhance usability rather than hinder it. This Nielsen Norman Group's article provides a comprehensive resource on the dos and don'ts of contextual menus, which complements the lessons I have learned through our iterations.

Elegance v Bodging

They say a good solution is as much about elegance as it is about functionality. It's a principle that truly shines when you see it in action.

At launch, we hit a major snag: keywording operations felt sluggish, and latency issues made the experience frustrating. The issue stemmed from a cascading update problem—every time a leaf node changed, parent nodes needed to recompute their values, propagating changes up to the root. Our initial attempt to fix the issue was to debounce the recomputation process for three seconds. However, this only compounded the problem, making the process more erratic and frustrating—something I experienced firsthand while using it.

Our next move was to tackle an old backlog ticket for bulk keywording, assuming fewer triggers would reduce recomputation. However, I found that keywording itself wasn't the issue — it was lightning-fast. The real bottleneck was the upward propagation, which took 2-4 seconds depending on data size.

After taking a step back and rethinking the approach, we split the update process: providing immediate feedback for user actions while the heavier computations ran asynchronously in the background. This created the illusion of a faster, seamless experience, even though the slower computations were still happening behind the scenes.

The results were clear. Users noticed the application felt faster, even though the changes were mostly frontend tweaks. By prioritising quick updates and handling the slower ones in the background, we enhanced the perceived performance without a full system overhaul. It was a simple, elegant solution — far more effective than any “bodged” workaround.

Plussing

At Synthesis, we foster a culture of plussing, where we continuously build upon each other's ideas to create something better. In our work on Theme Builder, our small team—comprising a product designer with data science experience and a full-stack engineer with a background in product management—leveraged our diverse skills to collaborate effectively. We shared insights and communicated openly, and often, the creative breakthroughs came from simply asking the right questions. This approach helped us explore new angles and innovate, even when facing unfamiliar challenges.

This experience has reshaped the way I approach coding—emphasizing thoughtful iteration, efficient solutions, and better collaboration. It's about improving how things work without overcomplicating them.