Toohla is a climate impact app helping individuals access and track their carbon footprint. In order to expand their presence in the environmental startup space they reached out to Catalog for guidance on structuring their app and differentiating their brand from the competition.
Client
Toohla
Industry
Climate Impact
Role
Tool
Figma
Scope of Work
Dashboard
UI/UX
Prototyping
Wireframing
Toohla faced the complex challenge of introducing environmentally-conscious users of figuring our accurate data of their footprint. In addition, being all to connect with friends and family helps encourage long-term engagement.
Toohla stakeholders asked how we could structure the complex information that creates their personalized carbon scores into something anyone could consume and understand.
In addition to structuring the metrics that form their comprehensive environmental impact assessment, they needed an attractive and welcoming brand to package their data and education platform.
THE OPPORTUNITY
Carbon emissions trackers are one of the impactful ways that we can understand our footprint. With Toohla, users translate their footprint into action and bring their community along with them.
RESEARCH
Toohla was one of several competitors seeking to lead in the carbon tracking market. In many ways they were in a race to the top of the heap amongst other platforms.
My analysis showed an emerging brand philosophy in the industry focusing on activism, positivity, and the desire to incentivize climate action. I made recommendations to pursue this aesthetic and to explore how Toohla can develop their own identity focusing on their community.
Direct: Commons, Klima, Earth Hero
Analogous: Greenly
RESEARCH
I started with mid-fidelity screens to help Toohla figure out the best hierarchy for organizing their features. In addition, Toohla's app would be data-driven, meaning they would need to find a way to display complex information in an interesting, easy-to-digest way. As you will see in subsequent sections, these wireframes would change to better fit their goals.
RESEARCH
📣
Impact Awareness
Toohla brings valuable and informative climate metrics to their users. Structuring these metrics and how they are calculated is the foundation of how the app works.
💎
Alluring Design
Environmental causes benefit from nature inspired design. Toohla is seeking a suitable redesign of their app to leverage this association.
🌎
Community
Toohla’s biggest contribution is access to a climate-conscious community which needs to be advertised and emphasized through their app.
🌳
Positive Mindset
Environmental causes want to emphasize optimism to drive positive change. This was an important consideration for Toohla’s design philosophy.
HIGHLIGHTS
1.
Collecting user consumption and habits.
2.
Calculating their impact and presenting it.
3.
Providing tools and a community to address it.
MVP
Following a successful onboarding of the user, they can now explore the platform. This requires easy navigation and alluring clusters of information to keep the user engaged and excited to learn about their role in climate change mitigation.
Here I considered how best to help users keep up their momentum. I utilized achievement badges, a visual metaphor for growth in the form of a blossoming tree, a points system, and progress lines. Paired with statistics, Toohla would gameify the CO2 tracking process.
MVP
Beyond the surface level summaries of carbon footprint, Toohla wanted options to structure data long-term for users.
Here I demonstrated a variety of data visualization options within the brand identity I created for Toohla. Bright colors and easy to understand linear graphs show progress towards climate goals. Comparative impact assessments on a world map that connect back to articles and the community pages on the app inspire further learning opportunities for users.
MVP
Toohla wanted to foster a community for users to discuss their impact and encourage others with their own actions on the app. They felt this would align them better with competitors and more effectively help orient users on their services.
Here I utilize a leaderboard to add a competitive edge that pushes for more vigorous change. In addition, seeing your community’s activities and cheering them help increase user engagement on the app.
MVP
Keeping users informed is an integral part of Toohla's mission. In building out the blog pages, it was important to make engaging yet informational layout inspired by news app design.
MVP
To make the process of co2 tracking fun and interactive, I created custom tree illustrations. Like apps like Finch, these illustrations slowly show the progression of growing your tree, keeping users excited and continuously engaged. In addition, we have a custom icon library that is used in badges and titles to add visual interest, clarity, and variety.
MVP
To ensure accessibility guidelines were met, color choices were checked with an online color contrast checker. Below you can see how the home screen's color contrast passes AAA (enhanced contrast) standards.
RESEARCH
HAND-OFF
OUTCOME
Toohla’s founder designed his company using his data science and climate tech background to take the complex math and data of carbon footprints and fit it to the individual. Having successfully done that, Toohla was looking for the know-how to convert pure data into something approachable.
With our design concepts in hand, Toohla was empowered to begin creating the beta version of their app to begin attracting the needed seed-funding to make their full platform a reality.
UP NEXT:
