Automation UI Design
Empowering users to automate with confidence.
Overview
What if a feature that's incredibly powerful... just isn’t being used?
That was the situation with the task automation engine inside our WMS. Built by and for engineers, it worked beautifully in the backend, but unless you could read and write logic statements, it was pretty much off-limits.
​
Our goal was to design an interface that brought that power to the surface, so anyone (not just developers) could automate repetitive tasks and personalize workflows — safely, clearly, and without headaches
Role
I led the product design process end-to-end, from early discovery and alignment with engineering, to interface design, content strategy, usability testing, and delivery. My focus was on turning backend logic into a usable experience, and making sure users didn’t need to think like engineers to use it well.
Background
This project took place inside a WMS — a Warehouse Management System that helps organize everything from receiving to shipping in a warehouse. In that world, things need to move fast and accurately. Automations are key to making that happen, since they reduce repetitive manual work, cut down on errors, and let teams adapt operations for each client.
There was already a powerful automation engine running in the backend. It could trigger rules and perform tasks based on logic — but only engineers could access it. As more teams needed flexibility, it became clear that this power needed to be shared. What was missing was a way to turn that logic into something anyone could use.
Problem statement
The automation engine was powerful but hidden behind technical walls. Only engineers could create or edit automation rules, which left non-technical users waiting on devs whenever they needed changes.This caused delays and frustration. Without a user-friendly interface, the people who actually needed these automations couldn’t build or customize them themselves.
​
The challenge was clear: how to turn complex backend logic into an intuitive, step-by-step interface that guides users to create automations confidently, no coding required. Our goal was more than just building a UI. It was about unlocking automation’s full potential by making it accessible to everyone.
​
Main user stories
As a user, I need to define what triggers an automation and under which conditions it should run, so that it only activates when the right context is met.
As a user, I need to define what actions the system should perform when an automation is triggered, so that the expected outcome is executed automatically.
As a user, I need to manage the priority of automations, so that the most important ones are processed before others.
As a user, I need to activate or deactivate automations, so that I have control over when they are in effect.
As a user, I need to view, search, and filter all automations, so that I can easily identify, reference, and manage them over time.
Solution
We decided to structure the experience around a progressive flow:
Events
Conditions
Actions
When... (something happens)
If... (something is true)
Then... (do this)
​It’s a familiar format, almost like filling out a form, but under the hood, it’s configuring logical rules. Below is the low-fidelity prototype of the solution:
The user chooses what triggers the automation with language and layout that didn’t feel like writing code.
Here, things get more specific. What needs to be true for the action to run?
Finally, users choose what should happen. Some actions are simple; others need configuration. The pattern from the conditions step repeats here, keeping things consistent.
If it’s multi-select list we open a side drawer with search to facilitate the user experience.
Tooltips were added throughout the interface to provide just-in-time guidance—clear, friendly hints without cluttering the screen.
The automation list lets users quickly view, activate or deactivate, search, and filter automations by name and order—making management simple and efficient.
The automation details drawer provides a clear, quick overview of an automation’s key info—name, creator, last edited time, and execution order.
It summarizes the logic in a simple “When → If → Then” format, showing events, conditions, and actions. Users can see applicable clients and easily activate or deactivate the automation, enabling efficient management directly from the list view.
Testing & Validation
We tested the design with internal users and support team members who’d eventually use it day-to-day. We wanted to make sure:
The logic made sense
The interface felt approachable
The language was clear (especially for those who don't speak "tech")
Their feedback led to some simple but meaningful changes, mostly around copy and the structure of some inputs. So, at the end:
Non-technical users were able to create and test their own automation flows
Support teams reduced the need for engineering involvement in routine configurations
In the end, we didn’t just ship a feature.
We unlocked a capability that had been hidden behind technical walls — and turned it into something powerful, flexible, and accessible.
What have I learned from this project?
As we close this project, it’s valuable to reflect on both the progress made and the opportunities ahead. No solution is ever final — good design keeps evolving.​ In this context, I’d like to highlight some key points:
Close work with engineering enabled a flexible, technically feasible solution grounded in real user needs.
Usability testing provided critical insights into how users interpret automation flows, guiding improvements in copy and interaction design.
Potential additions like automation cloning, reusable logic blocks, and improved error handling can further empower users.
Thanks for reading!
