EPIC iO — WirelessWindows App (formerly DeepInsights for Connectivity)
Modernizing a fragmented connectivity platform into a modular, enterprise-grade Angular + PrimeNG application with a unified UX, scalable architecture, and design system ready for integration.
Interface Refinements
A focused look at the improved comparison table layouts, clearer visual hierarchy, and streamlined interaction patterns.
Project Overview
WirelessWindows originated as the modernization of DeepInsights for Connectivity, a connectivity management platform that had become inefficient both functionally and visually. The legacy product suffered from poor UX patterns, inconsistent UI behavior, and a tightly coupled infrastructure reliant on third-party hosting and databases.
The redesign initiative addressed not only the user experience and interface architecture, but also the structural migration to EPIC iO's corporate servers and internal systems — enabling faster data access, modular expansion, and integration with other enterprise tools.
My role covered the complete early design cycle: UX research, heuristic analysis, wireframing, information architecture, ideation, and the creation of a design system built directly on PrimeNG components to ensure development alignment.
Project Summary
Timeline & Team
2024-2025
Senior UX/UI Designer — end-to-end research, definition, and delivery
Tools & Methodology
Wireframe, FigJam, Figma, Angular, PrimeNG
UX research, heuristic evaluation, information architecture, wireframing, design system implementation
Key Deliverables
- • Heuristic evaluation of the existing platform and usability scoring
- • Task flows and restructured IA for monitoring, alerts, and analytics
- • Low- and high-fidelity wireframes for dashboards, tables, and detail views
- • PrimeNG-driven UI system with layout, grids, typography, tokens, and states
- • Component documentation and handoff prototypes validated against Angular behavior
Performance Metrics
Design system adoption across all Angular modules
(validated during staging environment integration)
Faster design-to-development handoff
(measured by sprint velocity tracking in Jira)
Improved accessibility compliance
(based on WCAG 2.1 AA contrast validation and PrimeNG token testing)
Problem Statement
The original DeepInsights for Connectivity platform presented multiple issues at both UX and technical levels:
- Poor usability and visual inconsistency: Unclear navigation, redundant screens, and visual overload.
- Dependence on third-party technology: Including hosting and database management — limiting scalability and ownership.
- Lack of modularity: Prevented integration with other internal EPIC iO products.
- Slow data performance: Unreliable synchronization for network event visualization.
The redesign required a comprehensive UX overhaul and a new architectural foundation supporting both user needs and engineering scalability.
Challenge
The project faced several critical challenges:
- Translating technical connectivity metrics into clear, actionable visual insights.
- Designing UI components that matched PrimeNG's technical constraints while remaining brand-consistent.
- Managing design velocity under shifting priorities and leadership misalignment.
- Ensuring the product could serve as a model for future EPIC iO systems through modularity and consistency.
Approach
Following a comprehensive design methodology:
- Heuristic Evaluation: Conducted a systematic audit of navigation flow, data legibility, and interaction models using Nielsen's principles. Results prioritized areas of friction in dashboard navigation and alert visualization.
- Stakeholder & SME Interviews: Collaborated with product, engineering, and network teams to document workflow logic and user roles (Operators, Engineers, Managers). Identified opportunities to align UX flows with backend API capabilities.
- Information Architecture & Flow Redesign: Reorganized the system into modules (Monitoring, Devices, Alerts, Analytics) to simplify data retrieval and reporting. Introduced task-based grouping instead of feature-based menus.
- Wireframing & Ideation: Used Balsamiq Mockups for low-fidelity layouts and FigJam for collaborative IA workshops. Iterated on dashboard structure, alert filtering, and interaction logic.
- Design System Implementation (PrimeNG): Built a full visual and behavioral system using PrimeNG's UI primitives — DataTable, Chips, Cards, Tabs, Toasts, and Charts. Established color tokens, spacing scales, and state patterns aligned with Angular's component lifecycle.
- Hi-Fi Prototype & Asset Delivery: Developed interactive prototypes representing core modules and key user flows. Delivered design tokens, component documentation, and annotated specs for dev handoff.
Solution
The final design unified UX, UI, and technical goals into a scalable ecosystem:
- Redesigned dashboards optimized for clarity and rapid data interpretation.
- Flexible table components with sorting, filters, and live refresh states.
- Reusable component system ensuring one-to-one parity between design and Angular.
- Faster data interaction through simplified layouts and optimized display logic.
- Cross-product consistency with shared design tokens for future EPIC iO integrations.
Results
The project delivered significant outcomes:
- Delivered a modular design foundation adopted by multiple EPIC iO teams.
- Reduced developer ambiguity by designing directly against PrimeNG components.
- Improved visual hierarchy and system learnability across core modules.
- WirelessWindows launched in late 2024, achieving stable performance after a year of iteration and QA under the same design framework.
- Established EPIC iO's first internal design system linked to a production Angular environment.
Key Takeaway
The modernization of WirelessWindows went beyond UI improvement — it redefined the platform's technical and visual DNA.
By aligning design and development from the start, the project delivered a product that was modular, maintainable, and technically grounded, proving that strong UX foundations are the fastest path to long-term scalability.