Garden Guru

Overview
With a team of three other designers, I designed Garden Guru, an application that helps users learn how to take proper care of their plants and stay in routine with both their real and virtual plants.

Type
UI/UX, Mobile Application Design

Tools
Figma

We ideated Garden Guru to to help users learn how to take proper care of their plants and stay in routine with both their real and virtual plants.

Users should have the ability to take pictures of their house plants and identify the type and needs for that specific plant (AI-based recognition), interact with an in-game virtual version of their plant and garden, and take quizzes to earn in-game money and learn more about their plant. The AI can produce questions based on what the user has already learned, and users can answer them and receive feedback on their ability to remember. The AI will be trained off of the kinds of questions users get correct versus wrong. Based on what questions the users continuously get incorrect, the AI will generate more questions of that type to provide to the user so the concepts they are weakest in will get reiterated. The app will also have a plant recommendation feature where it suggests plants based on what plants the user already has, where the AI uses information from the user’s existing plants to recommend new ones.

One app that inspired us to design this app is Planta, a plant care and health application that helps users identify, care for, and track their planets. The app includes features such as setting reminders for watering and repotting, guides about how to properly take care of a specific kind of plant, and plant recommendations.

Another app that inspired us to design this app is Neko Atsume, a mobile cat-collecting game. Users can interact with their cats as well as expand their gardens and purchase various foods, toys, and furniture. This game has been successful because there is incentive for users to come back to the game and take care of their cats – they can earn money as well as new foods, cats, furniture, etc.

We conducted focus groups to find out more about our target audience, plant caretakers, and how we can better appeal to them. Also, we just wanted to find out new possible ideas for our app. We recruited participants by proximity and interviewed our roommates.

Our target participants were young adults (college students aged 18-21). These participants also enjoyed game incentives, used their phone often, and had the desire to care for plants. Our group ended up running two focus groups, with two members of our team conducting each one.  All 7 participants were ages 19-20 and students. Some had part-time jobs as research assistants/TAs or interns. In both groups, participants had experience with similar apps involving simulations and/or tracking features, like Neko Atsume, Minecraft, HayDay, Fashion Story, and Reminders.

At the start of the session, we explained the purpose of our app and how it would be structured: it would be game-like with users having their personal virtual gardens to care for, while simultaneously learning more about their real plants.

The main questions we asked were as follows:

• How often do you see yourself using this app?
• Which aspects of the app can be improved to better your experience?
• What problems/frustrations do you foresee when using this app?
• Are there ways in which the app would make you want to use it more?
• Do you picture this app more as a game, a way of learning, or a tracker for your own plants?

As a group, we also decided not to ask questions based on the app’s UI or aesthetics because we felt it was less relevant and most of our participants did not have any kind of design background.

A few important personas we also defined were Aerin, Kelly, David and Robert. Each of these personas focused on a different important aspect of Garden Guru and helped guide us for our focus groups.

When asked about aspects of the app that can be improved to better their experience, some participants emphasized that timely notifications would be helpful since users may forget to go on the app to check when they have to water the plants. Making these notifications playful and friendly would also make the experience more enjoyable, such as “Henry / real plant: ‘I’m so parched, please fill me with 2 cups of water’”.

A frustration that was brought up was that if the users’ virtual garden was flourishing but his/her real plants were dying, the user would be upset. One possible solution was a chat bot with a real gardener in case the user needs professional advice or assistance.

Between both groups, participants wanted the in-app game to have more interactive features such as more kinds of purchasable items (worms, pots, animals, furniture, etc.), the ability to visit friends’ gardens, and “Pokemon Go” characteristics where the user can go around and spot/log plants they can learn more about later.

One participant emphasized a desire for a learning aspect to gain more knowledge about plants; this could be incorporated through word games, trivia, and competitions.

︎ Target population

Young adults and students. Often, this user group looks for escapes from their busy daily lives and would thus feel incentivized to have a platform that both makes their lives easier with plant care and is fun.

Motivate users to take proper care of their plants and make the UX fun through the game aspect, where users handle their own virtual garden that replicates their real plants. Success would be measured through earning in-game currency, since users are able to earn rewards through actions like watering plants, giving them sunlight, and taking care of them on time. The app would also be useful as users learn how to take proper care of specific plant types.

︎ Usability design principles

We wanted everything to be accessible and easy to use. We wanted the completion of a task to be efficient so users do not get frustrated, as well as a heavy focus on learnability since Garden Guru’s main objective is to teach users more about their plants.

For our high-fidelity designs, we wanted to make a simple but cute aesthetic with a focus on shades of green since Garden Guru is a plant care app. Similarly, we wanted the typography and icons to be on the simpler side with no shading or details. We also strove for the navigation to be as straightforward as possible with written directions if necessary.

We created all illustrations and visuals on our own and made sure to implement our designs with user-centered heuristics in mind.

User onboarding and importing a plant into the virtual garden:

Buying a plant and placing it into the garden:

Watering plants and checking care guides:

Testing knowledge about the plant:

For our wizard of oz study, we decided to consult another group of four people in our class and have each user complete tasks with our prototype. Our participants were all college students, aged 19-21. The tasks we asked them to perform were: transfer your real plant to your digital garden, use the in-game store for the virtual garden, keep track of when to water plants, and learn about the plant and take a quiz. Some of the feedback from the participants, which we gathered from their think-aloud and answers to the questions we posed included how the tasks were not too difficult to complete but there could be more guidance especially with which areas to press in screens like the garden.

They thought some areas needed more clear indication that they could be pressed or interacted with and needed distinction from the areas that aren’t interactable. An example of this was continuing in the placement of an item after purchasing and overall navigation. There were also points where the user wanted to exit out of the pop-up or navigate to a certain page from the menu (e.g. calendar and shop), but weren’t able to because some of the pages were only accessible through a certain route in the Figma flow. The users also wanted the ability to water their in-game plants and interact with them more. To improve on our design, we implemented our participants’ feedback by connecting more of the screens in the Figma’s flow and making all buttons able to be interacted with on more screens (such as the back and exit buttons). For example, we created a coin overlay that appears when the user taps on the coin icon/button in the bottom left. We also adjusted small elements in the UI like the back/forward arrow buttons to switch between months in the calendar view, to make them more distinguishable from similar arrow buttons.

For the experimental usability study, we aimed to improve the navigation and overall user experience so users could have clear understandings of how to use our app to its fullest potential.

Thus, we planned to compare 3 screens of the calendar that are slightly different to see what is easiest for users to understand how to use: The arrows next to the month would be displayed in 3 different ways.

We completed a within subjects methodology so that we would see and compare what design was best when the same user goes through the 3 different versions. We recruited 8 college students who were interested in caring for plants. Our independent variable and what we kept the same was the rest of the app screens. However, since we wanted to test the navigation on the calendar aspect, those screens were what was different.

Based on the experiment and feedback we got, we decided going with the first calendar design would aid in navigation and user experience. We ended up changing all of our respective calendar designs to have these arrows instead.

︎ Click here to interact with the prototype yourself!