Inland Valley Garden Planner
Objective
Better User Experience for Increased Retention
Inland Valley Garden Planner (IVGP) is a Chino Basin Water Conservation District (CBWCD) service. Their mission is to educate and inspire California residents to opt for waterwise (California native) plants when planning and designing their landscapes in order to conserve water over time.
The IVGP website had been around for only three years when they first reached out to us, yet it appeared much more dated and had numerous violations of user friendly web design. The client was looking for a complete overhaul of their homepage and the Garden Designs section of the site, which would showcase eight landscape themes in four different yard sizes with interactive hover effects offering detailed information on each plant.
Since the old site was extremely custom, the client had been unable to make even simple edits without the help of a professional developer. Therefore, to deliver on the above mentioned requests, we ended up recreating the site entirely using tools that would ensure the client is able to maintain the site in-house.
Site Audit
Google Analytics
Information Architecture
Web Design
Web Development
AWS
Cloudflare
Elementor
move the slider left to right to see the before & after
Before
After
best foot forward
During Discovery we learned that over 87% of IVGP visitors were new. That, combined with an almost 80% bounce rate, led us to believe that visitors were either exiting the site unintentionally or they couldn’t locate the information they were interested in.
Having carefully studied the homepage and the existing user flows, we discovered that two of the primary pages and the main visual on the homepage lead to the parent organization’s (CBWCD) website.
The first order of business became building out the homepage to showcase the scope of services and information on the website and to encourage visitors to continue exploring what the site had to offer.
“The purpose of the site is to be the central resource for people in our region who want to do a landscape project on their home”
COLOR
Since IVGP is a service of Chino Basin Water Conservation District, their visual identity is strongly guided by that of the parent organization. During this redesign, IVGP wanted to respect the established brand, while also setting itself apart in a bold, colorful way.
We achieved this balance of continuity and differentiation by pulling heavily from the CBWCD’s secondary palette and keeping certain shades of the primary palette as the foundation for the site.
#EEF8EE
#39904A
#5E534E
#F2B715
#EA961C
custom iconography
Proper representation of the plants all throughout the website was of utmost importance for the client. Therefore, when we started working on the custom icons, we exchanged multiple references of the exact plants that fit the context in which the icons would be showcased and had multiple iterations to arrive at the accurate abstracted representation for each type of plant.
move your mouse over the icons below to view the real plants they are based on
bird & wildlife plants
california native plants
plants for clay soil
bigger, bolder, better
Being one of the most important (and visited) pages on the site, Plant Finder needed to offer a smooth user experience from the search functionality to the filtering system and adding plants to one’s list.
In the new iteration of the Plant Finder, the search bar became the most impactful visual element on the page. Per client’s request, we also opted for an alternate default results view which allowed us to accommodate larger plant images and some of the most pertinent plant information right away.
custom “Select list” functionality created for IVGP
Usability tweaks
With the IVGP website, we inherited pre-existing plugins that had to stay in place. Some of them offered less than perfect user experience. As part of the redesign, we customized specific micro interactions (i.e. selecting which plant list you wish to add a plant to directly from the Plant Finder page) to improve the visitor experience.
Garden designs
Being one of the top reasons for this redesign, the Garden Designs required special attention—each of the eight designs had to showcase garden plans in four sizes with multiple angles and array of photographs.
We managed to consolidate this large amount of information with custom tabs and slideshows. This solution also allows site visitors to hover over specific hotspots to see individual plants or see the full list of plants in one comprehensive popup.
scroll inside the image below to see the full page
Thanks for all the awesome and dedicated work you did on this project! We are very happy with the results and look forward to sharing the site with our community members!
