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 and choices within users without making it a hassle in a busy, consumer lifestyle. This in turn, influences companies to adopt more sustainable practices in the production of their products.

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

• Convenient shopping lists that can be shared between family, friends, roommates, and partners.

• Shoppers can pin coupons within the list itself to easily pull up coupon codes at the cash.

• Label function to help emphasize dietary wants & needs.

02

Grocery Scanner

• Grocery Scanner aims to educate the user on the production operations used to create the product.

• It also provides other options from different brands to make comparing products easier. So consumers can make more informed choices regarding the products they choose to consume.

• The feature also provides a score of sustainability according to the MadeGood scale which measures the sustainability of the product during it's production.

03

Fridge Lifespan

• Aiming to aid in food overconsumption, the fridge lifespan feature aims to help consumers be more mindful of the groceries they already have in the fridge.

• We also recognized a gap in knowledge when it came to food expiry. Wherein products labelled "best before" is often misinterpreted as already "expired."

• There is a built-in calendar to help users view when they bought, and need to use or finish products.

04

Coupons & Deals

• This is a shopping helper application after all, and like Flipp, our platform aims to reduce paper waste by providing users weekly flyers and coupons.

• These coupons can also be linked within your grocery lists for easy access during shopping trips.

05

Explore & Discover

• Explore page helps users generate more ideas for recipes and crafts for the products and food they buy.

• This feature also boasts the potential for an AI chatbot which could help create real value within this feature.

• This feature also aims to help educate users on potential up-cycling that can be done once they finish using each product.