Clear steps.
Smarter outreach.
As part of the Outreach Bot System, I designed the Bot Builder: a clear 4-step setup flow and a streamlined list view built to support our campaign managers.



The impact
~40% fewer missed follow-ups.
~30% reduction in daily tracking time.
Scalable outreach control.
Let’s start with the context 🧐
Outlandish is a TikTok-first creator commerce agency powering large-scale brand campaigns and managing 1,000+ creator interactions each month.

1,000+ creators a week.
Half the day lost to replies.
All manual.






Digging into the real problems
I interviewed our campaign managers to understand why the outreach process was breaking down. Their feedback revealed two core issues:
No single place to see outreach activity
No automated follow-ups


We don’t have a single place that shows what’s sent, who replied, or what needs follow-up
Alison · Campaign Manager


Our outreach process is scattered across tools, there’s no single view of the entire workflow
Kenisha · Campaign Manager


We keep rewriting the same follow-up messages every week... it takes too much time
Monica · Campaign Manager


Switching between tools makes it easy to miss follow-ups
Sherry · Campaign Manager
🚨
the problem
🚨
the problem
🚨
the problem
Outreach was scattered and manual, leaving teams unable to see what was happening or keep up with follow-ups.
To solve this, we asked ourselves:
How might we help teams understand what’s happening and handle follow-ups automatically?
Design goal · 01
Create a clear,
centralized overview
Create a clear, centralized overview
Give teams one place to understand all outreach activity
Make it easy to see what’s sent, who replied, and what needs follow-up
🚫 Constraints
Short timeline → minimal UI
complexityFilament-based UI → table-first layout
Limited engineering bandwidth → no advanced state logic




Design goal · 02
Make follow-ups effortless
and consistent
Create a clear, centralized overview
Replace repetitive manual follow-up writing with reusable rules/messages
Make follow-ups consistent so teams don’t miss replies
🚫 Constraints
TikTok API limits automation
No backend automation engine → limited to basic trigger logic
Short MVP timeline → no complex automation
❇️
our solution
❇️
our solution
❇️
our solution
A single place for clear outreach
and effortless follow-ups
Outreach Bot builder
List → Create new bot → Wizard(step1-4) → Confirm
Here’s how I arrived at this solution 🤓
🔍
DESIGN EXPLORATION · 1
🔍
DESIGN EXPLORATION · 1
🔍
DESIGN EXPLORATION · 1
Designing a clear bot view
Starting with an IA
analysis
Starting with an IA analysis
Starting with an IA analysis
I mapped all possible bot signals to identify what managers need to see instantly.
Primary signals (for daily decisions)
Actions
Context signals (to identify the bot)



Before exploring solutions,
I reviewed how other tools organize workflow lists
Most platforms use table-first layouts to manage complex workflows




Dense table layout for fast scanning of large flow lists




Lightweight list view focused on quick review and setup status




Highly structured table with advanced filters for enterprise-scale workflow management
Designing a clear bot view for scale
01. choosing the right data view: cards vs. table
A. Card layout

More visual, richer context
Hard to scan across many bots
Not supported by Filament (no grid layout)
💡Cards emphasize contextual richness
B. Table layout(chosen)



Compact, scannable, scalable
Works with Filament’s native UI
Easy row navigation + clear primary signals
💡Tables emphasize scannability
Designing a clear bot view for scale
02. improving clarity & efficiency by iteration
Simplified the detail experience by replacing the full page with a focused overview modal (faster to build, easier to scan, and better aligned with MVP constraints)








Replaced row-click with a single View button to make navigation predictable



Moved Start/Stop into the table for instant access



Kept Edit/Delete in the overflow to prevent accidental actions



bot LIST VIEW
Instant visibility. Instant control.



🔍
DESIGN EXPLORATION · 2
🔍
DESIGN EXPLORATION · 2
🔍
DESIGN EXPLORATION · 2
Designing follow-up
automation
Before exploring solutions,
I started by reviewing how other tools handle automation logic
Most platforms offer custom triggers
for complex multi-step workflows




Visual flow builder with conditional splits




Rule-based trigger automations




Multi-step workflows using nested logic blocks
However, a complex workflow builder didn’t fit our reality. We needed something simple, reliable, and fast to ship.



Then, how might we
create preset triggers for our use cases?
Then, how might we
create preset triggers for our use cases?
Here are the top use cases that campaign managers repeatedly needed automation for



Designing follow-up automation
01. exploring trigger selection patterns
A. Modal picker


Good for large sets of options
Slow repeated open/close
Heavy for MVP
B. Dropdown




Clean but low visibility
Extra steps needed
Multi-select chips get messy
C. Preset buttons (chosen)


Always visible
One-click setup
Fast + lightweight (best for MVP)
Creates structured data → AI-friendly
Designing follow-up automation
02. choosing the right automation display
A. Timeline view



Our triggers are event-driven, not sequential
Real campaigns fire in unpredictable orders → Looks logical, but doesn’t reflect reality
B. Simple list (chosen)



Accurate for event-based automation
Each trigger = one independent message
Lowest mental load; fastest to build & scale → Best fit for our actual system
Designing follow-up automation
03. improving clarity & safety by iteration

Instant undo makes interactions safer and reduces mistakes



Auto-message previews show exactly what will be sent



Dedicated running section makes active triggers easy to see



Empty-state guidance shows users how to get started



Variables make automated messages feel more personal
4 step Wizard
Set once. Follow up automatically.
Future direction & outcome
Building a Foundation for AI Automation
Building a Foundation for AI Automation
Our MVP is designed so the next step toward AI-recommended triggers and fully automated messaging is seamless.



We turned a complex automation process into a fast, intuitive flow for users today, while giving the team a quicker ship path and a solid AI-ready foundation



40%
Fewer missed follow-ups
Teams no longer lose track of creator replies
30%
Less manual tracking time
Daily spreadsheet check-ins reduced significantly

From no structure to a clear setup
We introduced a preset trigger system where none existed before, giving managers a simple, reliable starting point for automation

Designed for MVP constraints
A 4-week timeline required reducing UX complexity to the essentials, which allowed us to ship quickly while keeping the underlying system extendable

AI-ready structure
By structuring automation as “when X happens, do Y,” we created clean, predictable data for future AI-recommended triggers
What I learned

Build for real use cases, not abstract flexibility
Focusing on the core workflows teams actually used led to a preset-based design that was faster to ship and more reliable than a fully flexible builde

Simple, structured inputs scale better
Using consistent preset triggers produced clean, predictable data
and made the system easier to automate, measure, and extend

Good design needs flexible infrastructure
Our tech stack limited how far interactions could scale.
If rebuilt, I’d add a lightweight custom UI layer to support more advanced automation patterns

