Elmoiz
Elshiekh

πŸ‘ˆπŸΎ
Back

TITANproxi

A cloud-based environmental controls system interface for desktop and mobile

Product Type
SaaS, Responsive web application
Company
Argus Controls
Role
Lead UX/UI Designer
Year
2023

Overview

The problem:
Customers are pointing out that the software interface for our environmental controls system is old, difficult to use, and hard to navigate with a learning curve so steep it takes months to train an employee to use and years to master, which in turn makes teaching how to use the system and using the system a job on its own, especially in an environment with a high turnaround.
‍
‍The goal:
The business goal is to create a complementary SaaS product that coexists with the old controls software and addresses the concerns the market has for the old controls software.
The product goal is to address those concerns by surfacing 20% of the most used functions used by 80% of the users in a cloud-based, mobile-friendly, easy-to-use, responsive web application.
‍
The responsibilities:
Lead the product (UX/UI) design.
Conduct user research with the product manager team.
Creation of the design system.
Manage communication with the engineering teams.
‍

User Research

Our users are looking for less complexity and higher accessibility in a consistent experience that facilitates a better view of their greenhouses from anywhere and on any device.

Interviews conducted with growers and head growers show that they prefer ease of use with the right features rather than all the features and functionalities in a complex package as long as they can go back to the old system and use it when needed. Also, most functions outside of monitoring and a subset of irrigation are not used on a daily basis and they are only used by one or two in the organization.

User pain points:
1
Display of environmental information
As the home screen is just a bunch of shortcuts, it looks like a messy desktop only the filtered user can navigate.
2
Nested features
A lot of the daily used features are hidden inside pages and shortcuts if those shortcuts are deleted accessing the information would be difficult.
3
Variance between sites
Every site screen looks different, making it hard to move employees between sites, as they need to learn how to navigate it again.
4
Lack of visual indicators
Most screens are just numbers or text, making it hard to notice variance or changes to sensor values or equipment statuses.
Themes:
1
Monitoring
Checking the environment is the first thing done in a grower's day.
2
Statuses & Equipment
Knowing the status of my equipment helps in making an informed decision.
3
Alarms and information
More informative alarms, without information overload.
4
Irrigation
Manual watering is the most performed task by junior growers.
Primary persona:

The grower is the user who uses the control system interface the most as the main role in the daily operations team. They have a limited amount of experience in the greenhouse, so they need to understand what is happening in the controlled environment to communicate efficiently with the head grower in case of an event.

Gary
The Greenhouse Operator
Age: 35
Family: Married
Education: Diploma in Horticulture Technology.
Hometown: London, ON.
Occupation: Greenhouse Operator/Grower
Time to grow!
Goals
- Become a skilled greenhouse grower and produce high-quality crops.
- Eager to learn about the best growing techniques and technologies.
- Make sure his daily tasks are performed to quality and in a timely manner.
Frustrations
- The steep learning curve and the challenges of adapting to a new work environment/system.
- Finds it challenging to keep up with the constantly changing regulations and market demands.
- Having information on multiple locations and systems.
About
Gary is a new greenhouse grower who has recently started working at a local greenhouse. He is passionate about growing plants and is excited to learn more about the industry.
Secondary persona:

As the user with the most amount of experience with the old controlled system software, they prefer to have a macro view into the facility as they monitor more than a single environment at a time. Also, they need to access that information from anywhere at any time.

Gary
The Head Grower
Age: 40
Family: Married
Education: Biology and botany science.
Hometown: Abbotsford, BC.
Occupation: Head grower
I don’t like going with gut feelings, I need to know if the information given to me is well verified.
Goals
- Make sure that the greenhouse is running as it should.
- Setting up the greenhouse for the rest of the team to do their job.
- Making sure that everything related to the greenhouse gets addressed on time.
Frustrations
- Afraid of unknown external factors affecting my plant recipe.
- Having data and information everywhere. Every program is different, and I often need to make my own excel artwork.
- Having to explain tasks and getting results back from peak season workers.
About
Gary has always been an early adopter, taking medium to high risk sometimes to explore into new ideas and opportunities. After working for a Botany research firm, He took over the greenhouse from his father and had been making investments and small technological innovations enjoying the process and positive outcome that advancements have been bringing him. He has been keeping the greenhouse technologically up to date to his knowledge and always eager to find a new and improved way of workflow and data management. He enjoys meeting with farmers, researchers and sometimes local students to share his knowledge and get feedback.
User journey map:
Actions
Checking environments
Walk around The environmental zones
Alarms check
Irrigation check
End-of-day check
Task list
- Check the monitoring system of each controlled environment.
- Look for alarms.
- Identify which environment needs my attention first.
- Check the status of equipment.
- See the status of my irrigation.
- Walk around the greenhouse to check on the environmental zones, the plants inside them and their equipment.
- Check of zone needs watering and.
- Check if maintenance is needed in any zone.
- Check alarms related to the whole facility.
- Check for alarms related to my greenhouse environments.
- Check if the alarm needs to be addressed urgently or not.
-Look for other factors related to the alarm.
- Check on the irrigation schedule for the day.
- List of irrigation events that have been done for a zone.
-Check if a zone needs manual watering.
-Issue manual watering if needed.
-Update the watering schedule if needed.
Check that all equipment are returned to automatic controls.
- Last check to see if any environmental zone requires attention.
- Check on the status of equipment.
Feeling
πŸ˜΅πŸ’«
No clear way to identify what needs my attention at a glance, making it easy to miss something.
πŸ˜₯
If any system action is needed or a sensor reading needs a check, I need to walk all the way to the workstation or contact someone at the workstation.
πŸ€”
If an alarm needs to be addressed, an assessment of the alarm needs to be done.
☹️
The system does not show what has been watered, and finding the schedule of what is to come requires going through and checking all the time clock watering events listed in every schedule.
😟
I'm worried that I might have missed any zone's equipment left on manual controls, it can easily be missed as there are no clear indicators.
Improvement
opportunities
Highlight the environmental zones and equipment that need attention.
Having the mobile responsive version of the control system software.
- Show clear indicators of the alarm status.
- Show a trend indicator that would help with assessment.
- Link an alarm to the environmental zone where it happened.
Showing a clear timeline of previous and upcoming irrigation events per zone and allowing the user to issue manual irrigations from a mobile interface.
Listing all manual overrides on the site dashboard would help checking on site-wide equipment at a glance.

Wireframes
Design

Listing the information, the user needs where they need it, and making sure it is responsive from the start.

From the initial ideation phase, we knew that we wanted a design framework that facilitates layout responsiveness, and information categorization in sections that can be followed on each screen, so the user would always know where to find the information they seek and the action they intend to do, with this mindset we approached the wireframing process.

Layout Skeleton

Dividing the layout into a grid with primary and secondary sections with the same positional relationship through the different screen sizes would facilitate finding information and ease the recognition process by the user.

Site Dashboard

On the site dashboard page, the primary section is used to show the environmental zones, the secondary section is used to show the alarms, irrigation events and controlled equipment, and the general section is used to display site general information.

Usability Study:

After multiple user interviews and usability tests, we found that users liked the idea of separate sections that are consistent through the software experience, uniformity to the type of data displayed on each zone card and that not all irrigation events are important from a site dashboard perspective, but all are important from an individual zone dash perspective.

1
Zones that need attention
Users want to be aware of zones that need their attention as it's the first thing they do, and it sets their priorities for the day.
2
Secondary section separation
The alarms tap in the secondary section is more important than the rest of the information in the secondary section.
3
Data visualization aid
More informative visualization for the sensor data displayed on the zone card, but without being overwhelming.
3
Manual overrides
Information on equipment left on manual override is important.

Refinement
& Mockups

Taking from the findings of the usability study and building on the concepts of grid sections and graceful degradation, we took the feedback given and created solutions revolving around highlighting zones that need attention, a better hierarchy for alarms, data visualization aid, and a secondary section that fits the user needs better. We also repeated this structure and concepts to the zone dash experience for a less taxing cognitive load on the user.

Accessibility considerations:
1
Colors and contrast
Following the WCAG 2.1 guidelines for better user accessibility.
2
Icons and colors
The use of icons and colors to help communicate the importance and level of alarms and zone status.
3
Tooltips & alt text
Easing access to visually impaired users through the use of tooltips with high contrast and alt text for screen readers.
HiFi Mockups

future steps
& Takeaways

Impact:

TITANproxi gives growers easier access to environmental control systems from anywhere on any screen and creates familiarity using consistency in the experience but also puts the grower's needs in the forefront.
‍
One quote from a customer:
β€œHaving something like this would be beneficial to growers and head growers it would simplify a lot of things here.”

Lessons Learned:

Hardware limitations can be the biggest motivator for software creativity and practicality, but balancing hardware and software is a more involved experience than expected, as you would interact with hardware, firmware and software teams.

Next steps:
1
Monitor the web application responsiveness and pinpoint improvement opportunities.
2
Conduct more user research into alarm communication and user custom branding and configuration opportunities.
3
Conduct another round of usability studies to validate whether the pain points users experienced have been effectively addressed.