donderdag 31 maart 2011

Poster I

Allright, poster design!!!

I am making a poster for a local church community. At queensday, a Dutch holliday they are going to organise something, and I was asked to make a poster.

Here you see the initial draft, I will show you final results later.

Enjoy, and imma gonna work on this badboy some more!

As usual, please leave you comments, critique and other stuff you think I need to know in the comments!

donderdag 17 maart 2011


Now that all the serious tutorial stuff is out of the way, lets talk music!!

I have been influenced a great deal by 1 guy. I have never met him, seen him or heard him speak. Yet he influenced the type of music that I listen to on a daily basis greatly.

This man is called Criznittle.

He started making Indie Rock Playists way back in 2007 and I found him in 2008 when doing a bored tpb search for indie rock.

And now after a short hiatus he is back!! Go chek him out, he is awesome. The music is awesome and the covers are awesome also.

I can especially warmly recommend the 2008 may playlist!! A lot of good songs on there.

dinsdag 15 maart 2011

Making of the Background, Part IV

Alright, lets wrap it up!!

PART   I - In the beginning.
PART  II - Masks!
PART III - Stripe on strip action.
PART IV - Putting it to work.

We now have a background, lets put it in action.

Lets put it in the blogspot template!

Assuming you have a blog, here's what to do.

In your blogspot dashboard, go to Design > Template Designer 

This will open a new window with the template designer!!

In the Template Designer go to Background > click in the background image > Upload Image, and upload the background. Make sure you set the alignment to  the top (does not matter which one) and to only scroll horizontally.

The result, is visible right now, I uploaded the background I made in the tutorial just for you guys! Aint I sweet.

You can use it elsewhere too, just make sure to only repeat in x though.

That was all, hope you onjoyed this mini-series!

woensdag 9 maart 2011

Making of the Background, Part III

Part 3!!

PART   I - In the beginning.
PART  II - Masks!
PART III - Stripe on strip action.
PART IV - Putting it to work.

I'm going to be honest here, you did not really need the mask in part 2. But I did it anyway, it was good practice for whats to come!!

We have a nice fade to black, but lets add some spiffy web 2.0 stripey things on top of the stripes!!!

Make a new canvas by going File > New (Ctrl+N). Make it 8 by 8 pixels.

We made a new small canvas. Why, you ask? We are going to deffine a pattern so we can fill an entire space with just once click instead of having to draw a whole crapload if lines!

You can zoom in with the Zoon Tool (Z) or you can use the scroll wheel when holding Alt.

Press and hold the Brush Tool (Ctrl+B) and select the Pencil tool. Now draw a diagonal line over the canvas. When happy, go to Edit > Define Pattern, give it a name and hit OK.
We have now made a pattern that will show diagonal lines when repeated. You can add a shadow or other fancy stuff, but be sure to remember that you need to draw the line in the blank corners too when making a line more than 1 pixel thick!

Go to your background file. Layer > New > Layer (Shift+Ctrl+N) and use the Paintbucket Tool (G) to fill the layer with the pattern you just made. Also set the overloay mode to Multiply.
If you cant find the Paintbucket Tool, click and hold the Gradient Tool to see it.

Now, repeat the layer process you did in Part 2. Click the Add Layer Mask button, fill it with either black or white using the Foreground and Background Fill Tools and make it fade to transparent with the Gradient Tool.
It's done!! You can spice it up if you want, but I'm going to leave it here. I wanted something simple yet different and not too hard on the eyes.

Lets save it propery!! We only need one slice of this image.

Go to  Image > Canvas Size. Make the image 8 pixels wide, the same width as our pattern. Now save it as an PNG in order to prevent JPEG compression artifacts that would fudge up the effect.

 You are basicly done now. However, join me in the fourth and last part of this tutorial where we will look at some places to use this image!!

Take care. 

maandag 7 maart 2011

Making of the Background, Part II

 Allright, lets get this going!

PART   I - In the beginning.
PART  II - Masks!
PART III - Stripe on strip action.
PART IV - Putting it to work.

We now have a nice stripy colorful background. We want to make it fade into black, and make it a little less jarring to the eyes, as to improve readability and usability, for as far that is applicable in such a random design ;)

In short, what we are going to do is fill a new layer, add a mask with a gradient and then spice it up with some  web 2.0-style diagonal lines.

Lets get crackin!!

First, make a new layer. You can do this by going Layer -> New -> Layer, using the hotkey (Shift+Ctrl+n) or by using the icon on the lower right of your screen.

Now, if you have modified your Foreground and Background colors, reset them to black and white by by using the Default Foreground/Background Colors shortcut (D). After you do that use the Fill Foreground Color shortcut (Alt+Backspace) to fill the entire layer with the foreground color.

Your entire canvas is now black!!! No worries, that what we want. Now lets do something with it!

Under your Layers panel, there is a little icon, looks like this:

 This is the New Layer Mask button. Click it now, with the black filled layer still selected.

Nothing apparent will have changed, except there is a weird rectangle next to the layer thumbnail in the Layers panel.

That is your mask. As the name implies this will mask parts of your layer. Where that picture will be black, it will make the layer 100% transparent, where it is white the layer will be opaque.

Now Foreground Fill the mask layer (Ctrl+Backspace) and there are your stripes again! Select the Gradient Tool (G) and drag it from the bottom of the image to the top. 

Make sure you have set it from the Foreground Color to Transparent, instead of Foreground to Background. You can change that in the top left, as seen in the screenshot.

Blammo!! We have a gradient!! If you are not happy with it, feel free to add to it. You can drag the gradient bigger that the picture, smaller, make it transparent, etc. If you hit Switch Foreground/Background Colors (X) and you drag from top to bottom, you can remove some black where wanted.

That was is for now, please join me later for the last 2 parts!!!