B-hyve smart sprinkler timer app redesign
Context
B-hyve is a smart sprinkler timer app that allows you to control or monitor your sprinklers from anywhere in the world with the convenience of your iOS and android smart device.
Problem
The B-hyve app was outdated and not on brand. The app had a lot of inconsistencies: "It was hard to see the buttons and input text fields" according to home owner's. The app didn't have a define hierarchy such Headlines (H1, H2, H3, H4, H5, H6, Subtitles, Body, Caption, Buttons and Overlines.
Goal
To improve the overall B-hyve app look and feel.
Design the app in light-mode and dark-mode.
Bring the app up to date without changing existing user flows and features.
Make it easy for Home Owner's to see buttons, labels, input text fields, improve hierarchy and to design the app on brand (B-hyve branding).
Users
Home owners with B-hyve Smart Sprinkler Timers
Role
As the only UX Designer in the team, I lead the design process to redesign the app. I worked closely with a Product Owner and 4 mobile software developers.
Tools
Figma
Timeline
8 Months
Before the redesign.
In-person Users interview Insights
Most home owners do not actually install the underground sprinkler systems, they pay contractors to install the system.
Home owner's only install/replace the Smart Sprinkler Timer.
Home owner's love the B-hyve app but they wish the app would allow then to create and set more than 4 programs (A,B,C,D.
4. Home owner's want to save water.
5. Most home owner's don't actually use Smart Watering feature from the B'hyve app. They mentioned that Smart Watering did not worked well for them. (Note: This home owner's don't enter all the necessary information for Smart Watering to work)
6. Home owner's love the B-hyve app but they mentioned that is hard to see buttons, input fields, and the font is to small.
7. Some home owner's want to water all zones at once. (Note: Running multiple zones at once is usually not possible due water-pressure and flow limitations at residential properties.)
Competitive Analysis Insights
Not a single competitor supported dark-mode feature in 2020.
Most competitors used large imagery in the app: To display users lawns.
Some competitors actually used an existing design systems (google materials for android, Human Interface Guidelines for iOS ) to build their mobile apps.
Most competitors used white backgrounds to display users data in a legible way.
Most competitors actually use their brand colors in their mobile app.
Visual competitive analysis
Visual Design
I used the existing B-hyve branding for the mobile app redesign.
Mobile App Site Map
I designed a visual mobile app site map to help non technical members understand how the app flow works. In this case this home owner has 3 smart sprinkler timers and flood sensors.
Design Solution
I designed a new version of the B-hyve app in light and dark-mode version. Both versions of the app are more legible for our users.
Since the B-hyve app had background image which decreased the legibility of labels, buttons, etc, I decided to use white background on UI components and a light gray background for the entire app in light mode. Most labels (text) are black color in light-mode. Most buttons are B-hyve yellow color in light-mode and dark-mode.
The old B-hyve app used to display zones images in circles. For the redesign of the app I decided to display lawn images in squares, to use the app real-estate better.
In addition, I used google material design system for android and Human Interface Guidelines for iOS to design most of the B-hyve app.
Bhyve app Onboarding
This onbording is use to onboard new B-hyve devices via Bluetooth or WiFi.
The main improvements made to this onboarding was: Clear user feedback for each step when onbording a B-hyve device. Legible titles, copy, input fields, buttons and direction's to take on each user interface. The onboarding process takes less time 1-2 minutes to onboard a B-hyve Timers compare to before 2-5 minutes.
Calendar
View all past and future scheduled watering programs.
Programs
Program Slots for users to scheduled watering programs.
Home
Rain Delay, Stop and Skip feature.
Zones
My Bhyve
Zone Details
Smart Details
My Devices
Program Details - Part 1
Program Details - Part 2
Program Slot
Calendar Day view
Manual Watering
Manual Watering - Run Time Selection
Starting Manual Watering
Active Manual Watering
Rain Delay, Stop and Skip feature.
Rain Delay options
Rain Delay feature: 12 hours, 24 hours, 2 days or more.
Rain Delay
Rain Delay feature: More than 2 days.
Push Notifications
Help
Soil type
Plant Type
Sprinkler Type
Sunlight
Rainfall
Slope
Schedule Adjustments
Feedback
For you
Soil Moisture
Results
In May 2021, we launch a new version of the B-hyve app in light and dark-mode version. Both versions of the app are more legible for our users. Since I'm the only UX Designer at B-hyve, my responsibility was to redesign the entire B-hyve app using Figma. I used google material design system for android and Human Interface Guidelines for iOS.
After launching the new look and feel of the B-hyve app we saw lots of positive customer reviews on both the App Store and Google Play Store. The app rating on iOS and android increased from 3.8 stars to 4.1 within 3 months of launching the new design. Now, in 2023 the ios app has 4.7 on the app store and 4.6 on android.
In May 2021 the app had about 500,000 users, now the app has more than 1.7 millions active users in the entire world.
Reflection
The team was very happy with the B-hyve app redesign. Looking back to the entire process, I wish I had more time on this project to conduct more user interviews and user testing, specially for the Smart Watering feature.