The Problem
Each summer, Team R.E.D’s annual beer mile race raises money for the Special Olympics. Just as the event’s name suggests, participants run a quarter mile then drink a beer. This fun race did not have an identity. The website for the event was a web page of HTML with little to no CSS styling. I saw this as a chance to flex my creative muscle and exercise my front-end web development skills.

 

 

My Process
I started the project by designing a logo for Team R.E.D.’s beer mile. Then, I analyzed the website content and categorized information. I discovered that content could be categorized into six groups (what is a beer mile, the rules, FAQ, register, sponsors, and volunteers). These groups became navigation links. I looked at single page website designs, in galleries such as onepagelove.com, for inspiration. I chose a red to yellow gradient for the website’s background. The color red was used to reflect the red t-shirts that Team R.E.D members wear at races. The orange to yellow colors represent the golden hue of pale ale beer.

 

 

The Result
I redesigned a website for Team R.E.D’s annual beer mile race with HTML and CSS using Bootstrap framework. I created the logo and web graphic with Adobe Illustrator.