vSphere Client | Enterprise Infrastructure Platform
Duration: May – January (8 months)
Scope: Platform-wide rollout across all vSphere views
Executive Summary
Enterprise administrators managing large-scale virtual environments (500+ virtual machines per inventory) lacked a scalable and consistent filtering system within the vSphere Client. Filtering-related requests had recurred across multiple release cycles, yet the problem space remained under-defined and fragmented.
An advanced filtering framework was defined and executed in collaboration with a senior designer, product management, frontend and backend engineering teams, and the Clarity Design System group. The resulting system was deployed across every vSphere view.
The solution was not a UI enhancement but a platform-level filtering framework that balanced enterprise-grade flexibility, Angular-based ngx grid constraints, backend query limitations, and performance stability while preserving the mental models of expert administrators.
The feature shipped fully into production and scaled across the platform.
Context
Enterprise administrators operating in distributed environments faced:
– Inefficient filtering across large VM inventories
– Inconsistent filtering behavior between views
– Limited logical condition combinations
– Manual search workflows and post-filter adjustments
The initial brief lacked concrete use-case definition. The core challenge was not adding filters, but defining:
– Which filters should exist
– Which operators should be supported
– How logical conditions should combine
– How filtering should behave across heterogeneous data types
– How the system should scale consistently across the platform
This was fundamentally a systems logic problem rather than a visual redesign.
Role & Collaboration Model
The project was executed in close partnership with a senior designer providing architectural guidance and system-level oversight.
Primary ownership included:
– End-to-end interactive prototyping across all filter states
– Interaction logic modeling (AND/OR behavior, operator semantics, nesting constraints)
– Cross-platform filtering audit (excluding Azure due to access limitations)
– User interview facilitation and research synthesis
– Edge-case persona analysis (high-value customers managing 500+ VMs)
– Engineering-ready interaction specifications
– Presentation in internal design forums (All Hands, Cloud UX Shareout)
Architectural integrity and strategic alignment were guided collaboratively, while execution across research, prototyping, and interaction modeling was driven end-to-end.
This initiative marked a transition from component-level design execution toward system-level modeling and architectural thinking.
Discovery & Research
Interviews were conducted with enterprise administrators responsible for large VM inventories.
Key findings:
– Power users rely on precise operator control (equals, does not equal, before, after, custom ranges).
– Oversimplification disrupts established mental models.
– Logical combinations (AND/OR) are essential for real-world workflows.
– Filtering behavior must remain consistent across views.
– Performance stability is non-negotiable in large datasets.
Although these users represented edge-case personas, they were high-value enterprise customers. Designing for them meant designing for the platform’s most demanding environments.
Core Challenges
1. Defining Logical Integrity
The primary complexity lay in defining filtering behavior integrity across multiple data types.
The system required formalization of:
– Operator behavior per data type
– Equals vs Does Not Equal semantics
– Null and empty-state handling
– Date and time filtering mechanics
– Logical grouping behavior (AND/OR patterns)
– Maximum filter nesting depth
– Hardware version compatibility constraints
Many of these constraints were not formally documented and emerged iteratively through engineering collaboration.
The objective was to ensure predictability and coherence rather than superficial flexibility.
2. Trade-offs
Multiple enterprise-level tensions shaped the design process:
Complexity vs Simplicity
Performance vs Flexibility
Discoverability vs Power
Angular-based ngx grid framework constraints vs Interaction integrity
For example, time-based filtering was explored using simplified preset ranges (e.g., “Last Week”, “Last Month”) to reduce surface complexity.
Research indicated that administrators depended on granular operator precision. Simplification would have reduced UI complexity but disrupted expert workflows.
The final direction preserved advanced flexibility while improving clarity, structural organization, and consistency.
Protecting expert mental models was prioritized over superficial simplification.
3. Technical Constraints
The Angular-based ngx data grid framework imposed structural constraints on:
– Logical nesting depth
– Operator compatibility per column type
– Filter state parsing and serialization
– Backend query translation
– Filter persistence behavior
Rather than introducing fragile workarounds, the interaction model was refined to:
– Intentionally constrain filter depth
– Standardize operator behavior per data type
– Maintain backend compatibility
– Preserve performance stability in inventories exceeding 500 VMs
Constraint negotiation became a core design activity throughout the project lifecycle.
System-Level Framework Definition
The outcome evolved into a reusable filtering framework rather than a single component.
The framework formalized:
– Operator logic rules per data type
– Standardized AND/OR combination patterns
– Applied filter visualization behavior
– Filter persistence rules
– Saved query mechanics
– Cross-view consistency standards
– Responsive adaptations for smaller breakpoints
The framework was deployed across every vSphere view, ensuring systemic coherence rather than localized improvements.
Validation & Outcome
Validation sessions with enterprise administrators indicated strong alignment with real-world workflows.
When asked whether critical filtering scenarios were missing, participants consistently described the solution as comprehensive.
Post-release indicators included:
– Significant decrease in filtering-related feature requests
– No major performance regressions reported
– Strong internal recognition across design forums
– Full adoption across platform views
Administrators described the feature as a substantial workflow improvement compared to prior manual filtering limitations.
The system functioned reliably at scale.
Growth Reflection
This initiative marked a shift from interface-level execution to system-level modeling.
Design thinking expanded to include:
– Architectural constraint mapping
– Backend compatibility awareness
– Operator logic formalization
– Framework-level consistency
If approached today, measurable success criteria would be defined earlier, including:
– Time-to-filter creation
– Task completion efficiency
– Query reuse frequency
– Reduction in support or feature request volume
While qualitative validation was strong, earlier metric instrumentation would have strengthened long-term impact evaluation.
What This Project Represents
– Transition from execution-focused designer to system-level thinker
– Enterprise-scale constraint navigation
– Protection of expert mental models over oversimplification
– Full lifecycle involvement from research to production deployment
– Scalable framework adoption across an entire platform