Work in progress: Blood Crave web design

20 May 2011

Choose your language / Elige tu idioma:

Hey buddies!, I would like to point you to a new event I’m running on my wall in Facebook, I thought would be interesting to show the different steps in the creation of a web. It’s Blood Crave, a MMORPG about vampires that I’m designing right now.

I will post images in a daily basis so you can follow the progress of the whole project: illustration, logo design and web design. I invite you to join the project, you can post your feedback or just ask any question you have.

Step 1: planning the page

Before starting to draw I do a quick sketch to plain everything, so I can figure how much room to play I have.

Blood Crave login page

The page is going to be pretty simple, as you can see, just an illustration on the left and a login form in the right, the goal is increasing the conversion rate.

Step 2: sketching the illustration

Blood Crave illustration

En este paso uso prácticamente todo lo que tengo a mano para componer la ilustración, desde fotos a antiguos bocetos. Cuando estoy contento con la composición me dedico a limpiar y retocar las lineas hasta que consigo una base sobre la que trabajar.

Step 3: inking in Photoshop

I have explained the inking process a hundred of times so let’s go ahead, I just will post some images giving you some useful tips.

Blood Crave inking in progress
Line height
Tangents in composition

Final Lineart

Step 3: coloring the illustration in Photoshop

Coming Soon!!

And remember, if you want to contribute just share this post in your Facebook or Twitter!

This post was written by:

Sergio Ordonez - who has written 97 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

zedkin

es excelente como muestras cada etapa de tu trabajo….esa demostración a puertas abiertas demuestra la confianza en tu trabajo que por cierto es excelente y como comente en deviantart….muy caracteristico.
Espero ver el producto terminado.
Saludos
Aviator

Sergio, I wanted to ask you if you still work in Photoshop for everything that you do or do you also do the full design in Illustrator? The PDF file that I bought from your site was a photoshop tutorial, but are the steps the same when you design in Illustartor?
Also… don’t clients prefer the file in AI format because then they can play with vectors and are not limited my size?
Thanks in advance Sergio.
AD

http://www.sosfactory.com/blog Sergio Ordonez

When working for the web I always use Photoshop because it’s much more comfortable for me.

But I always work in high res, so the client will be able to print reasonably big. This is illustration is around 5000x7000px.

I provide vectors if needed but I usually charge a fee because it’s more time consuming, specially for illustration.

The process are slightly different due to the limitations of vectors, check this tutorial: http://www.sosfactory.com/blog/how-to/mascot-design/vectorial-illustration-with-illustrator/

Cheers!

Aviator

Thanks do much Sergio for the quick response!! You’re a treasure both as an inspirator and a guide to me. Thank you, have a good day!

Anonymous

Do you draw those on I drawing pad first, scan, then ink?

http://www.sosfactory.com/blog Sergio Ordonez

I do everything digitally since I got my Wacom Cintiq, as I mention in the post, in this step I use everything from scanned sketches on paper to photos and redraw everything until all the pieces fit together.

http://twitter.com/RobynAbbatiello Robyn Abbatiello

Great stuff thanks for sharing
http://www.facebook.com/natanmonte Nathan Monte

Sergio, who or where you learned to color your drawings? You’re too good! Congratulations!
http://www.sosfactory.com/blog Sergio Ordonez

Thanks Nathan, just practice
http://twitter.com/viperfx09 Tharshan

Your site is such an amazing resource for a beginner like me! If you have time it would really help if you could do more beginner tutorials explaining your drawing process – I know it takes practise and imagination but I was curious if you have any pro tips for sketching characters details as this on paper.
How long did the inking really take

Thanks, I look forward to the colouring stage – i foresee red and black
Manas Punks

Your works are super cool my friend.Inspires me a lot.
http://www.Smashious.com/ Smashious.com

great work! Looks awesome.