For my loyal visitors who visit frequently you would have noticed my new header image at the top of the page. Yes thats me building pretty growth charts in the middle of nowhere again. I changed the image as I felt I not only needed a fresher look but I also wanted an image which reflected what I can do for a business who utilises my skills and experience in marketing. I have put together this little tutorial not just for designers to see how it was done but also for business owners and others as well so that they can get an insight of what it takes to make a simple concept like this work aesthetically.

First up was the brainstorming. As usual I sat in front of my whiteboard armed with a texta (marker) staring hard into the board waiting anxiously for that amazing idea to come rushing to my head………..15 seconds pass…. its taking too long lets google some keywords to find some  sort of inspiration or idea. “Marketing” and ”business growth” were the first words I searched for in google images. Not surprisingly charts and graphs dominated the results. So after some more brainstorming and running some ideas past some people around me I came up with the concept that I would use a chart to show how I could help a business grow. It needed to be a creative image to show my creative side and challenge my design skills.

 

Lets get started

 

First task was to design or find a graph which would be suitable for my header design. I decided to see what istock had available first to hopefully save time and Im glad I did this because there were an abundance of good graph images available. It is important when looking for these images that you have a picture in your head of what you want to achieve as well as thinking through the details. For example I wanted to create an image which used depth and perspective so I need a chart image which was designed with the front of the chart seeming closer than the back of the chart. After looking through many images I noticed that most were designed with the camera angle very high. This caused a problem because the picture in my head was to have my photo and the background image taken from a low camera angle, reason being that the image of myself I knew would be quite small so wanted every opportunity to get at least some detail of myself and what I look like in there. So after about an hour of searching I finally find an image with a low camera angle that Im happy with.

Finding a background image was easy. I had an image on file that was from a while ago that I had taken just outside of Newcastle NSW Australia (I have done some editing to this earlier to make mountains bigger, another story)

 

 

Me, Myself and I

 

After spending half an hour doing my long wavy hair Im now ready for the dreaded photo shoot. Using my little Canon 400D Digital SLR camera I step out into the daylight for the first time that week searching for the best place to shoot myself (take a photo of myself, Im not that depressed). This is where a good artist or designer will triumph over an inexperienced one. Its all in the lighting. Note the light source from the graph image and background image both come from the left. Light source? you ask. Im talking about the sun. In my header image I am using three images combined so for the image to seem realistic the most important factor is that all three images have the light source (sun) coming from the same direction just as it would in real life.

 

The idea was to have Jason Coe building this chart proving that the results would be much higher if a business utilised Jasons skills and experience. Finding the correct angle to stand and the right camera height was going to be tricky enough without having to make sure that the correct side of my body was facing the light source. Taking advantage of my lovely assistant (and wife)  Kristi I had her model for a few photos so I could find the best position and adjust the exposure and shutter speed on the camera. I then took up my stance, breathed in deep (to deflate the tyre Im growing around my waist) tilted my head back a little (to avoid showing off more chins than a chinese phonebook) while my wife snapped away. To my surprise we got a couple of good ones first go and I could now move on to the fun part, photo manipulation.

 

Cut, Paste and Make It Real

 

 

Starting with the chart image I used the pen tool in Photoshop to draw a shape layer around the object. When I do this I have the fill transperancy set to about 10% which allows me to see through the shape layer while seeing where I have been. I had to be sure that my path was accurate, leaving no “white” edges. Once the shape layer was completed I set the transperancy back to 100%, double clicked the background layer in the layers pallette to make it a new layer and put that layer to the top. With that layer still selected press Alt+Ctrl+G to create a clipping mask. I then dragged both these layers into my landscape background image and merged them. I resized it then placed it where I wanted it. I duplicated my chart image and hid the original in the layers pallette so I have a spare just in case I made a mistake with it. I then took the eraser and selected the brush that looks a little like grass and with a tiny brush size just erased a little around the bottom of the chart randomly trying to make it as natural as possible.

I then used the extraction tool to extract myself. I used the extraction tool because it is easier to do long flowing wavy hair such as mine than it is using the pen tool. Once extracted and edges cleaned up I resized and placed it on the top layer of the background image. As you can see if I had left it in this state it would look unrealistic and unfortunately this is the point where some designers would leave an image like this. This is where the amateurs quit and the professionals push on. Dont give up now the work has just begun.

 

First up lets get rid of that right hand which is not supposed to be there. Had I had my chance again I would have planned better and put my hand in a better place to make for easy erasing but no hassles, I zoom in and erase the hand carefully. Next we need to again take a look at our light source and predict where the shadows of the chart and my body would lie on the ground. I duplicate the background image and use the burn tool set to midtones with a 40% exposure and a brush size just smaller than the size of my foot. I use the burn tool to literally burn in a shadow to the top landscape layer. This is a case of trial and error so I use singular strokes starting short and get longer as I extend the shadow outwards this gives the effect of a darker shadow closer to the subject and a lighter shadow further away from the subject just as a shadow would be in real life.

 

I then select myself and use the burn tool again to burn in a shadow on my clothing predicting where the shadow from the chart would fall in this case all the way up my right leg and diagonally across my abdomen. Dont forget the shadow on the back of the shoes (very important) I then need to emphasise the light source on my body and particularly my face so I take the dodge tool and set the exposure to about 25% and select the highlights range. I then paint on some highlights to the front of my face, forearm and use it to highlight the clothing on the left leg as well as the front of the fingers to give them more of an angle.

 

Now Im… I mean its looking good!

 

I had been tempted with leaving it at this stage as I was happy with it but not ecstatic with. How many artists have you seen step back and say “It just needs something else!”. It needed more emotion, it needed to look more experienced. I think the colours were a little bright and although very pretty they werent creating enough drama in the story. I saved a layered version then flattened the whole image, duplicated the layer and played a little with the adjustments finally settling for the sepia look that it has. I  made a clipping mask in the top layer to show through to the brighter blue to emphasise the productive part of the chart and to add that bold colour. Step back take another look, walk away and leave it for a day and come back with a fresh mind to judge your own work. Will it pass??