Case Study

Who: City of Austin, Capital Delivery Services

Where: Austin, TX

What: A set of digital ads marking the completion of an urban trail with a motion graphic element in the sizes: 336x280, 250x250, and 160x600

​

I always start my projects with research and gathering as much information as possible. I looked at previous Capital Delivery Services ribbon cutting or grand opening ads. They were larger in size and packed with a lot of information, some of which was difficult to read. 

​

Next, I identified the latest design trends where simple, sans serif fonts, gradients, and bold colors rule. I felt that a move to this trend would be a good fit for the ads.

 

Finally, I looked up banner ad best practices. I adhered to these guidelines as follows:

 

​Use high-quality visuals​

I reviewed the photos taken on-site and chose scenic images that would best fit the sizes the project required. Additionally, I selected photos of bicycling in parkland since that is one of my family's favorite activities in Austin!

​

I played with the size of the image as backgrounds, experimenting with using a larger foreground subject vs a wide angle view. Ultimately, I preferred the wide angle to better show off the park and trail. I intensified the colors of the original photos to make them brighter and give them more life.

​

Be clear and concise

Originally, I laid details of the ads in white text on top of the images. But I felt like something was missing. Adding the gradient element not only made the text easier to read, it give it an eye-catching modern touch. As for the text, space was a premium so I used abbreviations prudently, reducing the full spelling of "November" to "Nov." and "12:00 PM" to "12 PM." This made it easier for the viewer to read and immediately capture the information. 

​

Provide a call to action

A Join Us button was added as a call to action. The button gives the viewer an idea of what to expect next (an RSVP page). The landing page would match the ad and provide additional information such as address and directions.

​

Use smooth animation

I tested different types of animation for the text. To create a sense of motion that matched the switchback of the trail, I used opposing pans for the different lines of text.