Get in Touch (Coming Soon)

Rensselyrics

Design, Development, Content Strategy

About the Rensselyrics

The Rensselyrics are the original co-ed a cappella group at Rensselaer Polytechnic Institute in Troy, New York. They approached me about a redesign because as the group evolved their old site no longer fit them. Their needs were pretty simple. Primarily, they needed to share their concert appearance times and locations easily as well as show off some of their songs. They also wanted short group and personal biographies, group photos, news from their Facebook feed, and information for students who might want to audition.

Member Bios

To tease a little bit about each member, I created profile "cards" to hold a photo, their group info, and their short bio.

Arriving at the Aesthetic

One of the members had created a logo, and this together with their shade of purple comprised the entirety of their existing brand image. This gave me a lot of leeway to be creative. I chose to be playful with the design, using bold shapes and colors as well as two spirited fonts. Jovial music notes and a clef liven up the background of each page.

As their target audience is mostly college students, an important piece of the process was designing the website to be responsive so that visitors could access their information from their mobile devices.

Albums and Concerts

Large YouTube embeds and iTunes-esque song listings by album highlight the talent that the group has to offer.

Organizing the Content

With their relatively short list of requirements, content organization was pretty straightforward. The homepage was a great place to advertise their concert times and show recent news stories from Facebook. Their other three requirements lended themselves nicely to one short page each.

What I learned

One of my favorite parts of this design is the landing screen, which resizes to be 95% of window height, and the elements inside are centered both horizontally and vertically. This was achieved with some CSS trickery, and a lot of work had to go into media queries to make it properly responsive.

This project was also the first time I made a site with YouTube and Facebook embedded objects, and I had to learn how to make them work with a responsive design.


Like what you see?

I'm available both for hire and contract work.

TwitterGoogle PlusLinkedInForrstDribbble

© 2013 Teagan Atwater. All rights reserved.