treemap
Duration
September 2021 -
December 2021
Role:
UX researcher
UX Designer
As a little kid one of my favorite memories was going with my dad to the nearest recycling center to dispose of all the glass, plastic, and aluminum cans we’ve collected over a month in exchange for money. This method of rewarding environmentally conscious habits ingrained good ecological behavior within me. When I grew up I learned that recycling wasn’t just good for my wallet, it was good for the environment and health of our planet.
Becoming environmentally conscious can be an unfulfilling and daunting task. There needs to be a way to extrinsically motivate and provide guidance to those who are not eco-friendly and do not traditionally recycle.
Through a comprehensive process of research and need-finding, ideation, prototyping, and user testing, we designed an app that helps users easily make the transition into an eco-friendly lifestyle.
Research
Secondary Research:
We conducted online research from 8 different sources with the intent on creating a starting point for our questionnaire questions. The sources ranged from a variety of topics including online research groups, existing sustainability apps, and academic research on recycling behavior.
Our results indicated a need for a more educational route regarding recycling and food waste. We realized that at least in our community, we were not properly taught how to sort our waste for the benefit of our environment. We planned to keep the topic broad for now, and possibly zeroing in on a specific kind of waste later on after our questionnaire based on the practicality and familiarity with what type of waste.
User Research:
We received 21 responses in our questionnaire ranging from online forum responses (reddit) and college students from UC San Diego. The data we received from respondents showcases a positive trend towards good recycling behavior and a desire to learn more about proper waste management. However, we will have to utilize user interviews to properly delve into this data and examine if the results were only due to proper social behavior bias.
Based upon the percentages, the populace we surveyed frequently recycled all the materials we surveyed except for organic materials. This meant that food waste was a pain point as users did not know how/where to recycle. The top 3 materials people recycled from the questionnaire were: paper, plastic, and glass.
Important findings from the results of our questionnaire include:
Cultural influence, Inconvenience, and resolution
Primary Research: User Interviews
For user interviews, our questions centered around the scope of a person’s knowledge on recycling, where they learned to waste manage, and common pain points in waste management. Providing enough insight to connect our online secondary research with our local audience to extrapolate our user’s needs, goals, and pain points.
Cultural Influence
"I didn't learn about waste management" - Chinese International student
Inconvenience
"Sometimes lazy to decide or does not know what to recycle. Lack of knowledge. Convenience/laziness of getting disposable utensils because there is less effort to clean." - 20 year old female student
Resolution
"Sometimes I don't know and I just guess... mostly just convenience factor"
- 32 year old schoolteacher
In terms of attitudes towards recycling, we had a consensus of multiple interviewees saying that laziness and inconvenience discourages them from using environmentally friendly choices, learning about the correct practices of recycling, and traveling to where the appropriate disposal bins are located. Due to this consensus among our interviews our team decided upon utilizing convenience and education as our main design principles for the iteration stage.
User Personas
Based upon consistent interview themes from our user research we then created user personas that would represent the targeted demographic our app would provide solutions for. I created the primary user persona displayed below:
Storyboarding:
The next step of our design process was to storyboard some solutions to address the needs of our personas. We ended up drawing 6 storyboard app concepts and underwent additional interviews to confirm which concepts would be most effective and impactful for our users:
User Research Conclusion:
Our storyboard interviews helped narrow does the scope of our problem space, and identify what sort of product would help users waste manage the most. Now that we had a solid understanding of our main product users, their background, and common pain points we could begin prototyping.
Under our comprehensive user research we identified our goal of making it more convenient for people to locate waste management locations while educating them on how to properly dispose of different materials.
Our two design principles we kept in mind throughout the prototyping process:
Education: Fulfill user needs by affording educational opportunities on the prototype
Convenience: Ensure we create a clear user flow from pain point to solution in our product to capture and retain people’s attention on our solution.
Prototype
Wireframing:
With a better understanding of our main users, their background, issues, and the solutions they would be most receptive towards we could begin prototyping. We decided upon creating a mobile app due to the convenience factor of phone usage, which follows the design principles outlined for our research.
Pictured below is what was originally a general wireframe converted into a lo-fi prototype for user testing to occur on.
Style Guide:
To ensure our group had a solidified theme for when we began our transition into visual interface design we developed a mood-board for inspiration on the experience we wanted our users to have when utilizing the app.
From the mood-board we transitioned into forming the basics of our style guide that would represent the visual brand of our app:
1. Incorporation of green to represent the environment along with other traditional recycling colors.
2. Warm colors and a rounded type face to imitate friendliness
3. Rounded icons and components to match the typeface
High-Fidelity Prototype:
Below is the final product of our app, and we underwent two iterations after user testing on our initial high-fidelity prototype. We had 8 participants navigate through the app and then asked them a series of questions following their experience:
1. What are the pros and cons in terms of interface design/appearance?
2. What are your thoughts regarding the navigation of the app while completing these tasks?
3. What are some critiques you have regarding the features/icons of the app?
4. How would you evaluate the flow of this app?
5. Would you frequently use an app like this?
6. To gauge your understanding of our app, describe this product in your own words.
Feedback:
Our user testing indicated some of the pain points users had when interacting with our prototype, and some of the changes we made as a result include:
Onboarding
First time users are subjected to a typical onboarding stage, where users will receive a quick overview on how to utilize the app.
Resource Navigation
Users can search a specific resource they would like to recycle, and receive a corresponding map to the nearest recycling centers that offer to collect the specific resource.
Rewards
Treemap utilized a 2-pronged system of gamification and rewards to provide users incentives to continue recycling.
Key Takeaways:
This project was a challenging endeavor as we went through all phases of the design process, and here are some of the insights and challenges I learned from this experience:
1. Discussing ideas as a group can lead to the process being painfully slow, as we didn't know each other well enough to judge each other's strengths and weaknesses. Nobody wants to override someone's opinion which led to many ideas being indecisive and awkwardly being over discussed. A clear hierarchy and individual roles can help facilitate more efficient work time.
2. The key lesson of sunk cost fallacy, was imprinted throughout our minds as we had to look over our high-fidelity prototype. Just because we "sunk" in many hours to a screen or component did not mean they were irremovable. An example of this is how I spent 8 hours creating a statistics frame for the app that had to be scrapped from the final design.
3. How impactful the color theme of a brand can carry to a user's initial impression. We had many users state how they could see themselves using the app just based on the visual-design alone and the cute designs to come with our style guideline. This helps make our product marketable and incentivizes users to share our prototype among their social networks which garners more attention.
Role Contributions:
Treemap was made by the cohesive effort of Joyce Qi, Sabrina Mao, Zhuotong Li, and myself!
Each of us worked together throughout the research stage by conducting individual interviews and user testing as well as designing interfaces and completing write-ups for various stages of our project.
My personal contributions include: creating the questionnaire, drafting both research and user testing questions/tasks, making the primary persona, writing 4 out of 6 storyboard scripts, and designing the onboarding and statistics page.
