User inputs company name and gets an estimate of their carbon emissions

Pain points:

  • CTA does not have a visual pop to distinguish itself

  • Colors are all over the place with no clear brand identity

  • Visuals take up space with no purpose

Carbon Sustain

Responsive Web Design for Carbon Accounting Start-Up

Carbon Sustain is a startup that helps organizations efficiently manage their carbon emissions and work toward achieving sustainability goals. They offer tools for tracking, reducing, and reporting carbon footprints. My team and I worked closely with the client to research, design, and establish their branding and online presence.

Role: Research lead + UI/UX Designer

Client: Carbon Sustain

Tools: Figma, Adobe Illustrator

Project Duration: 4 months

Team: Prisha Mangat, Christina Wuong, Nethra Dhamodaran, Ishanth Hombaiah

MY ROLE

As the Research Lead for this project, I collaborated with CEO Paul Byrzek to design user-centered improvements for their carbon emissions accounting platform including their landing page and dashboard. Paul envisioned a streamlined, intuitive interface that would transform carbon accounting from a liability into an asset, particularly for small and medium businesses.

My responsibilities included conducting competitive research on industry tools like Greenly and Sustain.life, analyzing user needs, and creating actionable insights for redesigning the platform. By aligning our designs with Carbon Sustain's value proposition—“AI TurboTax for Carbon Emissions”— I aimed to simplify complex processes while engaging users effectively.

INITIAL WEBSITE SCREENS

User enters carbon emissions, gets carbon impact insights.

Pain points:

  • Confusing and cluttered

  • No clear CTA

  • User does not know how to navigate at first glance

User can request a demo of their carbon emissions and request tools.

Pain points:

  • Confusing CTAs with different stylings

  • No clear progression of information

  • Visual hierarchy issues

No user research was conducted as the client had clearly defined goals and requirements, and the target audience—companies interested in Carbon Sustain’s services—would have been challenging to engage for research. Instead, I simulated how a company might interact with the website to identify potential usability issues and areas for improvement. Additionally, I performed competitor analysis to ensure the design aligned with industry standards while maintaining a unique value proposition.

USER TESTING

In order to better understand how companies would approach the website, I tried to navigate the website from the perspective of a potential client interested in reducing their net carbon emissions and took notes brainstorming my thought process.

COMPETITOR ANALYSIS

I researched 3 platforms in the carbon accounting space and found that most were utilizing testimonials to build user trust & had very easy-to-understand navigation systems and animations to draw the user in while keeping their design simple as is necessary in the carbon accounting space.

PROCESS

KEY INSIGHTS

  1. Unclear Mission Statement - Client’s mission and purpose were not immediately apparent to users. This lack of clarity could lead to confusion and make it challenging for potential customers to understand the value and goals of the business at first glance. Communicating the mission upfront is crucial to fostering user trust and engagement.

  2. Inconsistent Branding - Inconsistencies in design elements, typography, and color schemes created confusion for users and undermined the strength of the brand message, diluting its credibility. Clear and cohesive branding is essential to establish trust and recognition, especially in a field as sensitive as carbon emissions accounting.

  3. Disorganized Content - The content on the website was not well-structured, making navigation cumbersome and unintuitive. Users struggled to locate critical information quickly, which could discourage them from exploring the platform further. A well-organized content strategy is key to improving user experience and ensuring information is accessible and easy to digest

  4. Complex Service Offering - Users often failed to grasp the full scope of the client’s services due to the lack of clear explanations and guidance. The technical nature of carbon accounting and blockchain solutions can be overwhelming for potential customers, highlighting the need for simple, user-friendly content and interactive elements that educate and inform

These insights drove me to ask the question:

How might we get users to understand the goals of Carbon Sustain, trust the company, and navigate the website effectively to use the services it offers?

SYNTHESIS

To ensure a structured and collaborative approach to ideation, I conducted an affinity mapping exercise based on our research and synthesis. Each team member brainstormed potential solutions for the client’s website and grouped insights into categories that would guide improvements for the mid-fidelity prototype

  1. Input Collection
    I independently reviewed the client's website and its usability, synthesizing feedback from earlier research and analysis. I recorded ideas on digital sticky notes, focusing on various aspects such as visual design, user messaging, and navigation.

  2. Clustering Ideas
    I grouped all ideas into thematic categories based on shared insights. These clusters provided a clear structure for addressing key problem areas identified during research.

  3. Feedback Integration
    After grouping the notes, I reviewed and refined the categories based on team discussions and feedback from the client to ensure alignment with their goals.

DESIGN AND ITERATE

I developed two distinct mid-fidelity prototypes for the client, integrating key elements such as a wheel of trust and a background logo to establish a cohesive brand identity

Wireframe designs were iterated upon through usability testing and client feedback, with each iteration improving on design choices and visual hierarchy.

Testing was conducted remotely over Zoom by Balu Masti. I was able to observe his interactions and had him “think aloud” as he navigated through a prototype.

After the usability testing session, I decided upon our final concepts as keeping a consistent branding in a minimalistic way with earthy greens and all our features that incorporated trust into the website such as the testimonials.

LOFI OF FINAL DESIGN

DESIGN SYSTEM

HIGH FIDELITY DESIGNS

Dashboard

To reduce carbon emissions, CarbonSustain allows users to see a number of their statistics and how to improve upon them. I streamlined the user experience by breaking down the decarbonization journey into clear, manageable steps, making it intuitive and accessible for users to understand their progress and take meaningful actions. This approach ensures that users are guided through each stage of their sustainability journey with clarity and ease.

Areas for Improvement:

  • Greater focus on ideation and synthesis strategies early in the design process.

  • Pay more attention to finer design details, such as spacing, sizing, and alignment, to enhance overall polish.

For the final design, I decided to sketch out some designs based on our research, synthesis, and feedback from the mid-fi designs above. My main focus was building trust immediately upon arriving to the website without overwhelming the users.

This was difficult to achieve.

Instead of doing a wheel of trust as per the previous iteration, I decided to keep a couple logos and have some testimonials given by current customers. Additionally, I really focused on brand identity with greens corresponding to carbon sustainment.

Key Takeaways:

  • Gained invaluable experience in crafting a cohesive brand identity for a client.

  • Expanded my skills in design and prototyping tools, further enhancing my technical expertise.

  • Deepened my knowledge of carbon emissions accounting and its critical role in sustainability.

Landing Page

The final landing page for Carbon Sustain was the culmination of research, ideation, and iterative feedback aimed at addressing key usability and branding challenges. I began by ensuring the company’s mission was immediately clear through a prominent tagline paired with a concise subtext explaining Carbon Sustain’s AI-driven tools. The navigation was streamlined with intuitive labels complemented by call-to-action buttons to encourage user engagement. I added an interactive search bar was integrated on the landing section, allowing users to input company names and receive immediate carbon emission estimates. Trust and credibility were emphasized by showcasing partnerships and endorsements from recognized organizations alongside testimonials from industry figures. I also incorporated a much simpler, interactive, and live Carbon Calculator, where users could input details like to view visualized carbon data through an organized tab system which was easy to use.

I was able to keep up with the client’s goals where users have an easier time understanding what the website’s main mission is and how to navigate it in a simple way.

REFLECTION

What Went Well:

  • Exceptional team collaboration and effective communication with the client fostered a seamless workflow.

  • Conducted a robust competitive analysis that informed creative and impactful ideas.

  • Delivered high-quality UI/UX designs that aligned with the client’s needs and objectives.

Looking Ahead:

  • Prioritize both convenience and visual appeal to create designs that are both functional and engaging.

  • Establish and maintain a consistent design system from the outset of future projects.

  • Dedicate more time to conducting user research to ensure designs are user-centered and impactful.

Testimonial From Client

“The UX at Berkeley team exceeded all of my expectations this Fall semester. I hired the team not knowing what to expect and was pleased to find an enthusiastic and creative team very capable of complex and modern web designs made through Figma. It was truly a delight to work with the creative minds of the Cal undergrads Prisha, Chrstina, Diya, Ishanth, and Nethra! They were diligent and collaborated cohesively as a great design team all semester with a dedication to excellence in UX with beautiful and elegant UI. They did a wonderful job of incorporating modern elements into the landing page and demonstrated their endurance with the breadth of designs delivered from the main Landing Page, Newsletter, Team, Login/Registration, Main Menu Navigation, and updated Dashboard. I love the thought they put into creating a beautiful and sustainable company palette that elevated our brand. They were great listeners and significantly improved CarbonSustain's brand design and identity. Kudos for sticking to our weekly calls throughout the project while juggling a busy academic schedule at Cal. The designs always come out better through committee and UX@Berkeley you nailed it - A+! Looking forward to working together again in the Spring!”

Best,

--

Paul Bryzek | Founder | CEO | CTO

CarbonSustain, Inc.