'I'd like to donate food to help those in need, but it's so complicated...'
-- Spencer*, a working professional on food donation
(* Pseudonyms are applied to ensure anonymity.)
This was an 8-week master's course project. The prompt: Design an equity-driven solution. Deliver a working prototype and a pitch.
We identified the rising food insecurity issue and the gap in donation supplies as the design problem: Scaling and facilitating individuals' food donation to meet the demand at redistribution organizations.
42+ million people in the US have no stable access to healthy food. The number is rising every year. As much as individuals want to help, inaccurate donation actually leads to more waste. There were not enough donors to support the demand as well.
Duration
8 weeks (Oct-Dec 2021)
My Role
Product Designer
Project Manager
Key Skills
Research
Concept Ideation
Information Architecture
Usability Testing
Wireframing + Prototyping
Project Management
Team
Hungry Birds
Claudia Pang
Helen Xu
Namrata Panchumarti
We aim to...
- Help users meet organizations' needs
- Facilitate users' donation process
- Scale and sustain impact
How to measure success?
- # of generated donation lists;
# of delivered wishlist donations; - # of completed pickups;
- # of new users; % of recurring users
We came up with an app-based platform, Foodo, that scales individual donation by facilitating the donation process.
Identify what organizations need
Customize and generate donation lists
Donate directly from online wishlists
Schedule donation pickup at doorsteps
Discover
We started off with the idea of repurposing household food surplus for those in need.
I led the team to identify research methods and consolidate findings to define our vision.
Organizations often collaborate with businesses for food supply. However, individual donors can provide extra support when businesses fail (e.g. in pandemic).
Receipt of unfit or unsafe food results in more waste.
Organizations may have specific needs that are different from other organizations, based on the communities they serve.
'We don't have enough storage space for refrigerated goods. So if people can't take them fast enough...we'll have to throw food away.'
People are unsure whether household food surplus is suitable for donation. Also, household surplus are hard to track and manage.
Convenience is key. People without cars or live far away may lose motivation if donation is regarded as an extra chore.
'I do know that the food bank is only a 20 min bus ride away. But...I don't have the time to make a trip for it.'
define + develop
- Household food surplus, however large in total, is still relatively small and cannot meet the demand for food
- People feel uncomfortable donating food surplus as improperly preserved food may cause health risks
- Managing food surplus is considered different from donation, and people think of it as more helpful for their own food waste management
How might we scale individual food donation to meet the needs of food charity organizations?
I led the conversation to prioritize active donors, as they are essential in adopting/scaling the system and motivate potential donors.
We decided to prioritize the needs of recipients relying on donation sites, as the organizations have an established system to support people in need and we can effectively scale impact by meeting their demand.
Thus, the stakeholders also include staff and volunteers at donation sites.
We brainstormed ideas and tested with donors.
Then, we focused on facilitating accurate donations that meet demand across the donation process.
Locate donation sites nearby
View organizations' demand lists
Purchase at local stores with a list
Order food through online wishlists
Schedule donation pick-up
Donate myself or help others deliver
design + evaluate
Ideate + Design
Test
Iterate
We designed our prototypes based on design goals and requirements identified in research.
Success metrics + user feedback guided my decisions for wireframe/prototype iterations.
Help users meet organizations' needs
# of generated donation lists
'I want to know what exactly do they need and prepare accordingly.'
-- Lily*, part-time graduate student
# of donations via online wishlists
'If I don't have time to prepare food, I'd want to shop online and get things delivered.'
-- Vivian*, frequent donor
Facilitate users' donation process
# of completed donation pickup
'If I can't get the food to donation sites fast enough, it'd contribute to more waste. But I often don't have time.'
-- Liz*, donor on struggles for donation delivery
Scale and sustain impact
# of new users; # of recurring users
Due to time constraints, our MVP product did not involve detailed design for retention and volunteer onboarding. These will be the focus for the next phase of Foodo's design development.
I created the concept map for Foodo to scale and sustain impact.
Enjoy our prototype below!
'The concept of utilizing the gig economy, friends ,and family for food donation is what moved me the most.'
-- Course instructor
'I love your product because this is very encouraging and can break the wall to start donation.'
-- Donor and graduate student from class
🤝 Diving into volunteering for drives
We need to dive deeper into the volunteer mindset and mechanisms to involve volunteers.
More research on the logistics of initiating food drives and interviews on volunteers' motivations are needed to ensure continued participation.
↔️ Scale coverage + impact
The next leap for us would be allowing individuals to order or request food. Providing ordering systems on the app or at donation sites can help us support more people in need. However, more research on food recipients is needed to understand their technological usage, food receiving behaviors, and thought process.
😅 Involve experts + competitor analysis early
Involving more experienced donors and volunteers would provide us with more in-depth insights to design solutions that further meet their needs.
More thorough analysis on the competitor landscape or conversations on how to connect existing solutions could potentially help us scale coverage to more food recipients.
🧐 Mind the unintentional consequences
We need to be mindful about the consequences of our design. I learned from our concept testing that people are worried about creating more waste if they cannot accurately meet the demand. Thinking through all possible scenarios, designing responsibly, and testing with people across each design phase can help!
Other Projects
A great fit!
Say hi!
How might we help people prepare for mountaineering safety?
background
To participate in the UXD Award, we were challenged to 'design to connect human experience'. Connected like never before, we had a unique opportunity to improve public safety through the power of people.
problem
As more and more people join the quest for the summits in Taiwan (+32% YoY), cases of hikers getting lost, hurt or even deceased have seen a +60% YoY increase. The team wanted to explore how might we design solutions that help improve hikers' safety.
A 10-month research-driven passion project winning the 11th UXD Award competition.
UX Research
Product Manager
Product Manager
I led the end-to-end product design efforts.
Research, strategy, ideation, wireframing, lo+mid-fi prototyping, testing, and storytelling.
Solution overview
Mountain Guru is a cross-device solution that makes mountaineering safer by providing actionable guidance in moments hikers need the most.
Key Design #1
Preparation On-Boarding
Break down the complex preparation process into actionable steps.
Key Design #2
Trail Condition Update
Record and share updates on trail condition through wearable device — while holding the trekking poles to steady your steps!
Key Design #3
Experience Exchange
Connect with fellow hikers and mountaineering guides who completed the trail recently. Find guidance from the experienced!
👀
exploratory phase
to kick off
We looked into hikers' mountaineering journey and found that the preparation phase is key in defining safety, regardless of experience level or trail difficulty. Then, we defined the design vision.
our opportunities
Often driven by invitation from friends or updates on social media. One key decision is whether to hike with self-formed groups or commercial ones.
Self-formed groups are 6X likelier to face accidents than commercial groups due to insufficient preparation.
The danger of social media-fueled interest is that inexperienced hikers may choose trails beyond their abilities.
Challenging to find suitable benchmarks. Underestimation or misjudgment of situations. Insufficient training or preparation both physically or gear-wise.
40% of mountaineering accidents are due to hikers' inexperience.
'I brought my usual winter jacket and thought it'd be enough.' -- a 28-year-old hiker
- Complexity of the journey is dependent on experience. The journey of beginners covers that of an experienced hiker.
- Preparation is key. There's no second chance as what people bring -- physical condition and gear -- are what they have in the mountains.
Design question
📝
generative phase
diving deeper
We further explored the why, the barriers, and the complexities in the preparation process. With the insights, we defined our design goals.
identifying major pain points
There are various decisions to make, equipments to prepare, physical condition to train, and routes to plan.
Information can be scattered all over the place, outdated, or unsuitable.
'I just don't know where to start.' -- a 23-year-old hiker
Each trail is different. Lack of relevant knowledge and experience can result in immediate danger.
Dependence on others' update for trail condition and changes.
'Some info can only be learned from hikers who just visited the trail, such as sections blocked by landslides.' - a 56-year-old hiker
Signals are unstable or non-existent in the mountains. Rescue missions are constrained by weather and trail conditions.
Preparation and knowledge are essential for sudden challenges in mountains.
'Helicopters are not allowed in foggy weather. In terrains unsuitable for helicopter landings, victims can only wait for rescue.' - a mountaineering guide
defined Design Goals
- Make mountaineering planning easy to work on
- Simplify and motivate experience sharing
Success Metrics
- # of users finalize plans with the service;
% of recurring usage; user drop rate - # of user uploads;
% of recurring sharing behavior
💡
ideate + evaluate
exploring + validating ideas
We explored directions and variations through iterative concept testing, expert review, and contextual inquiry. We then nailed down concept directions and refined design principles.
(4 rounds, user + expert interviews)
what i found
🤔 People prefer a cross-platform solution across the mountaineering journey: make plans on desktop, track records via wearables during hikes, and upload memories afterwards via mobile.
☝️ People prefer to complete all tasks in one platform.
🤔 Start guiding at the moment people consider to hike.
😊 People seek a step-by-step preparation method where they make sure everything is covered.
🤝 Prompt active sharing of experience when people are most engaged -- no longer than one week after they complete the trails.
👌 Engage users to complete key actions through bite-size pieces.
👉 Provide clear next steps and facilitate the process.
🤝 Connect and motivate users to facilitate experience exchanges.
what i did
A cross-device solution that help formulate mountaineering plans, connect the inexperienced with experienced, and enable on-trail updates.
Mountaineering Planning Breakdown
'I want to get step-by-step guidance to make sure I don't miss anything.' -- an interviewee
Information Exchange for Trail Updates
'Having the most up-to-date info is key.' -- a mountaineering guide
Hikers Network
'I want to find the guides that can help me hike the trail safely.' -- an interviewee
🪄
design + evaluate
insights-driven iteration
I designed wireframes and lo + mid-fi prototypes to gain feedback and iterate.
We did 4 rounds of offline usability testings (n=20) to refine design and concept.
Breakdown the planning process to actionable steps
How do we make the process actionable and easy to follow?
I led the discussions to identify the essentials and created mocks. Then, we tested with users.
We started off focusing on the journey breakdown
Our first version of hi-fi design highlighted the steps in the journey.
A. Key preparation steps
👍 Helpful to navigate the steps.
❌ The linear nature between the steps is unclear. Copy needs to be revised.
B. Breaking down trail sections
👍 The concept is useful for planning.
❌ The current presentation is unnecessary and cannot provide useful information.
C. Key info in each section
👍 The info is much needed and users do want to have some images to identify key landmarks.
❌ More details on the exact location would help users prepare.
Providing essential information on each step
I created mid-fi prototypes for testing.
A. Key preparation steps
👍 Clear to follow through each step.
❌ Too many sub-steps cause frustration.
B. Breaking down trail sections
👍 Helpful to know the current status.
❌ The design is unhelpful for visualizing slope, or context of location.
C. Adding details
👍 Details about key landmarks are helpful for users to identify the path.
❌ It's unnecessary to have so many pictures.
Deep dive on essential info
I created mid-fi prototypes for testing.
A+B. Separate core preparation phase (B) with sub-steps within each phase (A).
Distinguish the two for better hierarchy. Move sub-steps to the right to help users focus on task at hand.
C. Ensure essential information is included and properly presented.
D. Streamline unnecessary info
Remove unnecessary images and info.
Keep up-to-date via information exchange
helping users stay on track
Optimize navigation with hiker network's updates
A. Offline navigation
Guiding users from one landmark to the next, with estimated arrival time to make accurate decisions.
B. Voice notification
Based on hiker network's update about trail condition, the system provides pre-downloaded voice notification when users arrive near the GPX location.
C. Low battery mode
During the battery-saving mode, only the navigation feature would remain.
'I need both hands to steady on the trail.'
'Staying on the right trail and knowing your progress are essential to safety.'
I found that mobile solutions have limitations in supporting hikers on the go. Hikers often tuck phones away as it's dangerous to use during hikes.
However, using offline GPX maps is key to track progress. Thus, I led the design of helping hikers navigate through wearable solutions.
Integrate wearables to enhance safety
As a lot of hikers already have the habit of wearing wearable devices to track physical condition, integrating wearables into the system would reduce risk of using mobile phones.
A. Up-to-date route info
Based on other users' updates, users would receive GPX-enabled voice notification during the hike.
B. Estimated arrival time
Based on users' activity data and other users' data input, the system provides timely estimation of arrival time to the next key location. The system would also show status of arriving 'on time', 'early', or 'late'.
C. Progress check
The system displays activity data to help users monitor progress. Key data points include distance, altitude, and speed.
ensuring a sustainabile system
How do we motivate and facilitate trail condition update?
As hikers rely on fellow hikers for latest updates, ensuring a user-friendly system was key. We came up with a mechanism that allows hikers to input updates with voice, while the system would convert voice to text, and add GPX note for easier tracking and uploading after connecting to the internet.
Enable users to upload trail updates with ease
A. Instances saved with GPX tags
Files are automatically tagged with GPX notes. When users upload the file, it will be sorted to GPX maps online according to its location notes for accurate information.
B. Modify content with ease
Users can choose to add photos, edit, or delete instances as they see fit.
Connect hikers to exchange experiences
'Some details can only be answered by those who are familiar with or just visited the trails.'
I led the iteration of designing a network for hikers to match with professional guides that are familiar with the desired trails, and find people that visited the trails recently.
Matching professional guides
We started with focusing on helping users find suitable guides as it is an effective way to reduce risk.
A. Guide intro
👍 Provide a clear overview.
❌ UI background is distracting.
B. Build trust with info on experience, skills, and pricing.
❌ Not all information is essential. Users prefer to see evidences of the guide's experience rather than descriptions of it.
C. Upcoming tours
👍 Clear overview of available dates.
❌ Calendar-view is unnecessary. Users care about the date range and availability.
Showcase the hiking guides with only the essentials
I created mid-fi prototypes for testing.
A. Showcase key skills
👍 Allow users to search with skill tags.
❌ The skills may be irrelevant as the core skills needed differ by trail and season.
B. Available tours +status
👍 Clear overview of tours and availability.
❌ Users are often browsing around for trustworthy guides, and prefer to book available tours after they feel that the guide is credible.
C. Build credibility with blog posts and experience sharing
👍 Good to visualize and deep dive into the guide's experience.
❌ Users prefer to see more images of the guide's diverse experiences first, and further read content after they get interested.
Find guides based on mountain/trail
I found that users want to find guides that are truly familiar with the trails to ensure safety. Thus, I led the iteration of sorting guides by trails, and streamline information.
A. Show top guides for the trail
B. Find out available tours or DM the guides
If users are interested, they can choose to resume to next steps.
C. Showcase recent experiences with the trail
D. Showcase reviews highlight
Find hikers that visited the trail recently
To facilitate hikers' exchange and identify latest updates, we came up with a trail-based system for users to identify the experienced hikers and ask for updates.
A. Showcase the latest persons that finish the trail
Community members can then message the person and learn about the specific updates.
B. Get notified when there's updates
C. Showcase the people that also finish the trail
Chronological order to help users identify recent visitors.
D. Q&A chat forum
Users can post questions and answers in forums to learn about the latest info.
.gif)
Winning UXD Award!
I had never imagined that our UX study group project could get this far to winning first place among 871 teams in the 11th User Experience Design Award!
The whole team flew from Taipei to Shanghai to pitched our story in front of jury presented by UXPA China.
Moving Foward
🤔 How might we simplify the UI and make the process of planning more engaging and motivating for users to follow?
🤗 How might we tackle the emotional challenge and encourage users to actively participate in experience sharing?
🥰 How might we build trust in the ecosystem to facilitate positive changes?
We might need to deep dive on the data utilization and recommendation algorithms to ensure balancing accuracy with privacy. We'd also need to dig into users' considerations regarding selecting commercial groups and their attitudes towards data sharing.
what i learned
As a researcher, product designer, and collaborator, I learned a lot through the process. The exchanges of ideas between the interdisciplinary team was the key that helped us overcome challenges, constantly ideate and test new ideas, and develop a solution that we're proud of!
The experience of setting standards, managing product development, conducting user research & usability testing, translating insights into product strategy, and working with an interdisciplinary team are valuable lessons that I'd like to further nurture as I grow.
8 Weeks
Visual Design
Brand Identity
Interaction Design
**Individual project
Design System, Typography, Logo Design, Wireframing, Brand Strategy, Figma
The Vera Project is a home to Seattle's creative community. Their mission is to provide a safe space for people to express themselves, learn skills, and foster community transformation via music and art.
In this project, I redesigned the website and branding guidelines for The Vera Project as a way to enhance their visual identity as a creative community.
.png)
This approach allows branding while does not constrain the space to specific pictorial association.
The simple form allows the logo to serve as a container for images or patterns.
The distinctive look signifies a sense of creative energy where elements are connecting in space.
The overlaying rules follow the key element in each content section (usually the largest component). Then, indent or extend the overlaying asset(s) by 1 column width.
Circle elements are visible in each content section to create dynamics in composition and guide visual flows. They are flexible components free of alignment or overlay rules.
Considering the dynamic and geometric nature of the visual system, the typefaces focus on readability, with varying weights to create hierarchy and nuance.
HEADINGS
The compact tracking of Oswald helps create a sleek and modern look. The uppercase treatment adds emphasis.
CONTENT
A common Sans Serif typeface, Roboto is highly readable and compliments well with Oswald. The uppercased titles help add emphasis.
The pair of both warm and cool colors enhance the creative and humane quality to the identity. The value of the colors are set to provide sufficient contrast when used against each other.
The secondary accents complement the palette and offer enough range to establish a clear visual hierarchy and readability in various settings.
Reduced saturation and tinted warm-tone unify the images, ensuring visual consistency and overall cohesion.
The imagery should showcase The Vera Project’s welcoming community and evoke interest in its creative activities.
See how the visual system applies on website and social templates.
All images are courtesy of Unsplash and the artists. The usage here is for demo purposes only.
