Aircuity is the smart airside efficiency company providing building owners with sustained energy savings through its intelligent measurement solutions.
Create a new platform, which includes both desktop and website applications, will significantly reduce energy costs and improve safety and productivity, while achieving quantifiable results for smart buildings with Aircuity.
My responsibility is to rebuild and redesign its current MyAircuity web dashboard structure/wireframe and create an intuitive new user interface that can provide actionable insights, transparency and accountability to building owners and facility managers.
4. Parameter summary
5. Service & Maintenance.
1. Data Capture - Faster & easier
2. Project Status - Identify key stages, roles, and responsibilities
3. Reporting - Critical information to stakeholders
After many rounds of interviews and workshops with stakeholders and Aircurity team, I have noticed a few pain points from the original dashboard.
1. Users don't know which section they should be look at first due to the same scale spaces.
2. Users cannot easily understand the meaning of each graphic without any text description/explanation.
3. Trend section displays 12 months data on the left side of the dashboard, however, the limited space congest its graphic. Legibility level becomes low.
4. In the savings section, the money and energy savings information which user cares the most have been pushed into the corner.
5. Too many empty spaces are wasted. An unnecessary large scale meter face dominated the entire space.
6. In general, the dashboard text size is too small, It reduces its legibility dramatically.
As mentioned earlier, stakeholders pay closer attention to the information related to money and energy. In addition, they think a good dashboard suppose to deliver information quickly, accurately and clearly. In order to achieve those goals, Many different options and improvements for the new dashboard have been explored:
According to the user feedback and requests, a few changes have been made to the new structure:
Following human natural reading behavior, all sections navigate through a linear direction, from left to right. A brief summary will not only conclude and explains all information from this page but also drives users' attention to the most interesting infographics.
Savings & Trend Section
Creating a layout hierarchy by unevenly distributing the spaces. Insert the most valuable data at enlarged space can visually capture user attention quickly.
Generated a few different graphic layouts and details, identified both pros and cons to create the best user experience in terms of page spacing; graphic stylings; information sequencing, and data trending indication.
Original Chart includes two data points. One is the current savings amount. The other is the expected amount. It will cause some confusion.
Reduced complexity by focusing on current savings only and additional point-up/down arrow indicate the performance trend, User can gather information easily and quickly.
Stick with user's left to right reading behavior, the more important data and the message is not only on the left side of the savings section but also at the center of the whole page.
Thinking outside of the box by inserting and enlarging a circle shape in the middle of the section to break through its tradition layout. however, the circle doesn't go well along with the other rectangles.
Replacing all stiff rectangle shapes to circles made this dashboard more fresh and energetic look. Circle shapes made the user easier to focus on what they want to see and create more breathing space.
Based on Aircuity brand color, numbers of related color palettes were developed, bright and warm colors are used as signs of warning to attract user's attention.
The web-based dashboard contains two different sections, the first one is for users to stay on a higher level to obtain information more efficient. The second section allows the user to discover more project details. Aircuity brand color is the most standout color which purposefully associated with the most important message on the page. The goal of this design is to make the dashboard fresh-looking, easy understand, and simple to use. Each element serves a purpose to deliver the correct message to its audiences.
“Twisthink’s vision and strategy were an invaluable part of our success. The team’s combined experience in integrating software and interaction design made them brilliant contributors to Aircuity 2.0. We are migrating our entire portfolio of over 700 installations in 17 countries to the Aircuity 2.0 platform.”
“The MyAircuity web app was designed with users’ input and moves beyond simple data trends to deliver deeper analytics of cost and energy savings, indoor environmental quality responses, and occupant behaviors. The redesigned user interface presents the highest priority information for each stakeholder, on demand or delivered to their inbox or mobile device.”
“Aircuity, creator of measurably better environments, announces the release of new features and enhancements to Aircuity 2.0’s MyAircuity web app. The MyAircuity web app houses Aircuity’s intelligent analytics along with offering graphing and exporting for further exploration of trends seen on the dashboard.”