Overview
Project type: Self-Initiated
Deliverables: Market research, User research, Visual design, Copywriting
Timeframe: 2 months
Online shopping 🛍️ is the act of buying products from online retailers on the internet and it's typically influenced by price, availability, and personal taste.
What if I told you there are other factors far more important to think about when shopping? Like life or death important. Maybe not to that extent (for some, it is), but hey, it’s still crucial if we want to keep our planet alive for a while longer.
I’m talking sustainability factors which are known among eco-friendly shoppers who sometimes can’t stand committing to a purchase without fact-checking for environmental and social sustainability. This often turns into a time-consuming and exhausting process in order for them to make responsible shopping decisions.
How could this happen? :(
Eco-friendly consumers are often:
-
Forced to spend time and effort validating the sustainability of products online as a result of brands not being transparent enough about how they go about producing their products.
-
Unclear about products’ environmental impact and certain attributes, therefore affecting their ability to accurately assess their sustainability and make a decision.
-
Overwhelmed by the long process and end up making purchasing decisions based on misconceptions about brands.
Therefore, by adding sustainability factors to other common shopping considerations like price and personal preference, eco-friendly shoppers face the significant burden of contemplating all these aspects before making a responsible purchase.
~
How can we make it easier and less time-consuming for eco-conscious consumers to make responsible shopping decisions confidently?
~
Solution 💡
I aimed to solve this problem with an AI-powered browser extension that scans product pages and generates a summary of sustainability information and a rating score to help consumers make responsible shopping decisions with confidence.
The goals of this extension were to:
-
Save consumers time and effort by analyzing product pages and providing a summary of a product’s true environmental impact.
-
Help consumers confidently make shopping decisions that align with their values.
-
Engage consumers with sustainable shopping using a gamified approach.
-
Act as a dictionary for educating consumers on sustainability-related terms.
~
The three areas of impact for the extension:
Secondary research revealed three common problems among eco-conscious shoppers
I started the research phase by reviewing existing data to understand what has already been uncovered. By examining past research and analyzing social media discussions on consumer behavior related to sustainable shopping, I identified three key issues that consistently emerged:
1. Consumers lack trust in environmental product claims
“Consumers want sustainability but struggle to find it. Even when they do, they often don't trust the environmental claims companies make”
“Having had enough of tall claims about brands being vegan, cruelty-free, and chemical-free, I was almost going to give up on shopping for the most eco-friendly goods.“ - A comment on Reddit
2. Consumers struggle to understand the environmental impact and sustainability logos on products
“72% of shoppers in a survey struggled to work out which products were actually better for the environment.”
“Consumers say they rely most on labels and certifications to identify sustainable products, yet most were unable to accurately describe the meaning behind common sustainability logos”
3. Many consumers were frustrated with the extra time and effort it takes to research and evaluate products online
“I do a thorough search when I shop online for the right product and sometimes I get exhausted after hours of search on online stores.”
“It literally takes hours and hours to online shop for clothes properly. It’s unbelievable to me how much time it takes.”
“consumers need to make an extra effort in order to find green products, to analyze the specifications written on the label and their relevance and of course, to buy them at a higher price.”
📝Secondary Research takeaway📝
Eco-friendly shoppers find it hard to make responsible purchases because they need to do a lot of research first and often don't know much about sustainability.
~
Uncovering new findings about sustainable shoppers (a survey)
Though secondary research was useful for gaining an overview of existing data and developing initial concepts, I was curious to zoom in on the present with the hope of discovering new consumer behavior.
Therefore, I crafted a survey aimed at uncovering new behaviors as well as validating secondary research findings.
The survey ended up mostly showing consistent data with secondary research.
Here are the similar findings, along with my thoughts:
**It turns out eco-friendly consumers still have trust issues concerning environmental product claims.**
-
Another similar finding was the time and effort it takes to evaluate a product’s sustainability
These comments were from an open-ended question on the survey:
“takes a long time to research info on each product.”
“you have to really dig deep to determine whether a brand actually practices sustainability”
However, one interesting finding caught my attention
100% said they’re able to understand the meaning of different sustainability terms, labels or certifications, however, 66.7% of them also said they had often made purchasing decisions based on misconceptions about a product's environmental impact.
Despite claiming to comprehend sustainability terms and indicators, a notable proportion of respondents still struggle to apply this knowledge effectively when making purchasing decisions.
Therefore, more importance needed to be put on enhancing consumer understanding of sustainability information on products and how it impacts our environment.
~
📝Primary Research takeaway📝
Both research methods showed similar trends, which was a positive outcome, indicating consistency in the data gathered. However, consumers falling for misconceptions about products’ impact slightly steered my focus into striving to make the extension more comprehensive and educational.
📝Key takeaways from research:
All research findings came down to three main takeaways:
-
Help educate consumers on products’ sustainability in order for them to make responsible shopping decisions.
-
Reduce the time and effort it takes to learn about a product’s sustainability and swiftly make a decision.
-
Bridge the gap between understanding sustainability concepts and applying them effectively in purchasing decisions.
Taking a peek at the competition to learn and find opportunities for differentiation
Following research, I was curious to see if there were existing solutions addressing the same problems eco-conscious shoppers are facing and to identify opportunities and areas of differentiation for my extension.
I found three competitors that were addressing similar issues: Ecowiser, Shade and Amazon’s sustainability section feature:
📝 Key takeaways from competitor analysis 📝
Existing solutions offer a fragmented approach to sustainable shoppers
All three competitors fail to provide comprehensive information on a product’s sustainability, omitting reasons why consumers should avoid/ opt for certain products. Instead, they directly suggest alternatives without explanations, leaving consumers confused about why a product is considered unsustainable/ sustainable in the first place.
Therefore, these competitors offer faulty and ineffective solutions that:
-
👎🏽Does not fill the informational gap that consumers experience in understanding a product's environmental impact.
-
👎🏽Does not provide enough sustainability information that would make consumers feel confident enough to make responsible purchasing decisions.
-
👎🏽Does not solve the main issue of condensing the research effort that consumers often make, but rather eliminate it entirely and going straight to offering alternatives.
-
👎🏽Does not make any effort in encouraging consumers in their noble mission of striving to make a positive impact on the planet.
These insights highlighted a missed opportunity to deliver a comprehensive, yet engaging solution for making responsible shopping decisions.
Such an experience would:
-
👍🏽Foster greater consumer confidence in the effectiveness of their shopping decisions.
-
👍🏽Enhance consumer understanding of the various aspects of a product’s sustainability
-
👍🏽Boost consumer engagement with sustainable shopping habits
-
👍🏽Make a more significant impact on the e-commerce industry’s sustainability.
Exploring design solutions 🧑🏽🎨✨
Leaving a memorable first impression with an informative and personalized onboarding experience
My aim with the onboarding experience was to foster a sense of ownership and connection with the extension.
Therefore:
-
By asking users about their sustainability goals and what they value most, we tailor the experience to their specific needs and preferences.
-
Additionally, allowing users to choose from a selection of fun, sustainability-related nicknames or create their own custom username adds a personalized touch.
This approach not only ensures that users feel engaged and invested in the extension from the start but also encourages onboarding completion.
Enhancing user trust with a real-time, transparent analysis screen.
As learned from research, transparency and trust is of critical importance to our users.
Therefore, I aimed to clearly display a transparent, real-time status of the analysis steps being conducted on products.
By highlighting each step the extension takes before providing a summary of the results, we can build trust by showing users exactly how the analysis is conducted, as well as build suspense for the results.
Making shopping decisions easier with a rating system for products
As I discovered from competitors, two of them offer a rating system, however, one rates the product that the consumer chooses to analyze, and the other only rates its suggested alternatives.
Therefore, my solution was superior in these aspects:
-
🪄 Combining both competitor solutions with ratings for analyzed products, as well as their alternatives.
-
🪄 Offering the information to back up the ratings of products.
-
🪄 Leveraging the extension’s name as a reference to a product’s rating creates a unique branding element that could enhance word-of-mouth promotion among eco-friendly shoppers, ultimately attracting more users.
-
🪄 Showing a single screen for the rating before jumping into the analysis and the ‘why’ behind it to make it inviting and engaging to learn about the rational behind the rating.
Speaking of the rational behind the rating, the analysis results screen took a number of iterations in search of something engaging and different from competitors
However,
looking back at what the goals were for the extension and this solution’s similarity to competitors, this first iteration makes for a mundane experience that lacks engagement and interaction with the extension, as well as a clear content hierarchy for easier consumption of information.
The next iteration was an improved version with a better visual hierarchy
The sustainability information is well-organized into categories. This structured presentation reduces cognitive load, allowing users to grasp the key sustainability aspects of the product more efficiently.
At the bottom, I introduced a layer of customization with a personalized message if the product aligns with any of the user’s sustainability goals.
This iteration significantly:
-
✅ Improves user engagement by presenting information in a structured and accessible manner.
-
✅ Reduces cognitive load.
-
✅ Enhances the overall user experience through personalization and visual clarity.
Introducing the final Iteration... because there's always one more iteration
My reasoning for an onboarding approach was due to its ability to keep users engaged throughout the results.
The benefits on an onboarding-like experience:
-
👌🏽 The sustainability information is still organized into categories, but the onboarding process breaks down each category individually, making it easier for users to focus on one aspect at a time.
-
👌🏽 The onboarding makes the experience more interactive and user-controlled.
-
👌🏽 The onboarding ensures that users are not overwhelmed with information and can absorb the details in manageable chunks.
Another key reason is its intuitive nature for collecting user data—nothing fishy I promise 👀
This data will assess the effectiveness of the extension in influencing eco-friendly buying decisions.
Users can share their thoughts on how the extension has influenced their understanding of product sustainability, its usability, and any changes in their purchasing habits.
This feedback is invaluable for continuous improvement and refinement of the extension to better meet their needs and foster more sustainable shopping behaviors.
Encouraging users to maintain their responsible shopping habits
First iteration:
-
👍🏽 A simple congratulatory message that acknowledges the user's decision to trust the extension and choose highly-rated products.
-
👎🏽 The message feels a bit static and does not elicit any emotion or encouragement to maintain users’ use of the extension.
Second iteration:
-
👍🏽 The streak feature adds a gamification element, which can be highly motivating for users.
-
👍🏽 The streak is displayed prominently, motivating users to continue their streak and make a bigger impact.
-
👍🏽 It provides a sense of accomplishment and encourages users to maintain their sustainable shopping habits.
The second iteration sparked my inspiration to include an engaging section in users’ profiles
At first, the profile only had a section for editing the user’s name, a section to view past purchases and that’s it.
However, after introducing the streak progress in the second iteration, I said why not showcase some user statistics such as achievements, purchasing streaks and badges earned from their sustainable purchasing decisions:
By incorporating this section, it can:
-
👍🏽 Help users track their progress and feel a sense of accomplishment as they reach new milestones.
-
👍🏽 Serve as a motivational tool and foster a sense of community among eco-conscious shoppers, encouraging them to continue making responsible choices.
-
👍🏽 Increase user engagement and continuous use of the extension to keep track of their progress and achievements.
-
👍🏽 Provide a personalized experience, reinforcing the impact of their individual contributions to environmental sustainability.
At the bottom of the extension, I added a floating section that shuffles encouraging messages everyday whenever the user opens the extension.
Additionally, users have the option to take a profile snap that captures their sustainability stats, which they can then share with friends. This feature not only encourages users to take pride in their eco-friendly choices but also promotes the extension by leveraging social sharing.
Now, switching to the dark si—I mean the analysis results of a lower rated products
The analysis of a lower rated product is slightly different from that of a higher rated one, mainly because the information hurts to see for the eco-friendly consumers :(
Red colors and icons are employed to signify that things are not good: Negative environmental impact, no sustainability certifications, basic labor rights violations. These visual cues make it easy for users to understand the negative aspects involved in the production of the product.
Specific negative environmental impact icons, such as high CO₂ emissions and waste generation, are prominently displayed alongside supporting information.
Taking inspiration from competitors and executing it better
As discovered through competitor analysis, two competitors offer alternatives which was a great feature to include when Greendrop detects an unsustainable product. However, their rating system is not effective because one competitor offers a rating system for the original, while another rates the alternative products but provides minimal explanations.
Unlike these competitors, Greendrop:
-
Provides ratings for both the original and alternative products, allowing for a clear and comprehensive comparison.
-
Additionally and most importantly, it includes explanations and reasons for choosing alternatives, which boosts user confidence and understanding.
Another opportunity discovered through including an alternatives section was partnering with eco-friendly brands which means promoting their products as the alternatives showcased for the lower rated products.
This not only reduces the time and effort required for users to find sustainable alternatives but also supports business goals by promoting brands in partnership with the extension.
As for which solution is the most effective, both iterations aim to explain why the alternatives are better than the original product. However, the second iteration is superior because it:
-
👍🏽 Shows a prominent button to view a comparison as opposed to the first.
-
👍🏽 Highlights the benefits of the alternatives against the negatives of the original product.
-
👍🏽 Offers a side-by-side comparison that serves as a clear benchmark, making it easier for users to make informed decisions.
After finishing up the alternatives section, I had an idea for the first rating screen
As seen before, the first screen displays the product rating. After going through the analysis results of an unsustainable product, shoppers are not left high and dry, but instead, they are presented with alternatives to the analyzed product. Therefore, I thought why not include a shortcut for users to save time and jump straight to the alternatives.
Offering a quick jump to sustainable alternatives is an excellent solution to:
-
👍🏽 Users who are in a hurry or are primarily interested in the overall rating rather than a detailed analysis breakdown.
-
👍🏽 Users who have used the extension multiple times and have developed trust in its recommendations.
-
👍🏽 Users who may no longer feel the need to double-check the information and can confidently rely on the extension to guide them towards more sustainable choices.
Making users feel better and empowered after making it through the analysis of a lower rated product
First iteration
The first solution offers a basic commendation which makes users feel acknowledged but not necessarily informed or empowered. The message does little to contextualize the importance of their decision or the potential impact they’ve avoided, which could limit its effectiveness in fostering long-term engagement and awareness.
Second iteration
In the second iteration, I went for a more impactful approach by not only congratulating the user but also explaining the potential negative consequences they avoided by not purchasing the unsustainable product.
This method serves a dual purpose:
-
👍🏽 It highlights the extension’s value in helping users make informed decisions
-
👍🏽 It educates them on the harmful effects of unsustainable products.
-
Now, introducing my favorite feature and the inspiration behind this whole extension
The ‘Identify’ feature lets users learn about sustainability-related terms or problematic materials by hovering over specific words that the extension manages to define and explain.
With this tool, users can effortlessly learn about sustainability-related terms or identify problematic materials directly within product descriptions. By simply hovering over specific words, the extension provides clear definitions and explanations, empowering users to make more informed purchasing decisions.
This feature will:
-
👍🏽 Support users in understanding the environmental impact of the products they are considering
-
👍🏽 Promote awareness of key sustainability concepts.
-
👍🏽 Clarify technical jargon, making it accessible to all users, regardless of their prior knowledge of sustainability.
Presenting the explanations
The first iteration includes a link to learn more about the identified material, however, the second solution prompts the users to engage with the extension’s analysis feature after they’ve learned about a specific term. This approach not only retains users within the extension, preventing distraction or loss of context, but it also encourages deeper interaction with the extension.
Unlike the first iteration, which risked diverting attention, the new approach ensures that users remain focused on their shopping task while still gaining valuable insights, thereby enhancing both convenience and user engagement.
Believe it or not, this exact feature randomly popped inside my head one day and after 3 months, it turned into all this. It’s funny how inspiration sometimes leads us to unexpected and beautiful outcomes.
Reflections:
-
This project showed me that designing an extension can be just as challenging as larger projects when approached with the same rigorous design process.
-
While reviewing other extensions on the market, I noticed that aesthetics often take a backseat to functionality when it comes to extensions. This observation motivated me to not only focus on the experience but also touch on the emotions of users with something visually interesting, fun and appealing.
-
Although smaller in scope than a website or mobile app, this project had the potential to make a meaningful impact on people and the environment, which made it deserving of full attention. It was a rewarding journey and a valuable learning experience that I thoroughly enjoyed.