A single pane of (one-way) glass
Project: Security software design system
Role: Design team leadership, system design, product design
@DockYard
I led a design team to unify Johnson Controls International’s fragmented security software portfolio—accumulated through 15+ years of acquisitions—into a single, powerful platform. The new system reduced operator training time and enabled enterprise clients to seamlessly manage access control and video surveillance across global facilities.
Brief
Johnson Controls International (JCI), founded in 1883, is a Fortune 500 company serving 90% of Fortune 100 companies with fire, HVAC, and security equipment. Their security division manages protection for critical infrastructure including airports, hospitals, and government facilities.
JCI hired DockYard to integrate their multiple standalone security products in a unified user experience and operator interface. The scope of this engagement was explicitly focused on UX and product design, but we took the opportunity to challenge functionality assumptions and promote feature enhancements whenever possible.
It wasn’t impossible, it was just complicated:
Discover and document critical functionality and operator interface conventions across multiple existing security products
Design a unified set of UI patterns and workflows based on user interviews, business objectives, and in-flight engineering efforts
Anticipate subsequent feature development for AI-powered threat detection
Approach
Rather than simply creating a visual layer, we reexamined the entire operator experience from the ground up. Our approach focused on universal patterns that could scale across current products and future acquisitions.
The foundation of any successful user experience is a consistent set of visual and interactive conventions centered on the needs of the operator. Throughout its inception and evolution, our Figma-based design system served as an invaluable communication and documentation tool and provided the building blocks for our team to reliably produce user-centered design.
Phase 1: Discovery
Conducted on-site operator interviews with two enterprise clients, documented findings
Met daily with client-side design and engineering leadership to understand and document existing conditions and pain points
Phase 2: Establish a common language
Synthesized and simplified multiple legacy provisioning and operator interfaces across access control and video surveillance products
Designed flexible UI conventions built to evolve as business and user needs change over time, including a planned expansion into AI-assisted audio and video surveillance
Phase 3: Focus on challenging workflows
Completed a dependency audit to map out existing configuration paths and their respective requirements, including cameras and recording devices, events, actions, and schedules
Devised a common configuration pattern that emphasized connective paths between workflows
Results
The true mark of successful digital design — even when working with highly complex projects — is a system in which both a power user and a novice can have a good experience. Our unified design approach met business goals and integrated feedback from actual customers with a consistent, accessible, and ambitious experience to deliver the deep set of functionalities and operations that make JCI’s software such a powerful product.
Designed for operators: Future-looking, single-platform access controls for comprehensive security operation
Designed for configuration and customization: provides a consistent appearance and function of settings in all workflow areas, and enables easy and understandable movement between configurations; allows access to creating, connecting, and editing workflows in whatever order a customer needs
“JCI Product Language:” Shipped a whole-product design system that includes interface patterns, controlled vocabulary, and brand expression
