B2B Sustainable Climate Solutions

B2B Sustainable Climate Solutions

B2B Sustainable Climate Solutions

Personalized marketplace with business footprint calculation and expert recommendations

Client

ESGentle, Inc.

ESGentle

Date

March - September 2023

Mar-Sep 2023

Role

UX/UI Designer

UX Designer

Competitive Analysis

User Flow

Jorney Map

Research

CJM

MosCoW

User Flow

Research

Usability Study

Prototyping

Research

Overview

ESGentle is a platform connecting companies in the ESG space with top cleantech providers, addressing the challenge of finding climate solutions efficiently.

The Problem

Corporations and mid-size companies face a challenge in finding cost-effective climate solutions to achieve high ESG ratings. They must navigate complex, time-consuming research, unclear CO₂ data, high consultation costs, and increasing regulations, which delay environmental action.

Solution

Over the course of 7 months, we launched a climate tech marketplace, developed a concept for a footprint calculator, and created personalized recommendations, helping users reduce GHG (greenhouse gas) emissions without the need for costly consultants.

My Role

In a team of seven, I worked on creating personalized recommendations using business footprint calculations. Collaborating with the ESGentle founder, an ESG advisor, a software engineer, a QA analyst, and two designers, I contributed to the marketplace, catalog, checkout, product pages, and other interface elements.

Results overview
View Prototype
research

Market Research

The global climate sustainability market is expected to reach USD 41.62 billion by 2028, growing at 20.3% annually.

Emerging online marketplaces equipped with personalized and analytical tools are expected to become essential resources for businesses in the coming years.

These platforms will play a key role in carbon emissions reduction strategies.

Competitive Analysis

The startup gathered the team to build such a platform.


Personally I analyzed 6+ competitors to understand their visual design patterns for cart, product and list pages.


Regarding footprint calculators I analyzed 13 competitors to understand industry standards, gaps.

The bad

  • No reliable marketplace with sufficient carbon solutions.

  • Lack of transparency, accountability, and guidance for companies.

  • Calculations results are limited and ambiguous.

  • No assistance with understanding information.

  • Only 15% of compared calculators use 3 Scopes of emissions with details that can give precise results.

The good

  • There are many marketplaces with carbon credits. Most of them have an easy flow and are user friendly.

  • Many individual footprint or simple business calculators are free on the most of platforms.

  • Some competitors provide educational content related to sustainable practices.

Mini User Interviews

Due to a lack of budget for research and difficulties connecting with ESG officers, I initiated participation in the SF Climate Week 2023 networking event.


This allowed me to engage directly with nine potential users from our target audience, providing a unique and cost-free opportunity to gather valuable insights.


At the same time, another team member conducted an online survey targeting individuals interested in sustainable living, broadening our understanding with additional data and perspectives.

What is the most important factor for you in the work with the sustainable climate solutions?

Trust, transparency,
ease of solution choice

Trust, transparency,
ease of solution choice

ESG performance data
and reporting

ESG performance data
and reporting

Relatively quick
and intuitive sale

Relatively quick
and intuitive sale

Target Audience

Based on research and stakeholders interview we identified 3 main roles for users of our platform:

Solution buyers

They include corporations, government agencies, SMEs, and eco-conscious consumers, driven by regulatory compliance, cost savings, and environmental responsibility.

Solution providers

They include companies in renewable energy, energy efficiency, and environmental consulting, offering services and products to help reduce environmental impact.

Offset vendors

These include organizations like Climate Action Reserve that certify and sell credits from renewable energy, reforestation, and other emission-reduction projects.

Our initial research revealed that many in our target audience struggle to find marketplaces for verified climate solutions, calculate emissions data, and addressing ESG concerns.

Conceptualization

Climate Tech Marketplace

Defining pain points

Using the available data, I applied a CJM to analyze the user journey and pain points on every step of the purchase and define the user requirements for our platform. By focusing on client priorities, we mapped the journey of sustainable solution buyers.

By extracting pain points, we identified possible solutions to address them.

Key User Pain Points
Possible solutions

Time constraints for learning & research

Sustainability catalog:
One place with B2B climate solutions

Uncertain and fragmented diverse market

  • User account & dashboard, reports, orders

  • Personalized recommendations

  • User account & dashboard, reports, orders

  • Personalized recom-tions

Search and navigation complexity

  • Search functionality: Advanced filters

  • Solution categories

Affordability and solutions access

  • Pricing transparency: Costs or it’s range

  • Subscription plans

Unreliable solutions, deception

  • Ratings and reviews, verification badges

  • Metrics of solution effectiveness

Ambiguous solution details

  • Comprehensive solution descriptions

  • Metrics, benchmarks for comparisons

Bureaucratic and difficult buying process

  • Simplified Checkout: Streamlined steps

  • Real-time order confirmation

Solutions prioritization

Based on meetings with stakeholders, brainstorming sessions, and gathered information, we created a MoSCoW analysis to prioritize all the ideas.

Collaborative design direction

I initiated the Sticky Decision technique by anonymously sharing our work in a document, creating a heatmap for voting on the best design solutions, and discussing the highlights. The founder, acting as the Decider, made the final call using a supervote. Our tasks included the Landing Page, Marketplace List, Cart, Registration, etc.

Personalized CO2 Solutions

Integrating calculator and recommendations

I developed a Personalized Recommendation feature based on an advanced user calculations. The foundation was a corporate Excel calculator previously used by customers to estimate their CO₂ business emissions. To enhance the user experience, I designed a user flow and integrated the feature into the website.

First ideas of calculator

First ideas

To include recommendations on the website, I needed emission numbers from the calculator.
I sketched several initial ideas, which were revised multiple times before creating the first digital wireframes.
After the first digital version, I made 2 iterations.

First wireframes

design iteration

Addressing User Challenges

Delving into the climate tech realm and analyzing user feedback allowed us to process numerous examples and insights, leading to iterative design improvements for the marketplace. After other team members left, I independently conducted the second usability study and iteration, focusing on finalizing the personalized recommendations feature. Here are some screens from the last iteration:

  • Results Refinements

    See all results in one place and have access to subcategories

  • Recommendation adjustments

    See the main recommended products and their comparison with metrics

  • Input for available data

    Select categories and input values for them in one place

  • CTA buttons

    Differentiate the products from demo offers

  • Completion of the flow

    See alert when data collection is finished

  • Flow adjustments

    Have a clear flow with collaborative option

  • Problem

    The result interpretation is unclear, making it hard to correlate numbers with images and differentiate between results pages.

    Solution
    • Combined pages into one for easier navigation

    • Removed unnecessary elements to streamline the content

  • problem

    Recommendations get lost in the overwhelming comparison details, and it's unclear how to set a budget for them.

    Solution
    • Fewer elements with a "View More" CTA button were used

    • 3 colorful items were added to highlight recommended solutions

    • A filter for budget and type was implemented

  • problem

    It is unclear what data to input in fields, what it means, and how it relates to the recommendations.

    Solution
    • Additional explanations were provided for each step.

    • A link to learn more about categories was added.

    • The user flow was adjusted to enable easy access to recommendations or the option to start a new calculation.

    • Categories were redesigned

  • problem

    The visibility of the delegation option is ambiguous and confusing, while the methods themselves are unclear.

    Solution
    • The overall layout was revised for clarity

    • A new "Invite Collaborators" button was introduced

    • Methods were integrated into the table for easier access

  • problem

    The catalog is confusing in terms of the buying and demo indicators.

    Solution
    • A prominent primary CTA button was added for purchases

    • A secondary button was included for demo requests

  • problem

    The notification about data completion, prompting users to view results and recommendations, is not visible enough.

    Solution
    • A bright color was added to the notification bar, along with red dots on the navigation,
      to alert users about changes in the calculator or recommendations

Testing

Prototype Validation

We conducted mini usability testing with 3 participants. We checked cart flow and calculator.

All users successfully navigated all features. However, 2 out of 3 struggled with emissions calculations, found the results imprecise due to a basic quiz. They couldn’t buy carbon offset products without booking a demo, and had difficulty understanding the comparison of recommended plans.

We conducted mini usability testing with 3 participant. We checked cart flow and calculator.

All users successfully navigated all features. However, 2 out of 3 struggled with emissions calculations, found the results imprecise due to a basic quiz. They couldn’t buy carbon offset products without booking a demo, and had difficulty understanding the comparison of recommended plans.

Users need more details
to trust provider

CO2 results should be
more reliable

Emission results should be more reliable

Colors should be more accessible

Checkout page should have more details

Checkout should have more documents, details

Moderated Usability Study

I conducted a usability study with 6 participants, and extracted and prioritized insights:

Priority 1

  • Unresponsive interactive elements

  • Uncertainty about scope’s data

  • Results are hard to interpret

  • Overwhelming comparison details

  • Invisible delegation option

Priority 2

  • The Product page lacks pricing and impact clarity

  • Duplicate "Place Order" buttons confuse users

  • Data handling steps are unclear

The Product page lacks pricing and impact clarity

  • Duplicate "Place Order" buttons confuse users

  • Data handling steps are unclear

Priority 3

  • Gestalt principles are broken

  • Delegation pop-up disrupts flow

  • Uncertainty regarding bureaucracy

  • Confirmation steps are too fast

  • Unclear if the account is free

development

Design system establishment

We collaborated with a freelance software engineer to deliver the first release: a basic marketplace that was integrated into the existing ESGentle site, accessible via a demo with the founder. Despite debates about MUI, we provided polished designs using a Modified Material Design UI kit. The next release was planned as a standalone website featuring a calculator-based recommendation system.

Results and reflection

Guiding buyers in climate tech solutions

Buy offsets

Buying

Online purchase of carbon credit products

Request Demo

Demos

Scheduling of solution demonstration

Scheduling of solution demo

Personalized solutions

Recs

Recommended solutions based on business emissions

Personal solutions based on business emissions

Calculate emissions

CO2 values

Advanced detailed analytics based on 3 scopes

Collaboration

Sharing

Delegating or sharing data collection tasks with colleagues

Project Outcome

We built the MVP from scratch to create the marketplace and showcase it to investors through demos.

5

Contracts for Marketplace placement were signed after the 1st release launch.

25

Vendors
are finalizing contracts by the end of Q2.

40%

Buyer trust increased after the second usability test compared to the first.

News about ESGentle Marketplace Launch was published in famous web fintech journal MarketWatch and we increased recognition of this Startup in Climate Industry of the SF Bay Area.

Lessons Learned

I learned how to

  • identify key components for project initiation and incorporate my project management skills,

  • effectively collaborate with team and use some of the sprint techniques,

  • work in fast-paced evolving startup environment with changing product requirements,

  • enhance product through design iterations, incorporating user and stakeholder feedback to deliver value,

  • organize our design with design system, and increase speed of work with Figma plugins,

  • articulate decisions, present the work for stakeholders,

  • perform a developer hand-off,

  • combine knowledge of new climate tech and e-commerce domains.

What Would I Do Differently

  • Prioritize flow for solution providers.



  • Simplify onboarding for solution providers, enabling easier management of their listings.

  • Standardize documents and agreements for consistency.

  • Include region-specific contracts and agreements to ensure compliance with local regulations and streamline onboarding.

  • Automate data collection. Create a tool to automate data collection, reducing errors and boosting efficiency.

  • Revise online sales and installation process.

Streamline the process from purchase to installation with clear communication and updates.

  • Enhance website security.

Implement advanced security measures like multi-factor authentication to enhance trust and protect data.

  • Use Lean UX Canvas and Agile.

References

To see updated sitemap visit the SiteMap (jpg)

Learn more about collaborative Competitive Analysis (jpg)

View my affinity diagram and analysis in Insights after the 2d usability study (jpg)

Discover all founded pain points and solution ideas visiting Problem-Solution document (jpg)

Explore my Customer Journey Map (jpg)