LeafLife App

A community-driven app promoting joyful habits for personal well-being and the planet

Project Overview

LeafLife is a community-driven app that promote awareness and personal growth combined with environmental responsibility. This app provides various individual and group challenges to the users or let them craft their own environmental and sustainable activities.
As they grow and contribute, they earn sustainable rewards, fostering a culture of continuous learning and eco-action. In addition, the app allows users to track and visualize the positive impacts they've made on the environment.

View Desktop Figma Prototype

View App Figma Prototype

Roles

UX Researcher

Interaction (IxD) Designer

User Experience (UX) Designer

User Interface (UI) Designer

Team

Group of 4

Deliverables

User surveys and one-on-one interviews

Competitive analysis

User personas

Information Architecture

Mid fidelity wireframes

Task flows

High fidelity prototype

Usability tests and findings

Project Specifications

Figma

Miro

Google Forms

Illustrator

Duration

10 Weeks

Research

We conducted a comprehensive research approach, utilizing both qualitative methods such as one-on-one interviews and quantitative techniques like user surveys. The surveys enabled me to pinpoint my target audience and understand their driving factors, while one-on-one interviews offered nuanced qualitative and emotional insights into critical aspects of users' journeys.

Key Research Insights

Unawareness: Participants lacked knowledge about the direct environmental impact of their water, electricity, and consumption habits.
Guidance Gap: Many participants felt a need for clear guidance on where to start in their journey to reduce environmental impact.
Barrier Challenges: Overcoming obstacles like limited time and knowledge was a common concern, highlighting the importance of seamless solutions integrated into daily routines.
Motivation to Track Personal Progress: Users are motivated to track their personal progress and visualize positive impacts on the environment.

“Knowing how our actions affect the environment encourages responsibility and helps us stop harmful behaviors—an essential role played by education!”

Monic

“The group gives strength and motivation to continue.”

Sara

“Tell me how much percentage I helped the environment with this volume of waste separation!”

Arash

Competitive Analysis

Conducting research on leading enterprises within the sustainable habits platform market is crucial. Analyzing their approaches to similar challenges provides valuable insights into both strengths and weaknesses. This comparative analysis aids in pinpointing potential feature gaps that LeafLife could address. I have examined three direct competitors actively addressing the same issue as our platform.

Unite with eco-enthusiasts to make and practice green daily habit.

Product vision and solution

From these findings, we decided as a product to identify key business goals:

Our Business Goals:

Facilitate users in adopting eco-friendly habits
Encouraging actions that reduce their impact on the planet
Providing opportunities for learning about subjects and topics in this area.

User Empathy

With a clearer understanding of how users perceive our app for eco-friendly actions, we deemed it essential to craft personas representing different age groups derived from survey insights. These personas will play a pivotal role in steering our design decisions as we move forward.

Conceptualization

After setting up the product goals and deciding what features to include, my focus shifts to continue building up the structure of LeafLife in both the web and app interfaces. Information architecture plays a crucial role in visualizing the relationship between content elements and examining their hierarchy, ensuring a well-organized and user-friendly framework across both platforms

Visualizing a User-Centric Experience

Drawing quickly on paper multiple times showed me how hard it is to keep important tasks simple. This was a big deal in figuring out which design styles in websites and apps work well, and how people will move around from one screen to another.

Identifying Points of Confusion through Wireframe Prototypes

After sketching, I created mid-fidelity, clickable wireframes for user testing, observing touch and swipe gestures, and engaging in conversations to understand user expectations. Two key takeaways from this process are:

Users got confused when picking the community for their actions.
Some users suggested adding a preference filter to make choosing actions clearer and smoother.

These insights, including the identified challenge in selecting communities, will inform further refinements to ensure the wireframes align with user expectations and enhance overall usability.