Paint the Pavement

____________________________
Junior Communication Design Studio
Fall 2016

 
 

Prompt: Pittsburgh has been chosen to be the next 2017 Paint the Pavement City! This national program encourages community building, increases and promotes public safety, and uses public art as a means to transform dangerous roadways and interactions into neighborhood assets. The City of Pittsburgh has “hired” us to create the visual identity system for this new and exciting citywide initiative.

At the start of this project, our class was given a packet of text: all the information on the Paint the Pavement program. It talked about the goals and objectives of the program, what you need to apply, how to apply, and resources you need to get started. It was hard to navigate and make sense of, so our challenge was to present all of the information in a clear way. I thought that a website would be a good way to guide readers through the whole process. Instead of being intimidated by a large packet of materials, they can be exposed to the different steps in the application at their own pace, one webpage at a time. I also branded the campaign with a tagline ("Brighten Up Pittsburgh!"), a logo (the paintbrush with a bridge in it), a poster, and a bright color palette with gradients. My goal was to create a system that was visually appealing and easy to navigate.


Process

Logo and Icon

To start, we began at a small level. As a class, we created a set of icons to use in our pieces, and we individually created word marks. In my word mark, I wanted to portray the mission of Paint the Pavement while also making it specific to pittsburgh. I settled on an icon with a bridge in a paintbrush. 

 

Making Sense of the information

We were given the existing application packet for Paint the Pavement, and were tasked with making sense of all the information. Here's a picture of me organizing different types of content on the board. I cut up the application, arranged sections by topic, made note of redundancies, and grouped linked information. I used these sections to create initial drafts. At first, I wanted to present all the information in print form. Below are some prototypes for how those would look. 

 
 

Moving to Web

I was a bit frustrated with handling a large amount of content in print form. I tried to place myself in someone's shoes, and I realized that I would probably not be interested in this program from a booklet that I was mailed or saw in a store. Most of the information I come across or find useful is on the web, so I decided to take a different direction. Also, having a website would allow me to progressively show viewers the information in a less intimidating way. Also, instead of flipping back and forth between physical pages, one can easily navigate from link to link. A website would also allow people to create their own profiles and save their progress in the application. Below is a sitemap of how the information/pages are structured. Then there is a screen capture of what it looks like to move through the web application.

 
 

Poster

The poster was the final component of the project. Using the visual language of my website and my icon, I had to create an artifact that would exist in a physical space to lead people to the digital one I had created. These are drafts that led to my final.