A coffee brand to aid migratory birds

Approach

I used the design thinking process to guide my project.

‍

Methods

• Secondary research
• Interviews
• Personas
• User stories
• Journey mapping
• Competitive analysis
• Usability testing

Secondary research

I began by researching the problem space, and how shade-grown coffee helps birds. I learned that:

• North America's bird population has declined by 29% since 1970
• Certified Bird Friendly coffee is grown the traditional way, without pesticides, under a canopy of trees that provide high quality habitat for birds.
• It is distinguished from shade-grown coffee, which is not regulated and could mean shade from other crops or non-native trees that aren't as beneficial to birds.

Next, I searched for the social and emotional factors that drive sustainable purchases:

• Social influence; people want to fit in
• Feelings of hope and pride
• Knowing that one's actions will have an impact

‍

Interviews

I conducted three 30-minute interviews over Zoom with coffee drinkers in the US, and an email interview with a research ecologist at the Smithsonian Institute, which issues the Bird Friendly certification. This helped me understand the pain points of sustainable coffee farmers, and how they might also be served by a design solution.

"I don't understand the connection between coffee and birds." - Quote from user

‍

Qualitative Research: Interviews

• Many buyers don't know what shade-grown coffee is, let alone Bird Friendly coffee, and are confused by various shade certifications.
• Shoppers feel more confident purchasing products certified as fair trade and organic.
• A better understanding of how shade-grown coffee helps birds could persuade more people to buy it.
• Farmers at higher elevations who grow under a dense and diverse shade canopy may experience lower yields, and higher incidence of the "ojo de gallo" fungus.

Personas

Creating personas helped me better understand my intended user group, eco-minded coffee drinkers in the US.

‍

Journey mapping

Next, I wrote user stories and created a journey map to visualize how customers might interact with my product.  

‍

Using these tools to further articulate the core problems that my design could solve, I compiled a list of major pain points and solutions.

‍

Major Pain Points

• Coffee drinkers aren't educated about Bird Friendly Coffee.
• Bird Friendly coffee isn't easy to identify or find on shelves.
• Lack of awareness of migratory songbirds and the threats they face.
• Farmers lack access to incentives for sustainable practices and certifications.

Proposed Solutions

• Include an informative video on the home screen that explains the issue.
• Create packaging that features birds and illustrates the concept of a shade canopy providing habitat
• Include a section about biodiversity loss and other environmental factors harming birds
• Create a screen for farmers with links to market incentives, cooperatives, and other resources.

‍

Weighing my options

I decided to focus on the problem of customer education, and create an experience centered on spotlighting the issues, and providing inspiration. 

This was slightly challenging, as I saw a real opportunity for a digital platform that could help coffee farmers access resources and incentives for growing sustainable coffee and other crops. For the scope of this project, however, I decided to stick with my original concept, which remained a unique challenge.

Competitive analysis

An analysis of four Bird Friendly coffee brands gave me an understanding of existing solutions, and revealed opportunities for differentiating my designs.

Gaps Identified

• Compelling explanation of the issues not featured prominently
• Many lack a mobile app
• Inconsistent visual designs
• Lack of blog or other written content, a missed opportunity to deepen engagement

‍‍

Crazy 8s

Using the "Crazy 8's" exercise, I sketched eight ideas in eight minutes, focusing on quantity over quality. This allowed me to think freely and withold judgement.

User flows

I selected several ideas from my brainstorming session, including a news feed, bird tracker, and bird cam. Since these were interactive and could be viewed throughout the day, I decided on a mobile-first approach for the design process, and diagrammed how each feature would work on the app.

A map screen would allow users to track the spring and summer birds passing through their area:

‍

Paper wireframes

After sketching wireframes and creating a low-fidelity version of the app, my prototype was ready for testing.

‍

Testing the low-fidelity prototype

I conducted an unmoderated usability study of the prototype, and organized the data I gathered into an affinity diagram. I then prioritized the insights I found using a P0-P2 scale. Since there were no P0 insights, I began with P1 and made the necessary improvements.

‍

Iterating on the design

Insight + solution: Users found the "Seek" button confusing. I decided to remove it since it felt too busy alongside the "Shop" button.

‍

Insight + solution: There was no option to continue shopping once an item was added to the cart, so I added a screen between the "Add to cart" and "Cart" pages with this option.

Insight + solution: There was no way to contact customer service, so I added a "Contact us" and confirmation screen.

Insight + solution: Users wanted more checkout features, such as the option to send their order as a gift, a confirmation number, and an emailed receipt.

Insight + solution: Users wanted information on more ways to help birds, so I added a screen with some tips.

‍

Refining the design

I began the high-fidelity design phase by creating  packaging mockups to establish a color palette for the app.

‍

The coffee packaging would include a QR code that could be scanned in-store, allowing for instant consumer education via an informative video on the site's home screen (though most likely, shoppers would watch this later).

Since research showed that users were confused by shade certifications, I decided to leave off the Bird Friendly seal in favor of a bird-themed design that I hoped would quickly illustrate the concept.

‍

Next, I created several versions of the home screen in different fonts and colors. After getting  feedback, I chose a deep green background, which seemed to welcome viewers into the forest canopy.

Sticker sheet

A sticker sheet helped keep my designs consistent.

‍

Accessibility

To ensure accessibility, I checked to make sure my colors were compliant with the AA category of the Web Content Accessibility Guidelines (WCAG 2.0). Design principles like hierarchy, scale, repetition and proximity helped create a readable and user friendly design.

‍

Mockups — key screens

Adapting the design for web

While the purpose of the mobile app was to educate and inspire new customers, the website would focus on account related tasks like managing subscriptions and tracking orders.

‍

Sitemap

‍

Wireframes

I used a tiered layer cake layout on the home screen to present the site's unique features.

‍

A side menu on the account page allows members to complete a variety of tasks.

→ View mobile prototype

‍

‍Migration map

This location-based feature lets users track the birds that migrate through their area.

‍

Stories and root issues

A latest stories menu features articles about migratory birds and related topics. Root issues screens highlight problems associated with deforestation.

‍

Shop and checkout

Shoppers can choose from several types of coffee.

‍

Track orders

The "Track orders" option is featured at the top of the account page for quick access.

‍

Manage subscriptions

Users can adjust the item quantity and frequency of their orders, and delete or add new subscriptions.