City of Long Beach Tree Planting Web Application

Brief

For the past few years, the local government at Long Beach, California has been devising a Climate Action and Adaptation Plan to combat the detrimental problems that climate change has been creating for their city. As the city prepares to push out the plan Summer 2022, they partnered with Coding it Forward’s Civic Innovation Corps, a selective program that brings together young technologists and government agencies across the United States, to onboard designers and developers to provide technological support for the plan.

Following a human-centered design process from discovery to development, our team of two UX designers and one software engineer initiated the development of a tree planting web application to streamline the process of planting a tree with Long Beach’s Office of Sustainability. Our goal is to increase urban greening and improve air quality in the city by encouraging home owners to plant fruit trees in their front yard or non-fruit trees on the street immediately in front of their property.

My Role

• UX Research
• UI Design
• Visual Design

Discovery

Since all of us came in without prior knowledge on Long Beach, it was important that we first learn as much as possible about climate action and adaptation in the city. We wanted to hear from a variety of voices and look closely into how climate change has been affecting the city historically.

We reached out and spoke to:

• Community and neighborhood organization leaders
• Local environmental justice group leaders
• City employees at the Office of Sustainability
• City employees who worked on the Climate Action & Adaptation Plan

We also gathered information from:

• The Climate Action & Adaptation Plan document
• Blogs and social media of environmental justice groups
• Published articles environmental justice
• Zencity insights (platform to gauge community needs through data)

We organized our findings by putting them on post-its and clustering them on a growing Miro board. From our clusters, we had the following major insights:

• Climate change is affecting communities disproportionately: underserved communities living near the 710 freeway have had a long history of health problems related poor air quality caused by the greenhouse gas emissions
• There is a lack of community engagement, especially with low-income communities: organizations did not have concrete plans to reach out to the community
• There is a disconnect between the city and the community: people do not know the existence of the city’s climate initiatives
• Data collection is falling short: there is a lack of granulated data for different action areas of the climate action and adaptation plan
• Reducing greenhouse gas emissions will have the biggest impact: actions that reduce emissions such as switching to cleaner energy and planting trees are prioritized
• Bureaucracy is a barrier: climate actions such as planting trees and installing solar panels are more difficult than needed because the process to get paperwork and permits approved is slow

How Might We Statements

After learning about the current situation regarding climate change and climate action in Long Beach, we came together to create How Might We (HMW) statements based on what we heard.

Here are some HMW statements we came up with:

• How might we engage the communities around highly polluted areas?
• How might we bridge the information gap of climate change between different socioeconomic classes in Long Beach?
• How might we encourage more people to switch over to renewable energy sources?
• How might we increase the usage of existing and growing incentive programs for climate action?
• How might we encourage more planting of trees to support the regrowth of urban canopy?
• How might we fill in the gaps in data that help people keep track of climate action progress?

We took into account of the time and resources we have and through a dot voting process, we were able to narrow down to one HMW statement:

• How might we better encourage participation in tree planting across all communities so that we can increase the amount of green spaces in Long Beach and decrease greenhouse gas emissions?

User Interviews

Now that we have narrowed down our problem scope, we decided that we needed to conduct additional user interviews that are more specific to tree planting and urban greening in Long Beach.

In this round of interviews, we spoke to:

• Coordinator of the tree planting program in the Office of Sustainability
• People who have recently planted trees with the Office of Sustainability
• Community and neighborhood organization leaders that are active in advocating for more trees to be grown in their neighborhood

We compiled information from the interviews on a Miro board and discovered the following major insights:

• Lack of internal structure: there is no defined system to store past and current applications to plant a tree
• People feel discouraged: the convoluted application system deters potential applications
• There is a general net loss of trees: even though trees are planted, many of them do not survive due to the lack of care
• Tree maintenance is seen as a hassle: community members do not want deal with falling leaves and branches and the potential repercussions
• Lack of community engagement: there is little to no outreach done by the office of sustainability to promote their program
• Community likes fun: community activities that keep things informal and encourage everyone to have fun through art and culture are the most successful
• Simplicity is preferred: heavily scientific terms and dense text drive people away
• Relatability is important: community members are more willing to participate in activities where they see people like them and hear their language
• Empowering community is key: messages such as “we need your help” is more powerful than “we help you”
• Lack of knowledge in urban greening: many do not know enough about urban greening and climate action to take action
• Strong influence between neighbors: people express in trees when they see them on their neighbor's property

Personas & Journey Maps

Following our interviews, we decided to create personas and journey maps to help us empathize with the different people who will engage with our product and understand their goals and needs better.

We created 3 unique personas:

• The Average Long Beach Resident
• The Community Organizer
• An Engaged Long Beach Resident

Below are the user journey maps for each persona:

Problem Statements & Brainstorming

Using our personas and journey maps, we came up with the following problem statements to help us brainstorm in the solution space:

• Full-time workers in underserved communities need a way to engage in urban greening without encountering additional time or money costs so that they can help reduce the air pollution in their community
• Full-time workers in underserved communities need a way to learn about the benefits of trees and how they can meet the their personal preferences so that they are more willing to plant trees in their neighborhoods
• Community organizers who struggle to motivate their community to participate in urban greening need a way to better engage their community so that the community can be empowered to combat climate change by increasing urban greening together
• Community organizers who want to educate and motivate their community to participate in urban greening need a way to educate them via simple explanations and low effort actionables so that they are more willing to plant trees in their neighborhoods
• Environmentally conscious resident who want to plant trees need a way to plant them with minimal frustration so that they can continue to preserve the beauty of nature in their neighborhood

Using these statements, we brainstormed the following ideas:

• Web platform to adopt a tree
• Mobile application to gamify the caring and watering of trees
• Mobile application with built-in reminders to water and care for trees
• Mobile application to track the watering status of trees in the area
• Web platform to streamline the process of signing up for the Office of Sustainability’s tree planting program
• Web platform that mimics the shopping experience for planting trees
• Mobile application that allows people to volunteer at tree planting initiatives
• Online coordinating tool to bring all organizations involved with tree planting together on one platform

Solution

After taking into account impact and feasibility, we settled with the idea of a web application that will:

• Increase awareness of the Office of Sustainability’s tree planting program
• Streamline the application process of the program
• Educate people on the importance of trees/urban greening
• Make it easier for someone to choose a tree they want to plant

Key Features + User Flow

Before diving into the design, we created a preliminary user flow to showcase the important features of the web application and how they work with each other to deliver the final experience.

The key features of the web application is as follow:

• Educational home page
• Tree Quiz with Recommendations
• Tree Catalog with Filter
• Tree Applications (Front yard/Fruit & Street)
• Tree Application Portal

This is the user flow from the home page to the application portal:

This is the user flow from the the application portal to submitting the application:

Visual Language

Since this application will be published under the name of the Office of Sustainability, we had to ensure that the visual language matches what is approved by the local government of Long Beach.

Initial Prototypes + Usability Testing

We created an interactive prototype of the product on Figma and conducted Think Aloud usability tests. We received feedback from other fellows in our fellowship cohort, people in the Office of Sustability, and our manager.

Educational Home Page

Tree Quiz with Recommendations

Tree Catalog with Filter

Application Portal

Tree Applications

Prototype Iterations

After testing our initial prototypes, we made iterations based on the feedback we received.

Our main changes include:

• Redesign of the home page to include more information on the tree planting program, the Office of Sustability, and the necessary steps to take
• Accessibility improvements such as changing the location of the legend and making the icons more self-explanatory
• Improvement of the filter to be more intuitive
• Adoption of a passwordless login system where people only need to enter their email and a code sent to their inbox
• Improvement of consistency and application flow for both applications
• Change of wording across the web application to emphasize that the program is free and only requires applications

Below is a demo of the prototype after iteration:

Reflection

Overall, the fellowship with the City of Long Beach through Coding it Forward's Civic Innovation Corps has been fruitful and educational. While gathering information on climate action and adaptation in Long Beach, I gained a better understanding of environmental justice and its importance. I also learned a lot about the barriers to creating a healthier environment, and what the government and community are doing to tackle them. Additionally, after spending a summer with the government, I also became more familiar with working with bureaucracy.

I was able to grow as a UX designer as well. While it was difficult working in a broad problem space with minimal guidance, I learned to embrace the human-centered design process and allow my conversations with people through interviews guide me through. I also became more resilient to setbacks by viewing them as opportunities rather than obstacles. After this fellowship, I am confident that I have become a better designer than before.

Next Steps

While my team and I would love to continue to flesh out this product, we have reached the end of our fellowship by the end of the first iteration. To ensure that the next team can pick up with we left off, we created an extensive documentation for the project, detailing our process and our vision for next steps.

Our next steps include:

• Conducting usability tests with people in underserved communities, people who have planted trees with the city before, and people who have not planted trees with the city before.
• Further fleshing out the education components of the application
• Further developing the tree selection quiz
• Adding more language options to increase accessibility
• Creating a QR code to place on planted trees as access points for the web application
• Creating an access point to the web application from the Office of Sustainability website