Plant Care App
Description:
The app focuses on diagnosing and treating plant diseases, providing users with an intuitive tool to help keep their plants healthy.
This application is my first independent project, created without a specific client, driven by my passion for exploring both UX and UI design.
Project Type:
Individual UX/UI project focused on designing a mobile app for the care and management of indoor and garden plants.
Project duration:
May 2024 -August 2024
Role:
UX Designer:
Conducted user research to understand user needs.
Created user personas and user flows.
Developed low-fidelity wireframes to outline the app structure.
UI Designer:
Designed high-fidelity prototypes using Figma.
Selected color palettes, typography, and other visual elements.
Created design components for a cohesive user interface.
Ensured consistency in visual design throughout the app.
Tools:
-Figma
-Canva
Methodology:
The project follows the Design Thinking methodology, moving through stages of research, ideation, prototyping, and testing to create a user-centered solution.
Project Overview
The Plant Care App integrates both UX and UI elements. The project includes user personas, user flows, low-fidelity wireframes, and high-fidelity prototypes, demonstrating the combination of research and design aspects throughout the development process.
THE PRODUCT
The Plant Care App is designed to help users diagnose and care for their houseplants.
This app provides personalized care tips, reminders, and diagnostic tools to ensure plants remain healthy.
The primary target users are plant enthusiasts, homeowners, and beginners in plant care who seek an easy and effective way to manage their indoor plants.
THE PROBLEM
Many plant owners struggle to maintain the health and well-being of their houseplants due to a lack of personalized care guidance. Additionally, they often face challenges in making informed purchases of fertilizers and plant care products
THE GOAL
The goal of this project is to create an intuitive app that provides personalized care tips and reminders for houseplants, and guides users towards informed purchases of fertilizers and plant care products.
PROJECT PROCESS
I mainly adopted the design thinking process for this project. While it is not a complete project, and aspects like research and usability studies are not fully developed, this serves as a preview to demonstrate my ability to utilize various design tools effectively.
Research
To ensure that the Plant Care App would meet the needs of its users, I conducted a mix of qualitative and quantitative user research.
Initially, I assumed that most users had a basic understanding of plant care but lacked the knowledge to address specific plant health issues.
I conducted surveys and interviews with 15 individuals of diverse ages, genders, races, and backgrounds.
The research revealed that while some users had basic knowledge, many struggled with identifying and treating plant health problems.
This insight led me to focus on developing a comprehensive diagnostic tool within the app.
Additionally, usability testing sessions helped refine the app’s interface, ensuring it was intuitive and easy to navigate for all users.
Pain Points:
Users often struggle to identify their houseplants accurately. This lack of identification makes it challenging to find specific care information online and address the unique needs of their plants.
Many people lack knowledge on how to properly care for their plants. Understanding how much water to give, how often to water, creating a specific timetable, and knowing which products to use (fertilizers, etc.) can be difficult.
A type of diary to track watering schedules, with an alarm to remind users when to water their plants. This helps ensure that users don't forget to water their plants on time.
Identifying and treating plant diseases and issues. Users need assistance in diagnosing and addressing various health problems that their plants might encounter.
Personas Developement:
Based on the research insights, I developed three personas that represent our target users, highlighting their goals and pain points. These personas helped guide the design process by ensuring that the app addresses the specific needs and challenges of a diverse user base.
User Flow Overview
The primary user flow of the app is designed to streamline plant care and diagnostics.
Upon entering the app, users are presented with two main actions: diagnosing plant diseases and maintaining a personal care diary for their plants.
In the user flow showcased, we focus on the plant disease diagnostics section.
In this section, users will see prominent buttons for photo-Based Diagnosis, where they can take or upload photos of their plants to receive immediate diagnostics and care recommendations.
Additionally, on the same page (though not shown in the user flow), users can access two other sections:
Common Diseases: An informational section providing detailed insights on common plant diseases and preventive measures.
Diagnosis Record: A history section that records all past diagnoses for easy reference and tracking.
Storyboards
To better understand the typical situation an user might encounter when using my plant care app, I created storyboards illustrating how they would interact with the product.
This approach helped me visualize different scenarios and anticipate various user needs, allowing me to design features and interactions that address the potential challenges and preferences of my target audience.
Big Picture Storyboard
Close - up Storyboard
Paper wireframes
The goal I wanted to reach was to create an app structure that is easy to navigate, useful, but also fun to use!
On the home page, I decided to highlight two main functions: diagnostics and the diary, which tracks both completed tasks and those scheduled for the coming days.
For the plant identification button, I decided to make it smaller and place it among other secondary but still clearly visible buttons on the home screen.
These secondary buttons are:
Account: A quick way to access profile settings
Identify Plants
Tricks and Tips: An informative section with community-shared articles and scientific resources, offering plant care tips and tricks
Add Plant: A fast button to add a plant to the diary
I first created hand-drawn sketches of the wireframes, which I then transformed into digital wireframes.
Digital wireframes
In the app’s footer, I included four main sections: Home, Your Plants, Tasks, and Community.
To help users know which page they’re on, there’s a small dot that appears above the current section.
Since the footer is fixed at the bottom, the dot shows up on whichever page you’re currently viewing ( as you can see in the home wireframe below)
Low-fidelity prototype
In the low-fidelity prototype, I chose to display the main user flow of the app, which is disease diagnosis through photography.
Link to Lo-Fi Prototype:
Design solution
For the design solution, I chose a palette of 5 colors that evoke the tones of earth, sun, and green leaves. I avoided overly bright colors like red, pink, or purple to maintain a sense of calm and tranquility. The palette includes:
Green (#91D925): the main color, evoking freshness and nature.
Light Yellow (#F2EA7E) and Golden Yellow (#D9B23D): adding warmth and reminiscent of sunlight.
Brown (#A66D58) and Brick Red (#BF5349): representing earthy tones.
For the text, I decided to keep a medium-high contrast by using dark gray (#525252), ensuring readability without disrupting the visual harmony of the design.
Regarding fonts, I selected Lato in two weights: Regular for explanatory text and Bold for titles.
This sans-serif font offers a clean look, ensuring readability while maintaining a contemporary aesthetic.
The bold weight of Lato provides just the right amount of emphasis, supporting a clear hierarchy.
Mockups
Hight-fidelity prototype
Once the mockups were completed, I created a Hi-Fi prototype to retest the application with the finalized design.
Below, you can find a link to the Hi-Fi prototype showcasing the main user flow for photo-based diagnosis.
Link to Lo-Fi Prototype:
Reflections and next steps
Accessibility Considerations:
Color Contrast and Readability: Ensured all text and interface elements maintain a high color contrast ratio to improve readability for users with visual impairments, including those with color vision deficiencies.
Screen Reader Compatibility: Optimized the app for screen readers by providing descriptive labels for buttons, icons, and images, enhancing navigation for users with visual impairments.
Touch Target Size: Designed touch targets to be large enough (at least 44x44 pixels) for users with motor impairments, improving usability for those with reduced dexterity.
Product Features:
Expand Diagnostic Tool: Enhance the diagnostic tool to include more plant diseases and integrate machine learning for better accuracy.
Personalized Care Plans: Develop personalized care routines based on plant types, user environment, and care history.
Data-Driven Insights: Add analytics to provide users with insights into their plant care habits and suggestions for improvement.
Notifications and Reminders: Implement a system that sends timely notifications and reminders for plant care tasks.
Design:
Cohesive Visual Design: Enhance the overall aesthetic by refining the color palette and typography to maintain a unified and appealing visual style throughout the app.
User Interface Refinement: Continuously improve the user interface to ensure smooth navigation and minimize cognitive effort for users.
Streamlined Onboarding: Develop a user-friendly onboarding process that guides new users through the app’s features, ensuring a smooth and straightforward introduction.
Consistency Across Elements: Ensure all design elements work harmoniously together, creating a cohesive and intuitive experience for the user.
Impact:
The design of the Plant Care Companion App has the potential to significantly improve how users care for their plants.
By providing a comprehensive diagnostic tool and personalized care plans, the app empowers users to address plant health issues with confidence.
The streamlined user interface and intuitive onboarding process make the app accessible to both beginners and experienced plant enthusiasts.
Although still in development, this project demonstrates a thoughtful approach to solving common plant care challenges, with the potential to enhance user engagement and satisfaction.
The accessibility considerations further ensure that the app can be used by a diverse audience, making plant care more inclusive and manageable for everyone.