Chat Flow: Decluttering, One Flow at a Time
Chat Flow is one of Clickatell's flagship product that helps users visually build and to automate self-service experiences. It is used to create engaging chat experiences and deploy them across multiple channels.
Role: Lead Product Designer
Tools: Figma, Userbit, Figjam, Optimizely, Hotjar
Year: 2021
Duration: 2.5 Quarters
Project Overview
At Clickatell, I led the effort to solve a frustrating gap in Chat Flow, our platform for creating automated chat experiences. Users couldn’t delete outdated flows, leaving cluttered interfaces and inefficiencies. This wasn’t just a user issue—it impacted business metrics like support queries and customer satisfaction.
The Team
- 1 Product Manager
- 1 Tech Lead
- 3 Front-End Developers
- 2 Back-End Developers
- 1 Lead Product Designer (Me)
- 1 UX Director
- 1 Tech Writer.
Why the Mess Needed a Fix
Managing chat flows was like finding a needle in a haystack. Users struggled with:
🚮 Clutter Overload
Too many outdated flows cluttering workspaces.
🤙 Hacky Workarounds
Burying unused flows in folders just to keep things tidy.
⚠️ Risk Roulette
Deleting a flow could disrupt live user interactions if it wasn’t properly managed and executed.
What We Heard: Insights from the Frontlines
To tackle this, we dug deep into user behavior:
- User Interviews and Surveys: Direct feedback was solicited from a diverse group of users, revealing that the lack of a deletion feature led to a cluttered interface and increased cognitive load.
- Data Analysis: Engagement metrics highlighted a trend of users attempting to bypass the limitation by nesting unused flows in deeply nested folders.
- Comparative Analysis: We studied other visual automation tools to understand industry standards and best practices for managing user-generated content.
This research paved the way for designing a feature that was not just functional but also user-centric, considering the psychological and practical aspects of deleting user-created content.
75% of users said clutter impacted their efficiency.
30% admitted they avoided deleting flows out of fear of breaking something.
Competitor analysis revealed smoother deletion processes elsewhere.
COLLECTING FEEDBACK FROM USERS
CREATING A TAG DATA SET FROM USER INTERVIEWS
RUNNING OBSERVATION STUDY WITH USERS
“We never had the option to delete flows. We simply reused or moved them to a thrash folder...”
The Maze of Deleting Flows: Why It Wasn’t Simple
Deleting flows might sound straightforward, but the devil was in the details. Users wanted to clean up their clutter, but managing flow deletion in a way that avoided breaking things required extra care. Here’s why:
Sandbox vs. Production: Flows in test environments (sandbox) and live environments (production) couldn’t be treated the same way. Accidentally deleting a production flow could lead to serious business disruptions and loss of revenue.
Interconnected Webs: Many flows were linked to others, creating dependencies that could unintentionally disrupt live processes. Imagine pulling one thread and unraveling the whole sweater.
Exploration Phase: How We Dug for Solutions
To the drawing board!
The design process kicked off with a thorough exploration phase, ensuring we truly understood the problem and user needs:
- User Workshops: We hosted brainstorming sessions where users showed us their workarounds for managing clutter—folders within folders and color-coding chaos.
- Behavioral Analysis: We reviewed analytics and found that 40% of flows hadn’t been used in over a year, signaling a need for cleanup tools.
- Competitive Research: We looked at other tools in the space, learning from their best practices and shortcomings.
- Prototyping and Testing: Early prototypes included options like archiving flows, visualizing dependencies, and step-by-step deletion workflows. User feedback helped refine the final solution.
This exploration ensured the feature wasn’t just functional—it was intuitive, secure, and aligned with real-world usage.
Our Magic Wand: The Solution
We created a robust deletion system that was simple, secure, and smart:
Smart Alerts:
Flagging dependent flows and other steps before deletion.
Sandbox Safety Net
Multi-stage deletion process and checks for test environments.
Admin Approvals
Guardrails for production environments to protect live operations.
Deleting Sanbox Flows (Safety Net)
Adding a new overflow menu with a delete option.
Full page loader to check for errors
Modal to show users if there are errors in deleting the flow. User will have to fix and disconnect these flows in order to delete.
Modal states
If no errors are found when deleting show users with a confirmation modal instead. User will need to enter a reason before deleting.
States of the confirmation modal
Confirmation when the flow has been successfully deleted.
Deleting Production Flows (Admin Aprovals And Guardrails)
Deleting production flows follows the same journey as a sandbox flow deletion with the only change being that all deletions will have to be requested and approved by an admin.
Caution modal to inform users that the flow is a production flow
Once errors are fixed user will have to request the flow to be deleted
States of the flow deletion request modal
Confirmation that the flow delete request has been sent and can now only be viewed only while awaiting approvals
Admin Approval For Flow Deletion
After flows have been sent for approvals, an admin user would then review these flows and approve these flows to be deleted from production.
Admin users sees new flow deletion request from the blue dot notification on the Manage and Approve Flows drawer
The new and update drawer shows which flows are for deletion requests. Admin user will then review and choose accordingly.
Admin user is then ask to confirm their selection.
Outcome and Impact:
Outcome and Impact:
Post-implementation, the new feature was met with positive reception. Data and user feedback indicated:
- Enhanced user engagement and platform cleanliness, with a noticeable decrease in dormant flows.
- Improved user satisfaction metrics, with particular appreciation for the user-centric design approach.
- A decline in customer support queries related to flow management, indicating a more self-sufficient platform.
“I'm really impressed with the new delete feature. It's user-friendly and makes managing flows so much more straightforward. ”
“I was genuinely impressed with how the new delete feature was integrated. It’s intuitive and how safely it's been implemented. ”
Learning & Reflection
Reflection
While the introduction of the delete feature in Clickatell's Chat Flow has been met with positive feedback and has enhanced the user experience, I find myself reflecting on areas that could be further refined. I still find the error prevention process of flow deletion for users to still be a cumbersome task. Somehow, if Chat Flow in the future could streamline that process even further I would be in a much happier place. Perhaps exploring options of archiving rather than deleting flows or perhaps an option to delete production flows entirely and informing the users of broken flows in a different way. As always, one milestone at a time 🙂.
Follow me
Want to get in touch?
Email me at: hello@chelms.ca