Heartspoon
Heartspoon
Creating an intuitive online platform to
showcase
refugee-led catering services
Creating an intuitive online platform to showcase refugee-led catering services
Creating an intuitive online platform to showcase refugee-led catering services
A website for a social enterprise that connects refugees with the community through food. Heartspoon shares their six-month chef training program, lunch catering service, and the stories behind their mission.
A website for a social enterprise that connects refugees with the community through food. Heartspoon shares their six-month chef training program, lunch catering service, and the stories behind their mission.
Team
Team
Branding by Anaïs Bayle
Illustrations by Tara Asadi
Duration
Duration
4 weeks (Jan- Feb 2023)
My Role
My Role
Ideation, User research, Wireframing,
UI Design, Prototyping
Ideation, User research, Wireframing, UI Design, Prototyping
Tools
Tools
Figma
Defining the Problem
PROBLEM STATEMENT
Refugees face barriers to employment and cultural recognition, especially in spaces like schools and camps.
Refugees face barriers to employment and cultural recognition, especially in spaces like schools and camps.
Refugees face barriers to employment and cultural recognition, especially in spaces like schools and camps.
WHO THIS HELPS
DESIGN OPPORTUNITY
Design a website that shares Heartspoon’s mission and makes it easy for people to learn about the program.
Design a website that shares Heartspoon’s mission and makes it easy for people to learn about the program.
Design a website that shares Heartspoon’s mission and makes it easy for people to learn about the program.
Market Analysis
We looked at three Vancouver catering programs: Flavours of Hope, Social Crust, and Simply, and compared them to Heartspoon to highlight our unique offering.
We looked at three Vancouver catering programs: Flavours of Hope, Social Crust, and Simply, and compared them to Heartspoon to highlight our unique offering.
Visual Direction
Colour & Typography
Colour & Typography
Logo
Logo
Illustrations
Illustrations
Packaging
Packaging
Design
Site Map
Site Map
Wireframes
Wireframes
Final Product
Heartspoon is a conceptual social enterprise that celebrates the role of food in creating opportunity and connection.
My role: UX/UI Designer
Team: Tara Asadi (Illustration), Anaïs Bayle (Branding & Packaging)
Heartspoon is a conceptual social enterprise that celebrates the role of food in creating opportunity and connection.
My role: UX/UI Designer
Team: Tara Asadi (Illustration), Anaïs Bayle (Branding & Packaging)
Home
Home
Clear intro to Heartspoon’s mission
Testimonials and FAQs
Signup flow for new participants
Clear intro to Heartspoon’s mission
Testimonials and FAQs
Signup flow for new participants
About
About
Tells the Heartspoon story
Highlights its impact and partners
Tells the Heartspoon story
Highlights its impact and partners
Menu
Menu
Features sample dishes
Introduces the refugee chefs behind them
Features sample dishes
Introduces the refugee chefs behind them
Responsive UI
Responsive UI
Since many visitors might be browsing on their phones, I designed the site to be fully responsive so it looks and works great on mobile too.
Since many visitors might be browsing on their phones, I designed the site to be fully responsive so it looks and works great on mobile too.
Takeaway
I learned how to collaborate with teammates in different roles.
I learned how to collaborate with teammates in different roles.
Learned how to collaborate across different disciplines (branding, illustration, web design)
Practiced bringing diverse elements together into a cohesive website
Felt proud to work on a project that supports underrepresented communities
Learned how to collaborate across different disciplines (branding, illustration, web design)
Practiced bringing diverse elements together into a cohesive website
Felt proud to work on a project that supports underrepresented communities
Next Steps
I’d focus on user testing if we had more time.
I’d focus on user testing if we had more time.
Do real user testing (not just instructor feedback)
Refine flows based on user insights
Explore accessibility + expand the site further
Do real user testing (not just instructor feedback)
Refine flows based on user insights
Explore accessibility + expand the site further
Next Project
Next Project
Next Project
Waymo
Waymo
Smart card management app for transit riders
Smart card management app for transit riders
