Bodego (2023)

UX Case Study

My Role

UX & UI Designer
Visual & Graphic Designer
UX Researcher
Slick Deck Designer & Presenter

Team

Kayla Hop Hing
Ben Valles
Winnie Huo
Chenchen Zhu
Yibei Zheng
Steven Poung

Tools

Figma
Figjam
Illustrator
Photoshop
Procreate
Pencil Sketching

Our General Process

Problem Space 💭

As commercialization of our food is always being upgraded, people find it increasingly difficult to be ethical consumers of the products we buy. Because it is perceived that actions on an individual level do not make a difference on the bigger scale, people often find it troublesome partake in habits that help us have a healthier planet on an individual level.  However, by changing the individual habits of one another, we can hold corporations accountable for their manufacturing and development processes through the power of the collective.

The ethical dimension of food waste [that] puts increasing pressure on retailers to show corporate social responsibility in terms of the environment and communities” (Teller et al., 2018)

Generally green marketing which must satisfy two objectives, improving environmental quality and customer satisfaction (Ottman et al., 2010).

Challenges

📑

Lack of Information

📎

Inconvenient Paper Tracking

⚒️

Lack of Tools

Lack of Time

💰

Economical Challenges

Our Solution

Bodego

Derived from the word “Bodega” which is Spanish for a small shop selling wine and groceries. Now used commonly as a slang for a grocery store in an urban area.
Bodega + Go = Bodego

Many assumptions about environmentalism wrongly presume that sustainability can only be supported through changes in infrastructure and public policy. While the individual consumer contributes to issues such as landfills and greenhouse gas emissions, it is miniscule when compared to the effects corporations pose to the environment as a whole.

Bodego Cares, From Start to Finish

The primary goal of Bodego is to ensure the formation of eco-friendly habits within users without making it a hassle in a busy, consumer lifestyle.

Problem Space 🔭

Primary Research

• We conducted interviews with individuals from various backgrounds & their experience with grocery shopping
• Conducted a questionnaire that were sent out online to try and gauge individual reasoning and behaviours related to making environmentally conscious consumer decisions.
• Usability tests were also conducted once a mid-fidelity prototype was produced. These insights were then used to inform our design decisions within the final prototype.

Secondary Research

We utilized a breadth of academic papers and journals and conducted a systematic literature review using the program Zotero.
This information served a baseline to-better understand the production to consumer process in the e-commerce world. As well as the impacts and significancy of individual change on actually influencing more ethical production processes.

Insights

Super Apps ⭐️

• User interface design which aims to include as many features as possible within an app, coined "super app." A popular design trend in the East over the more minimalist designs of the West.

System Architecture  🎛

• Individuals buying products from companies with more ethical environmental practices, will encourage corporations to produce products ethically.

Profits to Change Cycle  ⚖️

• Corporations and industry titans are most influenced by consumer spending.
• Promote change by redirecting consumer spending to support more ethical practices.

Our Design Requirements

Change on a consumer level

• User interface design which aims to include as many features as possible within an app, coined "super app." A popular design trend in the East over the more minimalist designs of the West.

Corporate-Scale Change

• Individuals buying products from companies with more ethical environmental practices, will encourage corporations to produce products ethically.

Promoting healthier and more ethical lifestyles

• Corporations and industry titans are most influenced by consumer spending.
• Promote change by redirecting consumer spending to support more ethical practices.

Branding & Visual Design ✨

• We conducted interviews with individuals from various backgrounds & their experience with grocery shopping
• Conducted a questionnaire that were sent out online to try and gauge individual reasoning and behaviours related to making environmentally conscious consumer decisions.
• Usability tests were also conducted once a mid-fidelity prototype was produced. These insights were then used to inform our design decisions within the final prototype.

Hi there I’m Bo!

I’m the official face of the grocery application Bodego. Here to help you take the necessary  steps to a greener, cleaner, and fresher world.

Because the visual & brand identity was solely my responsibility, I worked to carefully curate a recognizable brand identity that was different from other similar applications on the market.

Bo is meant to serve as the “face” of the platform, as an upbeat character designed with hints of retro and vintage stylistic choices. Additionally, with the UI design of the system in mind, I decided to incorporate softer complementary colours with the intention of pairing well with the actual UI and branding of Bodego.

Bright and Colourful

• Bright and colourful colour palette to lean into the bright personality of Bo.

Rounded & Soft

• Thin black stroke lines are less distracting to eyes
• Vertexes have rounded corners to bring softness to the graphics.

Simple & Welcoming

• The graphics were created with simplicity & uplifting colours and imagery.

Colour Pallette

The colour palette uses many earthy tones for Bo, as expected for a mascot which looks like our planet earth. Moreover the colours used to complement Bo are lighter pastel colours without much saturation so the attention of the user will be on Bo whenever he makes an appearance.

Logo

Graphics Display

A Splash of Graphics ✨

Throughout our system, colourful, eye-catching graphics were strategically placed to enhance the users interactions and experience with the Bodego Application.

A great example of the impact of graphics in our system in creating a welcoming environment is during the on-boarding process.

Each step in the on-boarding process is accompanied by a graphic to better explain each of the perks of the Bodego Application

Prototyping 📐

Figjam Brainstorm

Deriving Product Features & Requirements

Wireframing

Wireframing is a crucial step that all designers must take in order to map out the user's interactions with the conceptualized system. Through these sketches, we were able to determine the skeleton of our interface to begin low fidelity prototyping in Figma.

01

Collaborative Grocery Lists

• Easy shopping lists shared between family, friends, roommates, and partners.

02

Grocery Scanner

• easy shopping lists shared between family, friends, roomates, and partners.

03

Fridge Lifespan

• easy shopping lists shared between family, friends, roomates, and partners.

04

Coupons & Deals

• easy shopping lists shared between family, friends, roomates, and partners.

05

Explore & Discover

• easy shopping lists shared between family, friends, roomates, and partners.