My contributions & solution
I designed the experience of:
helping operators define areas of interest in camera feeds
and configuring analysis models for those zones
I also:
built production ready prototypes using claude code
rapidly tested & iterated for quick user feedback
Onto the problem I solved
earlier,
users could only define only one zone
but now,
they could start configuring up to five
Usability issues were
hindering the adoption of this feature
no affordance that users could draw multiple zones
no cue that zones could be configured individually
object-level customization wasn’t implemented
Previous user research insights helped me establish constraints
1
The user group varies in technical experience and expectations, ranging from low-code to highly technical
2
Stakeholders can articulate pipeline outcomes,
but rely on other teams to translate those goals into solutions
Constraints established earlier by these insights
The solution needed to be templated enough for non-power users to ghost-drive the pipeline through
/ phrasing the problem
how might we
help users easily define multiple zones and configure models at an object level in them?
Idea one:
Progressive panels for multiple levels of filtering
Tradeoffs in this approach:
Supports the granularity in customization required, and made zone creation more discoverable
Excessive nesting depth causing cognitive load, too many user goals in a focused UX pattern (modal)
An exploration: there’s so many actions, how do we fit them in a single modal?
Idea two:
Splitting the task goals into different nodes
Tradeoffs in this approach:
Separation of concerns, a granular pipeline is easier to understand and debug
The user is required to manually place and connect model configuration nodes
The two user goals are split into two steps now, visually mapped on the pipeline canvas
feedback from users after testing:
no clear design won! users pointed out things working and ones that weren’t
What users preferred
Users preferred the complex multi-panel approach because they could preview the zone while configuring models
What users pointed out
non-power users found it tough to build their own pipeline
and add workflow blocks
Idea three:
bringing feedback from the previous iterations together
Tradeoffs in this approach:
Previews show how data flows through the pipeline, making it easier for non-power users
Tabs in the side drawer might not scale if we add more models in the future
I finally prioritized across solutions
by evaluating them against the design goals from research
The Final User Flow
Why this solution works:
A node-level preview of the zones helps users visually track how information flows through the pipeline
Each zone auto-maps to an event analysis node by default, catering to the template model
Placing all model options together saves the user the effort of building this part ground up
Learnings & Conclusions
This was but a snapshot of my process, let’s connect to take a deeper dive!
The change in perspective question framing brings
My ideas radically improved when I shifted from designing for tasks to designing for outcomes.
Put the bad ideas on the canvas too
Though initially hesitant, bad ideas helped me define creative boundaries & find unobvious feedback.