Youtube Facebook Twitter Deviantart My feed Feed directly to your inbox

Illustrative header design for Free Power Boards

29 May 2007

Case Studios

Illustrative header design for Free Power Boards
Choose your language / Elige tu idioma:englishespañol

We are going to inaugurate a section that i think it might be interesting, it’s about real cases of orders we did in our beloved SOSFactory.

In this case we are going to see the design we did for the header of Free Power Boards, a content management system for forums based in PHPbb which is about to launch it’s third version. They ordered us to created their new header design.

Original header design

Click in the image to see the original design.

The first thing you can see, is that it’s a funny design, but with poor graphic quality. The penguin designs are clipart, which means it’s not an exclusive design, the logo is pretty basic and the colors aren’t ugly, but they could be better.

The first thing the client asked us to do, was the design of a mascot and the typical button encouraging us to register in their website, we’ll see that when you work, a good client can turn into a really excellent one :) . At first, the work was estimated in 300US$.

After a while chatting, we got to the conclusion that the mascot would be a llama. At first, i had some doubts about the choice of the animal… but the client orders, you know. When the first sketch was in my hands, it was clear that the animal had a lot of potential, take a look:

Skecht 1

This design was funny but something was missing, we thought… “Since Free Power Boards V3 is a lot about customization, we really want to show just how customizable it is. Having the mascots actually *building* the layout would be great”. Said and done:

Skecht_1

This started to look funny. Our character would be painting the header with new colors, more vibrant. We just had to do two corrections:

  1. You can see that the character right now is a normal llama. We decided to give him a corporative uniform.
  2. Another little detail; look at the painting cans, anybody would say that our workers (company image) are a little bit negligent… we aren’t transmiting the addecuate message.

Skecht_1

Our characters would look like this after the corrections.

We did two designs of the same character to give our client more options, but they liked it so much that they bought both designs, we simply changed the face of the second one to make it a bit different. The job raised to 500US$, in exchange we did a new version of their logo.

Final lineart

Here you can see the final lines for both mascots.

Let’s see the color now. In the first place, we asked for a final version of the new design, to make sure the colors of our mascots would look good in the new background:

Header design 2

Click in the image to see the new design.

We were doing some color tests and it turned out that the colors that better adapted to orange were fresh tones, here you can see the full color mascots:

mascot design full color

In this point of the order we thought it would be much better to add another llama to hold the “Join Free” button, we offered to do it for free. From the design we already had, we did some minor modifications of the face and color, and it looked like this:

mascot design full color

Sometimes, when the design has so many possibilities, i prefer to do some extra little work so the design doesn’t seem incomplete, as a reward we will have a new super design in our portfolio, and who knows what else… Ok, let’s see the header, the logo consisted in a metallic effect with a modern font, technological and blunt but fun:

Header design 2

The client was very happy with the design but he thought the text in the right side should dissapear. We gave him several options and he ended up ordering a new character. This time it would be something more comical, we thought in adding a new llama in counterpoint from the rest, bigger, clumsy and very funny. It’s mission will consist in cleaning the “V3″ of our logo… here you have the final version of the character:

Header design 2

And that is how we created this wonderfull header, at the end the design was 700US$. The client ended up winning because he got a good disscount, and we too because we enjoyed a lot this work, and we did various sales without having to change customers and on top of that, we have a great addition for our portfolio.

Header design 2

As you can see, when you work well, a good client can turn into an excellent one :)

We are actually working in some banners, he hope this new relationship will last a long while.

You could check out Free Power Boards website to see the live design. Thanks a lot to Chris, CEO of Free Power Boards for giving me permission to write this article.

This post was written by:

Sergio Ordonez - who has written 86 posts on SOSFactory Blog.

My name’s Sergio Ordoñez I´m illustrator, graphic and web designer. A selection of my work is included at SOSFactory. If you want to support this blog, please be an active member: tweet the posts, participate in the discussions and the exercises :)

Contact the author

12 Comments For This Post

  1. Lucian Says:

    Please can you make a tutorial on how to make the green and orange gradient text(with the colour code that you used on Free Power Boards)
    Thanks.

  2. Sergio Ordonez Says:

    Sorry, I usually reply all the comments but I never saw this comment.

    Anyway, I dont understand… what green gradient?

  3. liam Says:

    No idea what he is talking about with the green orange gradient. Not sure what he is looking at.

    Great work though, I love the bit at the top where it hasn’t been painted, its just a great addition. Nice work!

  4. liam Says:

    Ah, I think he is referring to the green text on the old design.

  5. F. C. Says:

    I don’t mean to rain in your parade, but I think you guys are not charging nearly enough to compensate for you time, much less your indisputably huge talent. A mascot like that shouldn’t be licensed for less than $4,000.

  6. Sergio Ordonez Says:

    FC: please, be my agent and we share the profit.

    Why I charge so cheap?

    Please read this article: http://www.sosnewbie.com/en/freelancing/why-your-design-so-cheap/

    Cheers.

  7. madewira Says:

    Once again, Sergio and the team did a fantastic job.
    I love your artworks!

  8. Maluson Says:

    GREAT!

    You guyz are really dope!

  9. darvenginzks Says:

    I’ve recently joined and wanted to introduce myself :)

  10. MirmLearm Says:

    Hi, everybody!

    I think, that this is a great forum. Very intresting and useful.
    But I can’t find the search function, cause I want faster find the topics that could be intresting for me to express my opinion…
    Please help me with search function on this forum!

  11. Sergio Ordonez Says:

    Its in the navbar, just below the logo: home, about, SEARCH…

  12. AMistyCrissy Says:

    Hi there! I’m Crystal. I am almost 17. :)
    I guess http://www.sosnewbie.com – wonderful name for this site! ;)
    It is so cool here, especially in this category.
    I was surfed about 3 hours before found this forum. I think i’ll be here for a long time! :-*

1 Trackbacks For This Post

  1. SOSNewbie Bienvenido a la web del diseñador Freelance » PSDTUTS entrevista a Sergio Ordóñez Says:

    [...] Si estais interesados en los detalles podeis visitar el estudio de caso de Freepowerboards. [...]