Our objective was to work with Generac to develop a multi-product user interface, based on mobile/I.O.T. conventions, that provided intuitive controls for critical generator functions.
Functional Inventory + Icon Library
With training sessions and application research as a basis, a multi-product functional inventory was created to organize all functions and features across all generator product lines. This inventory was then used to normalize and categorize features and expectations into consistent functional categories. Similar features with different names were standardized. Once mature and categorized, a custom icon library was developed to represent key functional concepts. The use of descriptive, language independent, iconography across product platforms reduced training time, facilitated navigation and created more consistent product interactions.
Using the Power Zone interface is intuitive, like a smartphone app. Mobile interactions and behaviors reduce the learning curve and afford most users the ability to intuitively navigate control/status screens using their preferred interaction style.
When managing critical building systems such as gen-sets, quickly and accurately communicating system status is essential. Using a mobile first strategy, our development team explored a range of language independent information graphics to communicate the health of the power generation system.
Key factors contributing to the health of the system were organized using color, scale, foreground/background relationship, animations and relative positioning to communicate status. Options were evaluated with principal stakeholders and end users and an animated bar chart structure was selected as the winning approach.
Power Zone controller software is designed to work on a broad range of smartphone, tablet and PC devices. This flexibility anticipates future devices and allows users to select hardware that works best for them.
Integrated - The Power Zone controller is designed to work as a rugged, integrated terminal or remotely on a mobile device.
To document decisions made throughout the development process, Formation created a comprehensive set of UI Guidelines and a Visual Design Guide. The design guides details all aspects of the system’s layout from screen architecture and icon meaning to control conventions and use of color.