A WhatsApp-based sales hub, revamped.

How we helped Zoko become a productivity powerhouse by restructuring and redesigning their product.

"Genuinely, your great design has helped us in 100 places. Was one of the best investments we made."

Arjun Paul, Founder and CEO at Zoko

Zoko lets customers quickly purchase from WhatsApp by having customers chat with businesses directly.

It has been adopted by many companies, and shoppers followed along. Millions of messages, countless orders, and payments are swapped daily.

More than anything, Zoko is a productivity product for businesses and a convenient service for customers.

We couldn't simply throw Zoko's legacy in the trash. We couldn't merely gamble the ability of thousands of business agents to work productively and put revenues at risk in one vain eye-catching effort. Patterns and fundamentals would have to be kept.

Yet, it needed drastic reforms. The product required design principles and a thoughtful design-minded experience.

Changing it. But carefully.

For the customer, nothing would change. Same WhatsApp front.

The single target audience was the business agents hiding behind their screens, handling multiple shoppers in a frenzy.

Off the bat, there were a few things we had to examine:

  • How do agents actually use Zoko;

  • What kind of struggles do they have;

  • What could we change without disrupting their productivity?

User research, at heart.

In research, we discovered the following fundamental problems:

  • Information was tough to dissect, given the poor information architecture, the lack of visual hierarchy, and the absence of easy-to-find visual queues.

  • The Queue was bloated, complex and hard to use, making triaging incoming messages really difficult and inefficient, often forcing business managers to rely on heavy filtering.

  • The Queue was accessible for business managers and agents everywhere, even though there were separate areas, goals, and actions for each. 

  • Vital areas of the product were being held away from easy reach, forcing business agents to spend eternities navigating away from their core workplace.

  • Information was hard to find given the dimension of the product, often forcing businesses to spend too much time searching for information.

Product changing decisions.

Queues-less.

We found that the Queue was shared by managers and agents. And even though the Chat should be the agents' unique focus, the Queue was always creeping in from behind, creating needless pressure and discomfort.

Removing Agents' access from the Queue would let them be focused on where it matters: the Chat. Away from all the clutter. But above all else, a Workplace, a more straightforward mind frame, and effortless focus.

Clutter-less Queues.

We discovered that all the Chats were in the Queue, creating clutter and utter complexity. Assigned and unassigned, new and closed, were hanging in there, randomly displayed, heavily relying on filters for some (needed) clarity.

We changed it too. We made the Queue a triage station for managers. Only unassigned new messages would be displayed here and, once assigned, moved to the Chats. It changed managers' lives: a Queue faster to triage, actually productive, a polished experience.

Quick search, faster results.

We observed finding information across Zoko to be the worst nightmare of all. Zoko is huge. A proper massive product. There's an enormous amount of data, and information all over the place, sometimes hard to find without losing focus or wasting too much time.

We enforced Quick Search. Available anywhere, quickly accessible, intuitive, and it singles-out results based on their context.

We made it 100% keyboard-friendly for an even more productive experience. Night and day.

A cleanse.

We learned agents use Zoko automatically. It is engraved in their muscle memory. We couldn't change it too much.

However, through our UX Research and Audit, we realised that a few structural changes could drastically improve their productivity. Thus enhancing the speed of their replies and, potentially, the satisfaction of their customers.

Careful navigation changes, a proper visual hierarchy, thoughtful information architecture, contextual actions here and there instead of blatantly displaying them all at once, a cleaner UI, useful visual queues, and a pinch of salt.

As a result, a less cluttered interface meant less time spent per customer. Less is less.

Noise-free.

For such a data-heavy product, keeping it clean was unconditionally fundamental. We avoided visual noises that could create even more chaos, focusing on the bare necessities. It is as simple as it gets. An easier-to-use, easier-to-understand product.

Distraction-free.

Productivity apps don't have to be loud, we discovered. They must be quickly learnable, focused, and contextual. We cleared all the distractions. Instead, we implemented them in context when they were needed. Actions pop in when they are required.

Redundant-less.

Our analysis also showed agents know Zoko like the palm of their hands. They actually use it every day without even looking. We didn't have to overpack the interface with redundant cues. Instead, we could remove some of the written information, using icon-only elements to the detriment of a cleaner interface.

More than just settings.

Settings in Zoko are much more than just your standard, dull settings page. They are its brain. And a pretty technical one. They carry Templates, Triggers, sales Flows, Quick Replies, and Webhooks, among other not less complex features.

Our research showed us that Settings are a huge productivity enhancer. Some allow businesses and agents to automatize their workflows, funnels, and sales processes. We also found it was highly overcomplicated and hard to use because it was created by deeply technical people.

By having our designers study it, detached from the technical affairs, we could observe it from a non-biased, disconnected distance. We created an easy, friendly experience for the regular, non-technical average Joe.

Every screen had to be carefully thought out and put in place. Even though these are not the most used pages, they can easily break a sale altogether if misconfigured.

One financial change.

Billing struck us the most, fair to say. Far too complex and even harder to understand. In a nutshell, too many billing models and payment methods, from subscription plans to add-ons purchased with virtual credits. We discovered users found it stressful and incomprehensible.

The billing was day and night. Both visually and structurally.

Consistent. With a Design System.

Zoko will scale from where we left off. We made sure no knots were left untied with one of the best, more comprehensive Design Systems we've ever assembled. Scalability and consistency are ensured.

"The Significa team is world-class.

They quickly understood our product, what we needed to achieve, and helped us develop a fantastic structure and design system. The proof is in the pudding.

We have been expanding our product with their design system, and it has been working out great!"

Arjun Paul, Founder and CEO at Zoko

That's all for this one. Thank you for scrolling all the way down here 🙏

If you still here, press L for some love.

Designer: André Furtado

Team: Pedro Brandão

Our website @ Significa

More of our stuff: Behance | Twitter | Instagram

Significa
Think. Design. Develop. Launch. Repeat.

More by Significa

View profile