Logo and Website Project

Our final assignments for our Authoring Principles and Design Practice classes were linked together. So we had to design a logo and then bring that through to a website design for Design Practice. The website was then built for the Authoring Principles submission.

We were given a choice of three fictional companies to design the logo for; a photographer, an ethical clothing company and a music label. I chose the ethical clothing company which is called Free Circle. I really don't like the name 'Free Circle' (sorry DIT) but I liked the idea of the company.

Here is a brief description of 'Free Circle' from the brief:

"Free Circle is a fair trade clothing label that supplies clothing ranges for men and women. They

believe strongly in their goal for fair pay and work conditions within the textile and clothing

industry. They work with exclusive designers to create lines that are contemporary while also

affordable."

I began by researching other similar clothing companies. I also had a look at clothing branding and websites in general, before finally extending my research to cover any type of logo or website design that I liked and was inspirational.

Then I began sketching rough ideas. I was keen to avoid creating a circular logo, as I thought the 'Free Circle'/Circle image was too obvious.

(You can enlarge any image by clicking on it)

Rough Sketches

Then I drew up some quick versions in Illustrator...

A few more ideas

...before deciding on the hanger idea as my favourite. I liked the hand drawn feeling and thought it suited the 'ethical' aspects of the brand. The hanger clearly illustrates that it is a clothing brand. So the next steps were to refine the graphic and decide on a colour scheme. Below is the final shape, but with some colour tests.

Some colour options.

Finally I chose my favourite, this is the final Free Circle logo:

Final Logo Design

The next step was to create a (very brief) set of brand guidelines. This just gives some general colour palette rules, rules of placement, typography etc.

DIN is my current favourite typeface. Prepare to see a lot of it in upcoming posts :). Lucida Sans Unicode  is for web use,  so this will appear in all the online artwork.

Then, I had to create a few additional elements - a favicon, an iPhone app icon and a Facebook logo, below:

Additional Elements

And also a tote bag:

A simple tote bag mockup

Finally, I created my website layouts (the photographs are from the current collection of the clothing label 'Cos'):

Grid System

Homepage

Collection

Stores

Contact Form

The website then had to be built according to various requirements as set out in Charlie's Authoring Principles brief. I built it using HTML and CSS. It had to include a certain amount of Javascript functionalities, a HTML form and form verification.

Of all the assignments, building the website was the one I was most daunted by. But it all went fine in the end and it was a good way to learn a lot very quickly! I was pretty happy with how it turned out, it looks pretty much as per my layouts above, apart from the gallery, which I couldn't get to function properly, very annoying!

So, on to my next website then.... !