Case Study: Plant Health UXUI Design
Plant Health - An app for AI disease diagnosis and booking the expert consulting.
1 - Context
Millions of newbie planter in the world a problem of looking for a help “when the plant is sick”. So that I created Plant Health to overcome this issue.
The application is designed for a wide-ranging audience, encompassing individuals of different ages, genders, physical abilities, and levels of tech literacy.
2 - Main features
Diagnose plant diseases from AI (free)
Book consult on how to treat sick plants from a pro expert (charge)
3 - User Scenarios
Scenario 1:
You've just started planting, so you don't have much experience yet. There are some plant diseases appearing on leaves, stems, fruits, etc. Any issues related to crops that you can capture, after scanning at the affected location, the AI will provide results regarding: disease diagnosis, causes, and treatment methods. AI may generate multiple different diagnoses based on the input.
Scenario 2:
You want to seek advice from someone experienced in the field. You choose to book a consulting and treatment expert (we have professionally vetted). You can make your expert selection based on your needs and budget. Once completed, you can directly message, send pictures, or videos to that person.
4 - User Flow
Let's examine the screens and navigation designed to address the goals and scenarios mentioned earlier. Main screens:
Home
Scan plant
AI Result
Book an expert
Payment
Consulting room/Chat
Feedback
Flow Scenario 1:
The prominent button is located in the middle of bottom navigation for users to easily notice and scan immediately upon entering the app. Then, you are directed to a "Plant Information" screen before scanning, allowing AI platforms to find the disease more quickly and accurately. Skipping this step is an option, but AI will automatically make guesses, which is not encouraged. After selecting "Species" and "Plant," you can scan using the camera.
Upon completion, the AI results are returned along with the main content includes Disease Diagnosis, Causes, and Treatment Methods. Additionally, the app displays pagination for you to view different diagnosis results and return if needed.
Flow Scenario 2:
After receiving diagnostic results, you can also book an expert (with new users receiving a one-time free booking). In this tab, the list of experts is ranked based on criteria: highest star ratings with the most frequent consultations. Each expert is displayed with their avatar, name, profession, star ranking, and weekly consultation fees. You can choose to view online experts or all experts, and sort the list by lowest or highest prices.
After selecting an expert, you proceed to the payment screen with available methods: VISA, Apple Pay, Paypal.
You and the advisor will engage in direct conversation on the app's chat screen until the session expires.
Upon completion, you are prompted to rate and feedback the advisor.
5 - UI Design
I have aimed to design the UI design the as visually intuitive as possible, with a youthful, dynamic and positive vibe.
Color palette and vibe
The color scheme is designed with a light background to enhance the readability of text content, and the color accents are chosen to be easily visible in various app usage conditions.
The app uses green and orange colors to create a vibrant look that matches its desired atmosphere. Taking care of plants is shown as a refreshing process, bringing strong vitality to them.
The concept was to create a friendly and user-friendly app, smoothing the edges of unpleasant situations with an elegant style that avoids causing tension.
Scan
Simple and convenient camera screens for quick photo capture.
You can scan a single shot or multiple shots.
Icon
Simple icon strokes, easily recognizable.
Assisting users in scanning and understanding the content before reading.
In summary, Plant Health addresses the common problem faced by millions of newbie plant enthusiasts worldwide, offering inclusive and visually intuitive assistance for plant health issues.
Say hi to Thu,
press "L" ❤️ and