Behind the Project
FoodNet, an interactive platform designed to facilitate food distribution, was the final project of the Interaction Design program at George Brown College. The project was a collaboration that incorporated workshops from the Interactive Systems, Data Visualization, and Augmented Reality (AR) classes. FoodNet was recognized for its outstanding contributions and received awards for Best UX Research, Best UX Visualization, and Best interactive Immersive Experience at the 2021 YES! Award Show.
The Team & My Role
Initially, during the early stages of the project, it was a challenge to allocate tasks between team members due to the evolving nature of the project. It was essential for all members to contribute to every aspect of the project, which allowed for a dynamic collaboration and a comprehensive understanding of the project's evolution.
As the project took shape, we were able to better identify and divide tasks among the team. Despite all members contributing to every aspect of the project, my role was primarily focused on specific tasks, which included:
-
UX strategy • System Map
-
Personas • Journey Map
-
User Flow • Research Visualization
-
Presentation Visualization
Waterfall Framework
Initially, the project followed a waterfall framework to achieve milestones, but challenges forced us to reevaluate and rectify prior processes. From comprehending our values to determining technological capabilities we had to make difficult decisions to narrow or broaden the scope for innovation.
Initial Plan
-
Definition
-
Secondary Research
-
Personas
-
System map
-
Journey Map
-
Ideation
-
Brand System
8. User Flow
9. Low-Fidelity wireframes
10. Mid-Fidelity wireframes
11. Prototyping
12. AR Development
13. Presentation visualization.
The Diamond Design Model
The team recognized the need to make multiple iterations throughout the project stages and therefore, decided to change their approach and methodology. As a result, we adopted the Diamond Design Model framework that better suited our needs and allowed us to be more in sync.
The shift to a Diamond Design Model was necessary due to the complexity of the project and our research. This change in our approach allowed us to better control and organize the project, which was sometimes disproportionate or lacking opportunities. The map shows how often we followed a diamond pattern to overcome challenges by converging and diverging processes in a cyclical way.
Insights & Challenges
These are some of the insights we face during the project. Some of them were outlined as failures, some others as successes, but in the end, everything contributed to building the FoodNet application.
Research Summary
After extensive research, we reaffirmed our beliefs that we can aid in the fight against food waste. We created a story around these beliefs in order to ideate a food management system. Our Human-centric approach allowed us to focus on the donors as a powerful source of change. We found the food donation process can be tedious and by creating a persona we were able to identify the motivations and frustrations in the donation process.
Next Steps:
AR Technology as a Solution
The team needed to decide on the direction to take for developing the application. There were two options on the table: one was to use Unity to build the platform experience, and the second was to use Spark AR to implement it into Instagram and Facebook, enabling a wider audience to use the tool.
Initially, we decided to work with Spark AR to meet FoodNet's objectives. However, we encountered several challenges including difficulty in interacting with small elements and buttons, lack of flexibility in recreating user flow, and the effort required to implement an online store in Facebook Business. Due to these factors, we opted for Unity, which was a more realistic and flexible tool to achieve the goals of the project.
Journey Map Summary
We used the journey map to develop the prototype for the application. We employed a human-centric approach, creating a persona named Anant to understand the user's journey of donating food. By identifying the user's motivations and frustrations, we found ways to improve their experience. The application was designed to fill the gaps in the donation process.
User Flow
Based on the constraints we identified in the journey map, we developed the user flow. Opportunities were found in the education, decision-making, and checkout stages, which led to the creation of wireframes.
Low Fidelity Wireframes
We elaborated low-fidelity wireframes to identify technological opportunities with augmented reality. This was a stage where we faced several challenges trying to understand technical limitations and ensure that we were building a successful application. Once we were comfortable with these concepts, we proceeded with the design, brand development, and UI kit.
Brand Development & UI Kit
The graphic design and development of the brand and UI kit were mainly developed by Nicole Aranzanso, who captured the essence of what FoodNet is about. The final result is an adaptation of our team's values and a reflection of the true purpose of the app: to facilitate and simplify the food donation process, and help solve food distribution problems.
High Fidelity Wireframes
After preparing branding elements and UI kit, we created high-fidelity wireframes based on user flow.
Prototype Development
The development of the prototype was primarily carried out by Simron Cupid, who adapted Anant's journey flow into a story using AR technology. Several trials and errors were necessary to achieve the desired result and ensure that it worked in a physical store. Thanks to this outcome, we could confirm that the application functions and is technically feasible.
Maquettes for Demos
We made a maquette of the grocery sign to simulate a better experience and help the development in the Unity software.
Simulated Environment Testing
Making the AR technology work required a lot of effort. We faced several challenges, such as using real maquettes, finding the right tracking angle, and debugging code on Unity. In the end, we were able to prove that the technology works for the purpose of FoodNet, both as a project and as an application.
