Case Study: FeedBack for Second Harvest

Zoë St-Aubin
RED Academy
Published in
6 min readNov 20, 2016

--

This case study outlines the process we went through as students at RED Academy working with our first community partner, Second Harvest. We developed a multi-platform solution — FeedBack — with the goal of helping to reduce food waste in Toronto.

The Opportunity

This project started with a proposal from Second Harvest —an organization that connects food waste with those in need in Toronto, with the goal of ending hunger. Right now the way it works is that Second Harvest has a limited number of drivers who can pick up donations from grocery stores and other businesses that produce consumable food waste.

While Second Harvest is doing amazing things, it isn’t cost-effective for them to pick up small-scale donations regularly, which leaves them unable to collect what smaller businesses have to offer. So, the proposed idea was to eliminate the need for Second Harvest as a middle-man by finding a way to connect small-scale donors directly with the organizations who rely on their donations.

We carried out a two-week design sprint to come up with a solution to Second Harvest’s problem-at-hand. Working in an agile studio environment, we broke into small teams and kept track of our progress with a shared Scrum Board.

The beginnings of our Scrum Board

Research

When researching for this project, we wanted to understand the landscape of food production, distribution and waste before directing our research specifically to the proposal at hand. So, our research started with a broad question — how can we help Second Harvest to reduce food waste in Toronto?

To address this question, we split up into three groups, each focused on one major stakeholder groups in the food industry: consumers, producers, and charitable organizations. This phase of our research led us to the conclusion that a lot is already being done to intercept food waste at the production, distribution, and retail levels; where there seems to be a gap is at the consumer and small-scale business level. While these groups seem to be aware of the food waste problem and want to take action, it isn’t always reflected in their behaviour.

We then split off into our production teams (planning, design, and prototyping). As a member of the design team, we dove into a comparative analysis of what products currently exist with goals similar to our own. Once we had outlined key features, we continued our design research by looking for products — whether related to food waste or not — that had similar processes to ours and could inform our design.

Our teams brainstormed and recorded some of our key findings on a shared board

Planning

Based on Second Harvest’s proposal and it’s alignment with our research, we began planning out what we would build. We decided on a multi-platform solution that could connect those with small-scale donations (donors) directly to organizations that could distribute food to those who rely on donations (diners). We included a component that would allow diners to browse the stock of food at nearby charitable organizations, making the experience of receiving donations feel closer to a ‘normal’ shopping experience.

Core features (as outlined in our final report):

  • Drivers, donors and nonprofit agencies will be synced using feedback and the information of their activities will be accessible in real-time.
  • Donors will be able to donate their surplus food conveniently through the app.
  • Drivers will be able to use the mapping system to see where the food is and where it needs to go. They will also be able to communicate with donors and agencies through the app.
  • Nonprofit agencies will be able to track their inventory as well as the flow of incoming and outgoing food.
  • Diners will be able to locate and view food available at a nearby agency through the app.
The FeedBack flow

The planning team created user flows for two of our users— donors and diners — who would be using the FeedBack app. Our other primary users — charitable organizations and Second Harvest — would be using a desktop dashboard to access the platform. These user flows along with rough wireframes were passed on to us, which is where our visual design process began.

Design

As a member of the design team and lead visual designer, this is where my focus was directed during this project. We started by taking a look at the wireframes passed on to us from the planning team — we were able to simplify the user flow right off the bat by combining screens in a couple of instances. Working with Sketch, we created our own wireframes to reflect the altered flow — these were followed by several more iterations. As our wireframes were being tested by the prototyping team, I began to bring them to a mid-fidelity level.

Screens from throughout the design process

It was after these first rounds of testing that the design really came to life. Our first colour palette included the bright green used in Second Harvest’s branding — but we ended up going with a warmer green more suited to FeedBack’s unique, inclusive feel. We also found that some of our chosen iconography, while appealing to us as designers, was confusing to our users. This led us to move from line-style iconography to more realistic illustrations so that users would feel connected to the food displayed.

My key role in this project was in designing the interface, from the layout to style guide and design execution. Our final design is warm while still uncluttered and intuitive. Playful copy makes the app enjoyable to use while informing users.

Screens from the high-fidelity prototype of the diner flow
Screens from the high-fidelity prototype of the donor flow

Prototype

The outcome of our two-week sprint is two high-fidelity, clickable prototypes of the donor and diner flows. For the donor: making a donation; for the diner: browsing food donations currently available at local charities. Our prototyping team carried out testing at the low, mid, and high-fidelity phases which led us to some design and layout changes as mentioned above.

Prototype of the donor flow: https://invis.io/XS98RK05F

Prototype of the diner flow: https://invis.io/YH94GA7TD

Summary

It was a great experience to get to work toward solving a problem for such an impactful partner. The fact that Second Harvest already has a non-digital infrastructure in place helped us come up with a system that would be truly functional for them going forward — it also provided us with the challenge of designing a platform that would successfully bring together several different users with varying goals and stake, and make it usable for all. Second Harvest had also partnered with the Wal-Mart Foundation for this project. Together they discussed bringing our design to an agency to be built in the next several years. Design sprint success!

--

--

Zoë St-Aubin
RED Academy

UX Design & Research | Currently @ Shopify | Lover of coffee, plants, and learning | linkedin.com/in/zoestaubin