What is Callers?
Here's the most familiar example: a Caller is like the video intercom at your apartment building's entrance. When visitors arrive and buzz your apartment number downstairs, intercom unit in your living room will respond - this responding unit is called the Receiver.
Caller Manager is UniFi's Access control system that manages and coordinates these Callers and Receivers.
Callers
Receivers
How callers and receivers work
Business Strategy Background
“UniFi's Strategic Shift from Home to Enterprise Solutions”
/Business Level/
The access control system needs to handle larger-scale device deployments and more diverse configuration scenarios
/Product Level/
New Caller and Receiver releases demand more refined, scenario-specific management capabilities
/User Level/
Users evolve from individual consumers to enterprise admins, prioritizing stability, scalability, and management efficiency
Pain Point 1
Buried entry, unfocused flow, and poor result visualization make Caller & Receiver configuration difficult.
01
The device list, as the entry point, mixes Caller & Receiver setup with unrelated workflows, creating noise and unfocused scenarios.
02
The table-format display in the side panel prevents users from intuitively reviewing and adjusting call relationships.
Pain Point 2
Limited calling methods lack the functionality to support complex enterprise scenarios
Point-to-point doorbell responses are outdated for complex scenarios - users need adaptable multi-scenario management.
After clarifying business direction and user pain points, the Caller Manager project was officially launched.
Project Team Members
Design Owner-hedda
PM-Yen
Developer-Jiahao
Business Phases
/MVP Version/
「Establishment Phase」
-Feature building
-Low-cost rapid implementation
-Meet basic needs, validate direction
/Version 1.0/
「Growth Phase」
-Focus on experience
-Experience drives business
-Pursue usability and efficiency
/Version2.0/
「Maturity Phase」
-Stable experience, refined features
-Become industry standard
-Improve design efficiency
As a two-person team, our strategy was to deliver maximum value with minimal investment. We prioritized "high-impact" features addressing major pain points that fit a "low-investment" budget: 1-3 design days and 1-5 engineering days.
Throughout the design process, I leveraged existing UniFi design system components to reduce implementation complexity.
Design Vision
PROVIDE A MORE CENTRALIZED, IMMERSIVE, AND VISUAL CONFIGURATION MODULE TO VALIDATE FEATURE VALUE AND OPTIMIZATION DIRECTION
Centralized Setting Module
Created a dedicated Caller Manager entry in main navigation, separating Caller & Receivers configuration from other device settings to form an independent management center.
Visual Management Method
Topology-centered management provides users with intuitive visualization and control of Calls & Receivers relationships.
Limited Topology Readability & Scalability
In the MVP version, I displayed all Callers and their paired Receivers in the topology structure, allowing users to expand nodes to view device pairings.
/✅ Strengths/
When displaying a single Caller, the topology clearly visualizes multi-level management relationships
/❌ Weaknesses/
Multiple Callers cause information overload - unrelated Callers become visual noise during configuration. The constantly toggling side panel when managing Receivers creates repetitive, inefficient workflows.
High Learning Curve
In the MVP version, we provided users with different call methods. To maintain our "low effort" strategy, I used tooltips to explain these "call methods" usage and effects, ensuring basic user experience.
However, user feedback was disappointing.
/💡Version Iteration/
We enhanced setup guides with visitor perspective views, hypothesizing that missing visitor context increased complexity.
Post-launch feedback validated this approach.
MVP user observations and feedback validated Caller Manager's value, earning me one more developer and a junior designer for Version 1.0. We'll solve MVP usability problems while implementing high-impact, high-effort features from our priority matrix.
Business Phases
/MVP Version/
「Establishment Phase」
-Feature building
-Low-cost rapid implementation
-Meet basic needs, validate direction
/Version 1.0/
「Growth Phase」
-Focus on experience
-Experience drives business
-Pursue usability and efficiency
/Version2.0/
「Maturity Phase」
-Stable experience, refined features
-Become industry standard
-Improve design efficiency
Design Vision
Adding Call Groups for better scalability. Reducing user friction, streamlining configuration, and boosting efficiency
Challenge 1: Cognitive Load
Reducing friction in setting "Call Methods" to lower learning curve
Design Solution
Compared to the MVP's admin-centric configuration approach, version 1.0 adds visitor perspective to help admins understand configuration outcomes.
We combined "Create Directory" and "Assign Receivers" into one step - replacing MVP's separate batch creation and assignment process with a more intuitive workflow that reduces cognitive load.
Challenge 2: Limited Topology Readability & Scalability
Isolate parallel information, define view roles, and deliver immersive configuration experience.
Design Solution
In version 1.0, we reduced noise in Caller Manager, gave each Caller dedicated configuration space.
We replaced the unified topology with dedicated configuration spaces per Caller and separated "configuration" from "viewing" modes, creating clear user paths and consistent mental models.
You might have already spotted the fresh thinking in our design system!
In the MVP, we used side panels and modals as Caller Manager's primary management approach. These components were commonly seen in the configuration and forms UI, and became high-frequency components used by B-end designers.
But the limitations were clear:
01
They dispersed user attention from primary content or workflow, disrupting user's core tasks.
02
They forced users to switch contexts during operations, reducing efficiency, especially when handling complex tasks.
Can we enable users to complete all their tasks within a single view?
We could use inline editing so users don't have to jump between pages. This would keep them in their workflow without interruption.
It also lowers their cognitive load, users don’t need to remember what they did on the last screen or repeat steps.
Create a Directory Entry
Manage and Add Receivers
Rename Directories
Enable Dial Number
My Contribute
Strategic Decisions & Ownership
Based on user insights and priority analysis, I drove the key feature prioritization decisions for the MVP. The 2 most critical choices were:
Postponing 'Group Management': I assessed that its use case coverage was low for an MVP. Deferring this feature to v1.0 accelerated our launch by a week.
Phasing the 'Directory' Feature: I made the call to split the "Add Receiver to Directory" workflow. This trade-off reduced development complexity, allowing us to ship the core functionality in just two days, while posing a minimal usability hurdle for the MVP.
Cross-functional Collaboration
In our small, agile team, I worked in a pair design model with engineering, ensuring continuous technical validation throughout the process
With Product:
Participated in requirements reviews, providing feasibility feedback from a design perspective.
Rapidly validated product hypotheses with interactive prototypes.
With Engineering:
Delivered detailed design specifications, interaction documentation, and conducted design walkthroughs.
Design Impact
Streamlining Configuration and Scalability for B2B Platforms
Building Caller Manager from the ground up was an opportunity for me to simplify complex B2B configuration. By applying a consumer-product mindset, I designed a validated, low-friction admin experience that minimizes cognitive load.
Besides, the resulting design pattern proved highly effective, covering 80% of common scenarios. It earned praise from leadership and is now being integrated into the official UniFi Design System, scaling its impact across the product ecosystem.
New design pattern has been applied in Protect Application