The first concept was to use a modular design similar to the Windows 10 look. This way things could be moved around to the liking of the user. After some user testing it seemed as though that was a bit over the top for a thermostat dashboard. After taking away that ability the dashboard then seemed too clunky. We were displaying a small amount of information on a large screen which made things a bit difficult, and we had to find a balance between information and functionality.
I came up with the concept of breaking the grid with some 45 degree angles. This worked for a couple of reasons. It helped to balance out the layout and gave it a sleek look, while leading the users eye to important buttons and information. After a second round of user testing it turned out that still wasn’t enough. Users are used to buttons having words on them that tell them what to do, i.e., “learn more.” To get over this hurdle I decided to make the icons look more like buttons by adding a drop shadow and giving them a bit more dimension. Just in-case that wasn’t enough we made the icons/buttons the only circular objects on the dashboard and gave them color to make them stand out a bit more.
We choose do display the information on the screen with a black and white color pallet. The high contrast between black and white helped to make the important information on the dashboard stand out more. We also used pops of hot and cold colors to highlight other important information pertaining to heating and cooling.
For example: Stage 1 and 2 heating are located in an orange box while the cooling stages are located in a light blue box. When stage 1 heating kicks on in the building, an orange bar will underline S1.
A fun little element we added was the motivational quote. The quotes were randomly generated so every time a user logged on they would get a different one. This was to help make changing the temperature seem less tedious and give the user a little more out of it.