ProducePic Mobile Application
Making the unfamiliar, familiar.
The Application
ProducePic is a mobile application designed to identify unknown fruits and vegetables from around the world. The app gives users information on produce preparation, nutrition, and purchase location.
Solo Project: Concept & UX/UI Design
Goal: Provide the best information needed for users to feel comfortable cooking or purchasing something new.
The Challenge
What key information would users need to make a new purchase? It became clear in the early stages of research that people were naturally curious, but afraid of the unknown.
DISCOVER
Secondary Research
This concept came to me while I was living in Asia and noticed many foreigners who were apprehensive at local markets. I observed tourists struggling to purchase items because of language barriers and lack of accessible information.
I researched food and travel trends to make sure there would be enough demand for this project.
The Process
Top 3 takeaways
1) Plant-based diets are on the rise globally and across America.
2) A recent Nielsen global survey found that 23% of consumers want more plant-based proteins on the shelves.
3) More people are traveling based on their food experiences.
Heuristic Analysis
I studied three different competitors and made my evaluation focused on the principles from Jakob Nielsen's 10 general principles for interaction design:
PlantSnap
Nature Mobile's Exoctic Fruit
PlantNet
PlantNet
Aesthetics and Minimalist Design
Rating: 2/5
This application relies heavily on alphabetical order creating an overwhelming screen for users to scroll through. More negative space would help the overload of information. Also the white text blends into the images on the first screen making the words difficult to read.
Nature Mobile
Aesthetics and Minimalist Design
Rating:1/5
There is a ton of useful information, however it is so dense and visually unvaried that reading it feels laborious.
My competitors supplied too much information on the screen at one time. It was important to me that ProducePic stay streamline, not overwhelm it's users and be a source of inspiration and delight.
Screener Survey
Screener Objective
Identify potential users and select information that users would find useful in and after produce identification.
Recruiting Methods
-
Recruiting at local produce markets
-
Social Media outreach to friends and family that currently live or have lived abroad
Interviews
After reviewing the 29 completed survey responses, I contacted 5 participants to schedule in-person and remote interviews.
"...I'm curious, but I won't buy it because I don't know how to prepare it."
"I love local markets, but I struggle with the language barrier."
"I can't tell if some fruit is ripe or not and that on it's own will stop me from purchasing."
DEFINE
Organizing the Discoveries
People wanted to know:
-
What does it taste like?
-
Can I eat it raw?
-
What season does it grow?
-
How can I tell if it's ripe?
-
How do I prepare it?
-
Nutritional value?
User Personas
I created my personas based on my qualitative research and interviews, so to better understand the goals and motivations of my target audience. These personas helped me to get out of my mind and into that of potential users.
Hilary Healthy
Ava the Avid Traveler
Jeff the Chef
How might we...
Make international produce shopping more accessible to non-native speakers?
-
By providing an in-app translation
-
An interactive map that allows users to select a country and find what produce grows in the region and is in season.
-
Displaying price comparisons for different countries. What is the average price for something in a region?
-
Highlight traditional dishes that feature each piece of produce
-
Picture recognition for unknown produce, which will link to the most pertinent information
User Stories
I created a spreadsheet to identify what the user wanted to do and what action could be taken to complete it. I highlighted the most crucial actions to be used as red routes (main application flows) in the application.
-
Create an app that allows users to identify unknown produce through camera identification
-
Allow users to find local produce through an interactive map
-
Create a user library so users can save produce and recipes directly in the app
MVP Statement
This application will allow users to identify produce through photo identification. They will be able to find useful information on produce including: what it tastes like, ways to prepare it, ripeness cues, nutritional facts, photos of what the produce looks like inside, and whether it is in season. Users will also be able to search locations on a map for regional produce information.
Site Map
Sketches
I organized the produce information page to include different sections so users could quickly find what they needed, instead of scrolling an entire page of dense text. I made sure to add lots of image examples since users expressed how crucial photo evidence was to them.
Wireframing
Moodboard
UI Decisions
I created the logo to resemble a camera’s aperture disguised within a pumpkin, the two key concepts of the application.
High Fidelity Screens
I created five different categories to organize produce information. These were the categories that users expressed most interest in when purchasing an item. Each page is filled with detailed imagery so users can compare what they are looking at in real life to examples on the screen.
Users can choose to take a picture or upload from their gallery to identify a piece of produce.
The map section allows users to explore produce from all around the world. They can choose from local fruit, vegetables and traditional dishes that feature local produce. The entire app features this UI element so users can switch effortlessly between the three options.
TEST
Usability Testing
Testing Objectives:
- To assess the usability of the app’s primary tasks
- Understand how quickly can users adapt to the app (learning curve)
- Identify any problems users encounter while completing given tasks
- Allow participants to openly share their level of satisfaction with the app
- Evaluate accessibility
- Determine how clear or unclear any language/visuals are to the user
- Evaluate ease in navigation throughout the app
- Collect all findings and use data in further iterations
Example Testing Questions
“You find an unknown vegetable at the grocery store, use the app to identify it”
“You are currently in Hanoi, Vietnam and want to learn more about the local produce”
“You have an excess of bananas and want to find recipes that feature bananas”
Iterations
One of the small adjustments I made was changing the "save" button to a toggle switch. When I had it as a button one user thought it would take them to the library so they didn't want to press it. With only two options "save" or "unsaved" a toggle provides more visual clarity to the user.
Another adjustment I added was "Mystery Pick", because users vocalized being indecisive and wanting someone to choose for them.
CONCLUSION
ProducePic's Effectiveness
After all the iterations were made I conducted a second round of testing with five participants. The testing sessions ran smoothly with the users being able to complete all the tasks and present positive feedback on feel and information. After completing this app I have gone on to show more people many who feel a real need for this product.
"I can finally go to markets without fear! I need this for all of my trips."
Takeaways
This design helped me uncover the users’ perspective and how user-centric design is critical for any application. The initial problem of giving users confidence through information was solved. If time permits, I would continue to work more on this product and add an additional idea that the user expressed need it but I didn't I didn’t have time to execute. Adding a “Price” section to the produce info page would allow users to compare the average price of produce between different countries. This tool would allow users to know how much they should be spending at the markets instead of having to guess.