Trove: A UX Case Study
Exploring the Habits of Wastefulness.
For a moment, consider the fact that a third of the food grown annually for human consumption is never eaten. For one reason or another, it often ends up in the trash. Yet at the same time, 815 million people around the world are starving. It’s a problem — however one with no shortage of solutions.
I, along with most people I know, reluctantly throw away a great deal more spoiled produce then we care to admit. Over the years, I have tried a few meal planners in hopes of helping remedy the often pungent decay of my compost bin and save a little money while at it. To no avail, I decided to put my UX designer hat on, venture into the wild, and validate my problem.
The following is a detailed look into my process, methodologies, findings, and challenges as I seek to answer the question “How can we reduce the amount of food we waste?”
My Design Process.
To ensure my design decisions accurately reflected the needs and motives of users I based my process on Empathetic Design Thinking and IDEO’s Human-Centered Design. As challenges arose, I would integrate aspects from various design methodologies to help best overcome the challenge at hand. These systems will be mentioned throughout the study.
Empathy in Design.
As designers, its easy to make the mistake of just doing the thing. That is we take requests at face value. A client says to you, “I need a new website.” to which you respond, “Ok! Not a problem.” But is that really what they need to achieve their goals? It may very well be, however in this scenario we’ve missed an important part of any design process.
It’s one thing to build something right, its another thing to build the right thing.
User Experience design allows us to give the spotlight to an often overlooked aspect of creative projects. Validation, important because its one thing to build something right, its another thing to build the right thing the right way. By validating the existence of our problem we can effectively create purposeful designs with meaningful solutions.
User Research Prep
With a problem in mind, the first thing I needed to accomplish was verifying that others where also experiencing inconveniences regarding food waste. Focusing in on obtaining Thick Data was the way I was going to accomplish this task.
Ethnography
I conducted a few separate ethnographic studies, the first at a local grocery store and the second an ongoing observation on friends and family members. My goal was clear, disregard assumptions, simply observe and learn. These were some of my findings:
- 80% of shoppers purchased fresh fruit or vegetables with 2/3 opting for organic produce.
- 75% of all shoppers used a smartphone when grocery shopping.
- Over 50% of all dinners were planned within an hour of being made.
- Only 30% of meals were made from scratch.
- In a household setting, 1/3 dinners remained unplanned and up to individual choice, concurrently frozen or instant meals were 80% more likely on these days.
- 90% of newly made meals were aided by a recipe viewed on a mobile device.
Interviews
Following initial observations i composed a list of questions that i could use when conducting interviews. Not wanting want to badger people with otherwise systematic questions, i decided to use them to initiate points of interest, encouraging participants to tell me a contextual story. This allowed me to see a broader picture to the habits i observed earlier.
“Even the other day i had to throw out some bad lettuce, its really my own fault though, i eat out often and forget whats in my fridge.” — Anders
Persona
It was important to create a collective representation for my audience to easier reflect on who i was designing for. This was something that I came back to throughout my project to guide my design decisions and priorities.
Defining the project.
With my initial assumptions either validated or quelled and the problems facing users clearly identified, it was time to organize all of the new found data into useable tools.
User Stories
To better understand user needs and motivations, I used the Jobs To Be Done framework to explore different contexts in which an individual may proactively manage food consumption and waste management.
The following are some of the user stories i created based on interviews and contextual inquiries:
Brainstorming
This stage of the process is messy, raw, and undeniably paramount in the formation of an idea into an explorable concept. Below are some of the results of divergent ideation through the ‘discovery’ phase of Diverge & Converge Design Thinking.
A great deal of my initial ideas were … ambitious to say the least. I spent a great deal of time exploring the context in which the application would exist. Resulting in some interesting explorations into system architecture, logistics and, technological limitations.
The Backlog
Having a limited amount of time and no fixed scope, I decided to implement aspects of Agile to better plan and prioritize the project goals. I began by creating a backlog, this was used to estimate and prioritize the work effort over 60 days based on a prioritized list of user stories. The backlog was used to define key metrics and define project objectives.
Exploring Solutions.
Before you can design something, you need to identify what that thing is going to be. Based on my previous ethnographic and contextual findings I concluded that a mobile application would be an accessible product that would fit into the lives of users with minimal friction.
Card Sort
Easy to conduct and invaluable to the organization of information, i asked a number of peers to simply organized a stack of post-it-notes each with a function or feature of the application written on each note. The participants were instructed to organize the notes into groups then name each catagory as they saw fit.
Task Flow
I also created a variety of brief task flows to help envision what a certain process may look like, allowing me to better identify points of pain prior to building a prototype. Below is a simplified login model i used to evaluate the friction created via a login system.
Interface Flow
When i began sketching I wanted to address points of pain. I explored a variety of concepts from unconventinal navigation systems to content navigation systems. Eventually leading to some early lo-fi mockups.
I did some preliminary validation on the Lo-Fi UI sketches and used the feedback to refine my sketches and narrow down my solutions for the Hi-Fi mock-ups.
Building the Thing.
Prototyping and Validation
When it came to building out a digital prototype, I decided to work with software that is quickly becoming common place in industry. Using Sketch I began to translate the Lo-Fi sketches into Hi-Fi mockups. I later used the Craft plugin to quickly create a clickable prototype in app, that could later be exported to InVision for on device testing. Lastly I created Hi-Fi interface animations using Principle to better demonstrate the tone and feel of certain interactions.
“prototypes allow us to see things in one of two ways: Things that don’t work, and things that need work”
Loosely following Atomic Design Principles, I would sometimes build basic interface elements, such as a header or a new button. Other times, I would explore entirely new interactions, although often leading to time consuming conceptual systems like a new take on navigation. But that’s really the fun of it all, prototypes allow us to see things in one of two ways: Things that don’t work, and things that need work.
Usability Testing
I tested the Lo-Fi prototype with a 3 new individuals, later expanding to 5 as prototype fidelity improved. Insights from the initial usability tests led me to reiterate upon a traditional fixed navigation, later incorporating a news feed style hub, allowing for greater content navigation and isolation of important information as needed.
Mental Model
I reviewed my notes of the initial tests and created a variety of post-it-notes each containing a point of pain. I used these data points to create a Mental Model. The mental model was used better visualize and address friction across a person day and how the application may address those concerns.
Iteration
Using the mental model i was able to identify and address the three gratest points of pain that users experienced, diagnosing its negative effects and a implementing a solution for each.
Point of Pain: Feed (Hierarchy of Information)
Challenge: In the initial iteration of the ‘feed’, information was linear, time stamped with the newest update being at the top. However the testers showed interest in being able to isolate information as arduously scrolling to find something from weeks ago, while intuitive, wasnt time efficient.
Solution: At first i thought a filter menu on the upper navigation would work nicely, however while building the UI for the interaction i created a toggle style switch, it got me thinking. Why not filter important information at the tap of a switch, where anything ‘marked’ either by the user or the system would filter to the top of the feed and other content would become hidden. In addition older content could ‘fold’ into a simplified view after a certain amount of time, reducing scrolling time by half.
Retrospective
My Greatest takeaway from this project was the importance of scope manangement. Having been a self-directed project over the course of 3 months I kept a rather flexible schedule. This resulted in a lack of time to complete UI refinements and a rather rushed documentation of the design process. While the project had received two awards, i feel its true success was in demonstrating the benefits of failure. Having failed to meet my own criteria of success.
… You either win or you learn.
Trove, in its entirety is an extension of the narrative I’ve created for the company Medial. The project was incited through school and is a reflection of the work I produced as a student while attending the Digital Design program at Vancouver Film School.
Thanks for reading! If you want to collaborate, talk shop, or simply share a conversation over coffee, drop me a line at hello@mitchmills.com or connect via LinkedIn.
