See who’ll be rocking The Dome at this year’s Relay for Life

9 Dec

Design Strategy:

My poster project focused on a music act performing during Relay for Life. Since Relay for Life does have specific pages for local events ( but that is lacking information on event entertainment, I wanted to continue to highlight that with a site exclusively focusing on it.

As evident in my blog post on web design, I like designs that can utilize space but remain interesting with images as a backdrop. I decided that, to keep consistent marketing with the poster, black and white images of music related items could satisfy that desire well. I took at least seven different varieties and settled on which five worked best with the content/layout I eventually pieced together.

For layout, I started with a 960 by 600 page to maximize compatibility with standard browser sizes. That size lends itself extremely well to grids and the 12-grid system fit my desire for open space best (my logic: when leaving a column open in a 12-grid system, it creates more space than an open column in 16-grid and so on).  With the background images, I knew I’d also be utilizing visible text boxes. This allows for content to standout from the background but also significantly increases the legibility of text (as does the ability to color the text black, which was only possible on a light colored text box). To maintain the background aesthetic though, I used a 90% opacity on all text boxes to let some of the imagery through.

Finally, when choosing pages, I focused on finding a balance between the entertainment (two pages focused on previous and current entertainment, containing images, mp3s and links) and the functional (contacts, getting involved, about the charity’s site and donation options).

Style Sheet:

My concern with fonts was finding web-safe ones.  I limited myself to three (one is used only for the tagline) and primarily used sans-serifs to maintain a hip feel in line with the content.

Main Nav. Bar – Geneva, size 14 when inactive.  Geneva, all caps, size 18 in white when active.  “Privacy Policy” is also consistent nav. and it’s in Geneva, size 12.

Body Text: Exceptions listed below, otherwise Helvetica 18pt is used for headlines and 14pt is used for body text.

“Apply” page: The clarifications (file types, under additional info) are 12pt Helvetica.

“This Year” page: When an act is selected, their name is 20pt Helvetica bold.

“Past” page:  The active year is 48pt Helvetica, inactive years are 24pt. The .mp3 text is 10pt Helvetica

Homepage: The chair name is 20pt Helvetica, news is 18pt bolded Helvetica, tagline is 48pt Legault

“About” page:  The date is 150pt Helvetica bold, leaded at 130.


One Response to “See who’ll be rocking The Dome at this year’s Relay for Life”

  1. A Graphic World II December 9, 2010 at 10:07 pm #

    I wanted to do a picture as my background at first but I wasn’t sure how to do that and make the all five pages look cohesive. I really like that it is all in grayscale because it allows for the color and important information to stand out.

    The choice to keep it in shades of purple was also a nice touch and makes the overall design look more professional as well.

    -Krista Johnson

Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: