Kierstyn Olivare

The Story

In 2019, I assisted Johnson Controls, a leader in HVAC equipment, with a four-month effort to redefine their popular line of sensors. The existing NS8000 family of sensors included mechanical and seven-segment iterations for use in commercial spaces. To stay competitive in the sensors market and increase usability, the sensor team proposed a full-color graphical display with touchscreen capabilities. This device would function similarly, but it would be more desirable for office spaces, patient rooms, or other occupant-facing spaces.

My role in this project was Lead Designer for a team of two.

The Challenge

After meeting with subject matter experts, such as the product team and technicians in the field who install and repair the devices, it was identified that the device would be sold globally to our consumers in China, India, Europe, and the United States. However, in order to maintain cost and technical requirements, the device was unable to house a dictionary for translation. Therefore, we needed to generate an interactive UI that could be interpreted by users around the world.

The problem to solve: A language-free UI that is understood by any building occupant who enters the room.

The solution: A simple, icon-based UI tested by users from various languages and backgrounds to ensure a universal understanding of iconography and workflows.

Process

Discover

Knowing that finding the right iconography would be the most important piece of this product’s success, I teamed up with a UX researcher to tackle the effort and get the designs in front of users. The researcher and I made a list of all the actions and information needed in the UI and brainstormed a list of potential icons. We then took that list and scoured the internet to ensure that they would apply to all of our markets. Some of our findings included:

• The hamburger menu has low utilization in some markets and has a placement concern for left to right languages, so we opted for bottom navigation.
• Avoiding directional arrows due to mirroring requirements for RTL languages, so we kept everything at one level of navigation

Define

With some workable icon ideas in hand, I started mapping out the interface design. As the first touch-screen display in the NS8000 line-up, I used the previous generation as a jumping-off point. I re-worked the design to accommodate the touch screen and create a unified style with the rest of our modern product line, creating a simple clickable prototype.

To test the concept, we set up a test in UserZoom test with participants from around the globe including; India, China, Germany, France, and America.

The feedback was overwhelmingly positive with over an 84% success rate for all tasks, with an average time-to-task of 18 seconds. The primary hang-ups were centered around a lack of affordances in some places to inform the user that the area is interactive and how they should interact with it.

Develop

With a validated concept and clear areas for improvement, I added in the affordances with the continuation of blue as a button indicator and additional labeling for metrics. With the changes in place, we developed a high-fidelity prototype in Axure for some robust usability testing, ensuring to capture the same tasks from the first round of testing. We conducted a second round of research using the prototype and saw an improvement from 84% to 89% success rate and a time-to-task decrease from 18 to 9 seconds.

While a successful, final design in hand, the project was completed in early 2020 and released to the market. An article of the product release can be seen below.