------Tom Who?------

  • I'm sitting on the crossroads of education, technology, speaking, and entrepreneurship as the Director of Operations & Trainings for Swift Kick.
    Kevin Prentiss


-Other Blog Work-

  • Student Affairs
    Blog

    Swift Kick
    Blog

« The Difference Between Owning A Cat And Owning A Dog [IMAGE] | Main | NYC Street Art: Avenue C & 6th Street [IMAGE] »

07/16/2010

Building a Red Rover Website Badge

I'm not a very good designer compared to really good designers, but give me an idea and an image and I'll mesh it and recreate it with the best of 'em.

In talking out the Georgia Highlands Campus Directory adoption strategy with Donny and John, John asked if we had a website badge they could put on their Student Life page for people to click on to go to the Campus Directory.

Several other schools have links that guide people from the student life page to the Campus Directory, but beyond the Red Rover logo, we didn't have a website badge customizable for each school.

But the value was clear and so I set out to create a badge.

I started by exploring a few popular blogging sites for creative badges. Then Googled "Website Badges" and stumbled on this badge that I really liked:

The hover banner was the part I liked the most, but I had never created one before. While de-constructing the major pieces of the badge, I found the hover banner effect was a combination of drop shadowing and black triangles at each corner:

After some more customization for GHC, I put all the pieces together to create their final badge:

The angled logo for GHC was done with a tool called Picturesque for Mac.

Lastly, I'm a huge fan of doing design and layout work on Keynote for Mac. Not at all what it was meant for, but works wonders for me.

TrackBack

TrackBack URL for this entry:
https://www.typepad.com/services/trackback/6a00d8341d413853ef0133f255ac04970b

Listed below are links to weblogs that reference Building a Red Rover Website Badge:

Comments

blog comments powered by Disqus