Designing a new member of the thermostat family
By Diane and Benjamin
Since the Nest Learning Thermostat launched in 2011, its highly recognizable design has become an icon for the connected home and shaped how the world thinks about connected devices. The original product was intended as a focal point. It draws attention to itself, showcasing its technology and innovation much like other screens and displays in our lives. And as it grabs our attention, it serves as an active reminder of the benefits it brings: energy savings, cost savings, and peace of mind.
Over the last five years, our team has iterated, added new features, and fine-tuned the thermostat’s rich interactive experience in pursuit of helping our Nest customers get more from our product and ultimately consume less energy. But, more recently it’s become obvious that we’ve overdosed on attention-grabbing screens and our collective consciousness is asking for other options. As experts in designing for the home, we understand that many people view their home as a sanctuary. It’s a place to shut down, step away from the chaos of our days, and reconnect with those that are most precious to us. With that in mind, our Design team set out to create another option for our customers. Our starting point: How could we create an equally advanced product that blends seamlessly into the home, calling attention to itself only when necessary?
The first step in solving this was to identifying screen technologies that provide equally compelling robust capabilities as a full LCD screen but that could transform the quality and appearance of screens as we know them. Our industrial design (ID) and hardware engineering teams took the challenge head on, entertaining multiple new and emerging technologies, resulting in a decision to use a film-based, frosted-display solution. In partnership, the user experience design and software engineering teams validated the screens capabilities and set out to optimize our beloved features on this new canvas.
What goes into a thermostat experience?
Our user experience team doesn’t just think about what’s in the app. We design our products as a full system, equally addressing the feature development, the physical interaction, the device user interface (UI), the app experience, and even details like the audio design. To that end, we started this process by addressing our new technology and exploring concepts with a wide range of directions. Some were small visual tweaks, while others questioned the entire architecture of our existing thermostat. It was important that we allowed ourselves this space (conducted over a two-week period) to avoid making any wrong assumptions about the best possible experience.
After that phase of idea generation came to a close, it became immediately clear to us that this new product needed to feel like a natural evolution of our thermostat product line. The physical design had already created a precedent of this new thermostat being a sibling to the original, so it felt intuitive to treat the interface similarly. At this point, our attention shifted. We dove deeper into our chosen direction and began to question how we could strategically allow for the product to achieve two things simultaneously:
- Differ in areas where their form, design and intent suggested they should naturally diverge.
- Maintain a connection of similarity such that a single household could house both devices without causing any confusion to the family living there.
We began a period of editing,meticulously combing through each of the existing product components and applying our emerging goals: clarity and familiarity.
The Thermostat Interface Experience
At the core of our design effort was the UI of the main dial screen on the device. Here, we put an emphasis on reduction. If you break down the screen on the Nest Learning Thermostat, much of the design is leveraging a pixel-dense, detail-driven screen. Visual elements are used to provide specificity, but at the same time, they add a layer of visual complexity. In applying our principles, we approached the new product by removing UI elements that weren’t critical to the interaction of adjusting temperature. This allowed us to reduce visual complexity and align closer to our new screen’s capabilities.
For example, we reduced the amount of written information on the main dial screen, allowing space for the more important temperature value elements to be enlarged and to use bolder characters with more saturated colors. We removed detailed elements like the ticks that mark the temperature gauge. And we created more meaning from maximizing and leveraging the white space itself. Additionally, we combed through our secondary screens and templates to increase type size overall and reduce the use of motion.
Given that the new frosted display not only influenced what we put on the screen, but also influenced how users might perceive these elements differently, we ran a series of user studies. These focused on understanding overall usability implications of this new technology and they were able to highlight nuances that were critical to the fine-tuning of our designs. But most critically, this process allowed us to understand the overall legibility as it correlated to screen brightness.
The frosted display technology that we’re using creates a barrier filtering out light emitted from the screen. However, the legibility for the customer is directly related to that brightness. Since the device uses an ALS (Ambient Light Sensor) to determine the light in the room and adjusts our screen accordingly, our team along with the engineering team set up camp in a very dark room, and with great patience, we slowly adjusted the room light and the device brightness until we calibrated a brightness curve suitable for all key environments.
The App Experience
As a team, we treat the Nest App experience as an extension of the device. Interactions on the app should remain familiar to the hardware interactions. And you should always be able to tell which app controllers mirror which devices. Despite phones not having a rotary control or a frosted display, we looked to use a similar visual language to enforce this intended connection.
Our Nest App designs balance skeuomorphic visuals with abstracted controls to retain cohesiveness with our devices. For the Nest Thermostat E, we chose a soft gray background to match the device, designed a subtle edge to represent the lens and provide a guide for the rotary movement of the UI elements, and aligned content to ensure consistent messaging.
One of the main ways customers use the app is to control the thermostat when they’re away from home, so we needed to communicate clearly when the HVAC system is running and when it’s not. The Nest Learning Thermostat’s screen is blue when the air conditioning is running, and orange when the heat is on. For consistency with the thermostat design, we decided to keep the orange and blue numbers and opted instead to introduce soft background gradients as representation of system activity.
The Audio Design
When it came to the sound design of the original Nest Learning Thermostat, we took a “less is more” approach. This is evident with the subtle, yet satisfying and surprisingly rich “click” sound that emanates from the device when turning the outer ring, corresponding visually to individual temperature degree hashmarks on the screen. It sounds like the mechanical output of the parts, but it’s not — it’s actually a digitally controlled element.
For Nest Thermostat E, it was imperative that we enhance the user experience with delight beyond the screen. We introduced a new audio UX that highlights and underscores the UI and ID, while at the same time retains the satisfying thermostat audio UX that our customers have come to expect.
The solution: an ascending and descending pitched click sound that perfectly matches with both the visual UI and the buttery smooth turning of the outer ring when adjusting the temperature up or down. Using the same underlying audio circuitry, we were able not only to add a new bit of innovation and delight, but also to maintain consistency across devices.
Once we settled on the ascending/descending pitched click idea, the next step was to begin prototyping so we could hear what this would actually sound like. We collaborated closely with the embedded software team to create a process that allowed us to bypass the normal SW implementation pipeline and quickly iterate builds on device. This was a crucial step that enabled us to easily try out and review ideas without burdening our engineering team. This also let us hear how the sound was affected by the inherent acoustic resonance of the new device (which is a different material than the original thermostat), and make quick adjustments to the frequency parameters in order to optimize the resulting click sounds.
One big challenge was to design the frequency response of the clicks so that they struck just the right balance — noticeable and impactful, yet not so overt that the result felt too whimsical or off-brand. Thinking about this through a music theory lens, we started with beginning and ending frequencies that were well over three octaves apart. After some initial excitement at hearing this on device, we realized that this sounded a bit too much like a toy, not a trustworthy piece of home technology. Next we tried a single octave spread. This felt closer but wasn’t quite hitting the sweet spot yet. Finally we implemented a frequency interval of a perfect fifth (in this case, the “notes” were C and G), and this struck just the right subtle-yet-delightful chord that we were looking for.
After a relatively short time of gathering input and continued iterations, we gained a very strong consensus supporting a final design.
So, in the end, Nest Thermostat E was a many-person, multi-faceted challenge to truly design technology that can recede to the background of our lives. Rather than aspiring to an experience that captures your attention, we were able to balance the amazing technology with a quiet and serene effect. And with this we’ve been able to give our customers options that best suit their lives. This marks the beginning of a journey for Nest Design as we explore and define ways to cater product experiences for different needs. It’s one step closer on our journey to create thoughtful experiences for all people and homes, everywhere.
Join us in our mission to create a home that cares for the people inside it and the world around it; click here to learn more about us and to check out our open career opportunities.
The information contained in this blog is provided only as general information for educational purposes, and may or may not be up to date. The information is provided as-is with no warranties. This blog is not intended to be a factual representation of how Nest’s products and services actually work. No license is granted under any intellectual property rights of Nest, Google, or others.
