Project Overview
Block
Reclaim your neighborhood
one block at a time.
Duration
My Role
Prototyping
Platform
Challenge
Our team was tasked with creating a responsive website.
We focused on the impacts of gentrification to find solutions that helped reverse some of the harm that gentrification has on black and brown communities.
My Contributions
- Lead Interaction Designer alongside three other designers
- I conducted user interviews, ideated features, created our persona
- prototyped both the mid and high fidelity wireframes
- led two rounds of usability tests on our prototype.
Solution
Block is a website that gives people a way to engage with and empower their community by using their voices.
.png)
.png)
.png)
Understand
Understanding Gentrification
As a team we discussed gentrification and made hypothesis and assumptions about gentrification.
Here's what we thought:
- People want to know when about plans for new development happening near and in their neighborhoods and communities.
- People don't like gentrification because of its negative impacts and changes to their community.
- People are frustrated by the lack of control they have over new developments in their communities.
Interviews
Although The team had assumptions, to better understand how gentrification affects people we needed to talk to people living in gentrifying areas.
We selected five people who lived in a growing city, had witnessed or experienced gentrification, and were familiar with the concept of gentrification. The interviews told us about their living situation, the culture of their neighborhood, their goals of being homeowners, having a lack of control over their situation, and feeling like their city prioritized economies over residents.
.png)
Empathize
Wassup Garret !
We Created our persona Garret from the data we gathered during user interviews. Creating Garret helps us understand our users’ needs, experiences, behaviors, and goals. Garret’s needs, goals & paint points remind us why so we know what to create.
.png)
Journey Map
To understand Garret better, Our team created a visual timeline or a journey map. The journey map helped us understand what people who live in gentrified neighborhoods go through while trying to complete everyday tasks or accomplish their goals.
We wanted everyone on our team to envision his experience to gain a more holistic view of what living in a gentrified neighborhood is like.
We marked different actions that Garret would take, tracked his emotional response , and also listed various pain points he may feel throughout the process.
Ideate
Block's Features
Local Government
The government information page enables people to see who their local government officials are and easily communicate with them.
People want a way to participate in their local community and interact directly with city officials to voice their frustrations and concerns.
Construction
The Construction page shows new upcoming and ongoing construction. It also gives people the ability to voice their construction-specific complaints.
Local Buisness
The Local business page gives people information about businesses in their area. They can leave reviews, share, and find out about events. Bringing awareness and support to the businesses around them, they are helping to preserve the local culture.
Design
Style Guide
.png)
Test
Can people living in gentrified neighborhoods figure out Block?
Our team conducted usability testing of our Mid Fi Wireframes. We asked users to complete 4 Tasks and observed them as they navigated through the site.
People had difficulty navigating through the local government page.
Feedback
3 out of 5 users clicked into the Local Gov page but didn’t think they were in the right place because they didn’t recognize a clear next step.
Users were confused with the format of gov page, and thought it was an about page/directory than an actionable feature.
We didn’t have a single user who noticed the Filter function on both the gov and local biz page.
.png)
Next Steps
Handoff
The team was excited to handoff the prototype and spec doc to the Development team to build out the designs. We put together a zeplin file and handed this design off to the dev team to create our website. Working with developers gave a new perspective on how to design.
They asked us questions we never thought of. The front-end devs told us
how many shades of green we used in our design & highlights all of our typos. The back-end devs asked us where the information was coming from. Overall the experience gave me new things to consider when designing.
Mobile Prototype
Desktop Prototype
.png)