focalpoint
Reframing network visibility through intelligent visualisation
We redesigned the NetScaler Management and Analytics System (MAS) to create a clear operational focal point for IT administrators. By bringing together scattered dashboards into organized network visuals (like topology, Sankey, and geomap), we made it easier to quickly check system health, spot problems, and lessen mental load. The new system positioned MAS as a unified control center for network and application performance.
overview
High-level context on the project scope, role, platform, and collaboration model.
Industry: Enterprise Infrastructure / Network Management
Role: Visual Designer (Wireframing → Final UI)
Platform: NetScaler Management and Analytics System (MAS)
Primary User: IT Administrator
MAS, or Management and Analytics System, is a centralized platform for monitoring, analytics, and orchestration across scale-out architectures. While technically powerful, its experience lacked a coherent visual system for understanding network health at a glance.
the opportunity
Transform the NetScaler Management and Analytics System (MAS) from a data-heavy dashboard into a decision-making surface, which is a platform that facilitates informed choices based on data analysis.
challenge
What was broken in the original experience, and how it affected both users and operations.
Administrators were responsible for ensuring near 100% application uptime. Their day began with a system-wide health check.
- Had no unified overview of all NetScaler instances
- Surfaced excessive, non-actionable alerts
- Forced reliance on navigation-heavy flows and CLI tools
- Presented dense dashboards without hierarchy
The result: High cognitive load. Slow anomaly detection. Fragmented mental models.
Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph.
Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph.
Agent burnout and inconsistent user experience
through the users' eyes.
Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by double clicking on this text to bring up the editor.
my roles
How I led design execution, partnered with teams, and supported change across build stages.
As a Visual UX Designer on this project, my roles were the following:
- For each identified challenge, researched how similar complexity was visualized across enterprise tools, data platforms, and network systems. Synthesized patterns and adapted them to the MAS context rather than replicating trends blindly.
- Created high-fidelity wireframes and interactive prototypes in Sketch to validate structure, hierarchy, and flow. Delivered detailed developer handoffs with specifications for states, transitions, and visual logic to ensure implementation fidelity.
user research
Collaborating with research partners to uncover root problems and validate early hypotheses.
I worked closely with two dedicated UX researchers who led the discovery phase. While research wasn’t my primary focus, I contributed via live call shadowing and collaborative synthesis.
- Call audits exposed workflow delays due to switching
- Live shadowing revealed hidden edge-case friction
- Heuristics helped us prioritize fixes for speed and clarity
Key Insight: Agents relied heavily on muscle memory from old tools. Any new experience needed to prove immediate time savings to earn their trust.
solutions
An overview of the redesigned interface and what workflows it simplified.
It's early 2020. Most schools weren’t equipped for remote learning. Teachers relied on WhatsApp to send daily Zoom links. Parents, adjusting to remote work themselves, had to coordinate class times while managing their own schedules.
What we set out to do:
- Make online classes simple to join
- Digitize scheduling, attendance, and communication
- Launch both mobile and desktop platforms in under 90 days
sankey maps
Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by double clicking on this text to bring up the editor.
geo maps
Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by double clicking on this text to bring up the editor.
topology maps
Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by double clicking on this text to bring up the editor.
mockups
Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by double clicking on this text to bring up the editor.
Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by double clicking on this text to bring up the editor.
Hey there, this is the default text for a new paragraph. Feel free to edit this paragraph by double clicking on this text to bring up the editor.
learnings &
reflections
This project reinforced a core principle: in enterprise systems, clarity is leverage.
Designing network visualizations is not about aesthetics. It is about helping experts orient themselves in seconds. The focal point is not a visual flourish. It is a cognitive anchor.
Selected Works
