UpHill

UI, UX, Research

Mapping the way to revitalize Pittsburgh's
historic Hill District

Pittsburgh's Hill District was a famous stop for many jazz acts during the 20s-50s, and although it has recently fallen on harder times, many organizations there are hoping to restore the Hill's status as one of Pittsburgh's most vibrant neighborhood. As the neighborhood has been making these changes, however, many outside of its boundaries, remain unaware of the current projects being undertaken in their own backyard, as well as the historic significance of the neighborhood. To garner awareness, and participation in the Hill's current transformation, I developed a web app called UpHill, which enables users to view a map of the Hill, discover the Hill's geographic relationship with the city's other neighborhoods and learn more about current and historic places in the Hill.

Goal Educate Pittsburgh residents of the historic importance of the Hill District

Why? Being redeveloped and transformed through mid-century urban renewal projects, the Hill District’s African American historic contributions to jazz have been largely overlooked.

Key Flows 
- Map view
- Interior historic site pages
- Phone app (later de-scoped)

Team:
1 total

Product Design •


My role: 
Product Design

UX System Map, UI Design, Persona Mapping, Illustration, Historic Research, User research (interviewing/qualitative)

From map to interactive history lesson

With the map, the videos and the photo archives, the site has many components that need to flow harmoniously. By having the site elements mimic the pop out effects of the map elements, I sought to create a more unified front. Additionally, by using an abundance of white space, balanced by pops of color, I made the site more visually connected to the black and white photos; hinting at the Hill's future and it's past. New features also include an events panel and email mailing list. As the site's ultimate goal is to rejuvenate interest and investment in the Hill, my hope is that people who leave near it will be able to stop by the page and become active in the events that they see posted there. I have teamed up with local community organizations such as the YMCA to keep the events page full of info.
 

The Leo app that the student encounters in their guidance counselor's office.
Long-scroll views of both the home page and interior pages.

The Hill today and the Hill tomorrow

Right now, the map points are the traditional map points that you usually see on sites like Google Maps or MapQuest, but I'm seeking to revise the map points, especially ones that relate to highly relevant venues. The Hill has a slew of historic jazz venues and they will instead be represented with icons in the style of those above. Because many of these buildings do not exist in the state that the icons portray them in, I felt that this would not only be a great way to enable people to imagine what the Hill was like, but also what the can become again.

Some of the illustrations that I created for the map. Locations with illustrations correspond to buildings where a concerted community effort is being made to bring them back with their original function in mind, with a new function or to buidlings where an historically significant event took place.

The old site. Balancing the black and white photos and the color was a challenge in my primary iterations, but as time went on, I started to restrict the color, and create a more unified, and more mature look. The navigation for this iteration was also far more complex than the site currently is.

Because of all the parts, I sketched out many mockups of what the site could look like, trying to make everything fluid.

Because of all the parts, I sketched out many mockups of what the site could look like, trying to make everything fluid.

This project really pushed my limits. Although the main component of the site is a map, which spells out historic and current places of interest in the Hill, from the map, users can access interviews with locals connected to the locations portrayed on the map as well as a written history and photos of each of the map points. Along with designing and coding the website, I have also been filming and editing the interviews and gathering information from sources as diverse as the city library to photo archives of residents who lived in the Hill. It has been an intense process, but after much ideation, I came to the conclusion that this was the correct way to go about creating a system to renew interest in the Hill. People often have a hard time realizing spaces and the people who live there, so attacking the problem from the angle of not only allowing them the opportunity to familiarize themselves with the geography, but also the people of the Hill was the only way that this project would work.

Small user flow for the app, that later had to be abandoned.

Some of my sketches that I used to keep track of the video editing.

© Copyright 2019 garvey smith