The seed was planted

This project came to life after I forgot to water my plants—again. After barely resuscitating my Fiddle Leaf Fig Tree, I set to work creating something that was helpful to others and let me practice my UX techniques: a good looking app that reminds people to “water their damn plants”. 

Starting to germinate

Perhaps it was the practicality of the idea itself, but this project marked the first time I truly approached design from a UX perspective as opposed to an aesthetics-first mindset. This meant digging deep and doing a heck of a lot of research, especially when it came to UX techniques and concepts like Use Cases and Persona Creation, along with designing a number of rapid low-fi iterations and prototypes.

Growth & maturation

Old habits die hard (like a Philodendron), and the design on the first version of my app was definitely rooted in aesthetics more than function. However, the next iteration of the app will take more influence from my UX research, including redesigning the sections presenting usability issues. Another issue I encountered was scope creep, as I wanted to expand the functionality before I had built strong roots—err, a solid grasp on the necessary fundamentals. Now, with a deeper understanding and focus on user interaction, the next version of the app will establish more concrete standards of the UX-forward design based around aspects like its CTAs, edit windows, and the transitions between the sections of the app.

The fertilizer

User Personas

I created three user personas for the project, Maggie, Greg, and Betty, to help foster more inclusive design.

<div class="user-persona"> <div class="card default-shadow"> <div class="image"><img src="https://uploads-ssl.webflow.com/600f96ac41927111eb4a3f6d/61edc102713b7a28beac4b52_Maggie.png" alt="A user persona avatar of Maggie"></div><div class="wrapper"> <p> <strong>Maggie</strong> <em>Impulsive, Forgetful, Earnest</em> </p><p><strong>Goal:</strong> Gain better understanding about basic plant care</p><p>Maggie likes to buy plants that are pretty before knowing how to care for them—and they frequently die.</p></div></div><div class="card default-shadow"> <div class="image"><img src="https://uploads-ssl.webflow.com/600f96ac41927111eb4a3f6d/61edc1023eec594f8a309e33_Greg.png" alt="A user persona avatar of Greg"></div><div class="wrapper"> <p> <strong>Greg</strong> <em>Factual, Organized, Obsessive</em> </p><p><strong>Goal:</strong> Catalogue plants and optimize watering/care schedules</p><p>Ever the perfectionist, Greg knows he has a great collection of plants, but wants to find new ways to catalogue and maintain his collection. The grass is always greener...</p></div></div><div class="card default-shadow"> <div class="image"><img src="https://uploads-ssl.webflow.com/600f96ac41927111eb4a3f6d/61edc103e333432b8e5c78f0_Betty.png" alt="A user avatar of Betty"></div><div class="wrapper"> <p> <strong>Betty</strong> <em>Plant Lover, Senior, Diligent</em> </p><p><strong>Goal:</strong> Schedule reminders for watering, pruning, and fertilizing. Wants to share her plants</p><p>Betty takes great care of her plants, but even a retiree doesn’t have enough time to parse through all the information on Google. She just wants an easy-to-use app to help keep her on track with plant care. </p></div></div></div>

‍User flow

#1: Plant owner away 

Betty needs to send care instructions to a friend

• User starts at home screen
• User opens their Collection from the home screen. 
• Collection options 
• Send Care Instructions
• Option to send entire collection or single plants

The priority for this case is being able to send the care instructions both quickly and easily. A number of options for selecting the appropriate plants allows users to navigate flow without needing to stop and think. 

‍

#2: Unexpected New Plant

Maggie stopped by the greenhouse on the way home. She wants to check care requirements before buying plants

• User starts at the home screen, where the search bar is located
• Search is selected 
• Search using scientific or common name 
• List of results 
• The user is able to scroll through results 
• Flicking right on a card allows for additional details to help ensure the correct plant is selected 
• Quick Add To Collection CTA
  

‍

#3: Update Current Plant

Greg has a new bloom he wants to update his current plant cared with

• User starts at home screen 
• My Collection 
• 3 options: Quick Search, List View, Grid View (some people are more visual, while others will have an easier time picking the name from a list) 
• Select desired plant 
• Select “Update” button, user decides if they would like to update from existing photo in gallery or newly captured image.
• Photo is reviewed and accepted or rejected. Accepting the photo would lead back to the plant profile, rejecting would return the user to the gallery or capture method

‍

‍

‍

Wireframes

The decision to go with wireframes came from an exploration into what’s most important to users at first glance. Visual hierarchy is important to help guide the eye down the page, and the design allows for a natural, top-left to bottom-right reading movement. 

<div class="image-grid"><div class="image"><img src="https://uploads-ssl.webflow.com/600f96ac41927111eb4a3f6d/601872fc0f3f2fcafbf9d6b6_plant-care-wireframe-1.jpg" alt="Rough hand-drawn wireframes of my plant app's collection page"></div><div class="image"><img src="https://uploads-ssl.webflow.com/600f96ac41927111eb4a3f6d/6018731c5dd4dce1a1335831_plant-care-wireframe-2.jpg" alt="Rough, hand-drawn wireframes of my plant app's home page"></div><div class="image"><img src="https://uploads-ssl.webflow.com/600f96ac41927111eb4a3f6d/601872fca9342fb1923feab8_plant-care-wireframe-3.jpg" alt="Rough, hand-drawn wireframes of my plant app's plant profile page"></div></div>

Issues

The design of the app’s first iteration was rushed, and I found myself fixated on best practices over what was ‘best for the user’; scope creep was also an issue, as it was easy to get excited and want to add new functionality, before fine-tuning what was already there.