Okay..before I start...if you hear a loud snuffling and snorting..it's me. I sound like a pig searching for truffles, sniff, snort, sniff. I have a cold and sore throat, plus it doesn't help that my nose is glowing a very luminous red!! Too many tissues!! So imagine a pig with a clowns nose and you've got me in one!!

I nearly forgot to mention the cough..a sort of raw hacking noise.....that will not be suppressed..as my DH has found out. Other details I won't describe, I don't want to put you off completely!!

 

Anyway, on to business. Paint!!!!

I thought I'd share a little a tip about using overlays in a short tutorial. Not only can you stack overlays to make your background papers, you can also add extra layers and stick a little paint on them. If you play with the blending modes, then you can have some real fun. I use Photoshop CS2 but you can apply the principle in most software packages.

In the tutorial I will keep things simple but you'll get the basic idea and then it's up to you to experiment!! I haven't tried to be subtle with the blending modes, I've just tried to make it simple...the finer points are up to you!!

The overlay that I used  is included in the download with a PDF of the tutorial. You can use the overlay for Commercial or Personal use. If you already use this technic...I apologise....ignore me!! Lol!

Right let's get going.

1. Open up a new file 12x12, 300dpi, transparent and fill it with the colour of your choice.

I used a brown colour for my base layer bc7d5c, but feel free to use any you want. (I renamed this layer colour)

2. Now open the overlay file that came with the tutorial, jsch_pattern_example.png

3. With the overlay file as the active one, hold down the Shift Key and drag it into your new file with the colour.

(Holding down the Shift key will make sure that the overlay is central when it has been moved.)

4. When you've done this, change the blending mode of the overlay layer to: Overlay, 78%.

5. Now for the start of the fun part. Make new layer above the overlay.

(You can do this by Layer>New or by clicking the small icon, second from the right at the bottom of the Layers palette).

Rename the new layer to Paint 1

6. With the Paint 1 as the active one, select the paint brush you want to use. I choose a soft round brush, size 800. This size just covers the flower like centre of the pattern on the overlay.

The quick way to get the brush ready is select the brush icon in the left tool bar. Then change the size in the top tool bar by click the down arrow next to the brush shape.

 

Choose a soft brush from the drop down list and then at the top change the px size to 800.

This is what your top tool bar should look like when you've done.

7. We need to pick the colour we want the brush to paint with. I choose a bright turquoise blue, 5accd6. Again it's a matter of choice.

Make sure that the new layer is still your active on and then we can start to paint.

Hold the brush over the middle of the flower like shape and click once.

Continue doing this until you have all the shapes you want covered. (You can use different colours over each shape, but for now I'm just using this one to keep it simple.)

 

When you have finished painting the shapes and your happy with it, turn of the Paint 1 layer by clicking the little eye on the left of the layer. We can turn it on later when we've done the next stage.

8. Make an other new layer above Paint 1, exactly as we did before and rename it Paint 2.

We'll use the same soft round brush but we need to change the size of the brush so that it just covers the centre of the flower shape.

To change the size make sure you still have the paintbrush icon selected and then in the top tool bar click the down arrow next to the brush shape and change the brush size to 150px. (You can also change the brush size by pressing the ] key to make it larger or the [ key to make it smaller.)

We also need to change the colour. I have used a green, 3ed895.

We're ready to paint . So line up your brush and click once on centre of the first flower shape.

Continue doing this until you have covered all the centres of the shapes. Again you can change colour for each one if you want. If stuck to this one colour.

9. When you have complete all click on the Paint 1 layer to make it active again. Change the blending mode to Overlay, 90%.

10. Click on the Paint 2 layer and change the blending layer to Colour Burn, 64%.

(Okay, this is not very subtle but the subtle bit is for you to do later!Lol.)

This is what you should have.

I have kept the tutorial to the basics, but you can add texture to the painted layers via the Layers Style Palette, change the blending modes, use different shaped brushes...the list is endless!! Just play and experiment!! But most of all have fun.

You can download the tutorial in PDF format with the overlay here

Have a great weekend!!

I thought it was about time that I did an other tutorial as it's been a while since the last one. Layouts can look really good with the text wrapping partly around your photograph or an object and it’s actually not so hard to do. This tutorial will walk you through it hopefully in an easy to understand way.

My text in the tutorial was done really quickly ...and yes...it could have done with a tidy up!! But the principle on how to do it is here and I know you will all be a lot more tidy than I was, lol!!

So let's get started.I'm going to show you on a basic background with a photo. It makes it simpler for you to see what I'm doing.

 

1. Open the background and photo you want to use on your layout. Position the photo where you want it and then we are ready to start the tutorial.

2. Select the Rectangle Tool from your side tool bar.

 

Make sure that you have the Paths icon selected in the top tool bar and the Add to Path icon too.

3. With the photo layer as the active layer drag out a rectangle to include all or  part of the photo plus the area that you want the text to appear in. Have a look at mine below to understand what I mean. The rectangle I have drawn covers part of the photo and part of the background.

4. With the rectangle tool still selected we need to make a change in the top tool bar. Click the Subtract from Path icon, this means that we can now take the photo part out of the selection we just made.

Now drag out a rectangle to cover the area of the photo that is inside the rectangle. I always include a little of the background too as I like a small border around the photo with no text.

5. Select the Type Tool from the side tool bar.

Pick the font, size and colour you want to use for your journaling  then click in the top left of the rectangle, where you want the text to start. Type in your text and it will fit around your photo.

When you’ve finished and have the text how you want it, press the Move Tool to get rid of the Type Tool and then press CTRL+H. This will hide the path and you will see the finished result.

Have fun!!

If you want to download the tutorial as a PDF File you can find it here.

 

As promised I have knocked together a tutorial for the Split Bent Frame....it's quite long......so I have added a link for you to download it as a PDF file to use if you prefer.   I just hope you can understand it!! Lol! You'll find the link at the bottom of the post.

First....an update on the my mum. Unfortunately she developed a chest infection in the middle of the week and needed antibiotics and some steroids..but the good news is..she is starting to feel better today!!! Hurray!!!

The latest on the decorating is that I've finished the ceiling, gloss and put up a lining paper on our awful walls, so that I can paint them. Now, I just need to paint the paper and then I can get some new carpet down!!!!! All this in one week and with DH laid up with a bad back. I am really pleased that what looked like a disaster week has turned out so much more productive than I thought. It just goes to show, you never know what you can achieve...mind you it does help if you don't sleep, lol!!

Now for the tutorial!!

I use Photoshop CS2  but I am sure you can adapt it for your own software. It is quite a long tutorial and I hope that I explain it clearly, forgive me if I don’t!!

You can use it for personal or commercial use..just don't claim it as your own!!

So let’s get started!

1. Open the photograph that you want to use. Check the image size and do any cropping you want to make before we start. (I had mine at 300dpi, 9 inches x 5 inches. You can always scale it down after it’s framed, but it‘s easier to work on at this size).

2. Now open a new file 3600 x 3600, 300dpi, RGB color, Transparent and move your photograph into the new file.

3. To split the photo we need to make a template. We’re going to split the photo into 3 pieces, you could make this 2 or 4...it’s up to you, but for now we will do three bits.

Select the Rectangle Tool and make sure your colours are the default black and white. (If they’re not then press D to reset them.)

Before you draw out the rectangle, check in the top tool bar that you have selected the first icon in the group of three, the shape layer icon.

4. Check the width of your photograph, we need to draw out a rectangle over one third of the photograph. As my photo is 9 inches wide mine needs to be 3 inches wide and the height of the photo.

So starting at the left end of the photo drag out a black rectangle over a third of it. This is what it mine looks like.

And this is what your layers palette should like, showing your photo layer and a shape layer.

5. We have the first part of the template now we need to duplicate this layer twice to give us the three pieces of our template.

There are several ways you can do this, my favourite way is to make sure that the shape layer is the active layer and then right click on the layer and pick Duplicate layer from the fly out menu. 

At this point I always rename the layers for easy recognition.
So I would start at the bottom of the black shape layers that will form our template and rename  them as left, middle and right . That way I can find them quickly.

6. Now we need to position the rectangles over the photo. At the moment they are in a stack and we need them to cover the whole photo before we can use them to cut it up.

Select the right rectangle (Shape 1 copy)  and holding down the shift key move it over to the right into the middle of the photo. (Holding down the shift key whilst you drag will make sure that the layer stays inline with the other layers as you drag it).

Now select the middle rectangle (Shape 1 copy 2) and drag it to the right end of the photo. You should now have covered the whole photo with these three layer and it will no longer be visible.

7. With the left rectangle layer active right click, and pick Rasterize from the drop down menu.
(You’ll notice that this changes how the layer looks in the layer palette and you now only have one black rectangle showing.)

Repeat this for the other two rectangle layers.

8. Click on the left rectangle layer to make it active, and then hold down the CRTL key and click the layer icon this will give you marching ants around the shape.

With the marching ants still active click on the original photo layer to make that layer active.
Now press CTRL +J.
This will promote the left part of the photo only onto a new layer of it’s own without altering the original photo.
Repeat this for the other two rectangles (middle and right) so that you have three new layers each with a part of your photo.

You should now have 7 layers: 3 rectangle template layers, 3 photo layers and the original photo layer. 

Click the eye on the original photo layer to make it invisible.

This is how your layers palette should look. (Note I have renamed my layers for easy recognition)

You don’t need the black rectangles for the moment, so click the eye icon on each of their layers to make them invisible.

9. You now have your photo cut into three bits. Move the three pieces slightly apart as I have done so that you have a small gap between each piece. We need a little space for the white border we will add later.

10. Now we need to add a drop shadow to each of the photo pieces.

Double click on the left photo layer to open up the layers style palette.

Select Drop Shadow at the top of the list on the left hand side.

Above are the settings I used:
Multiply, black, opacity 75%, distance 27, spread 0, size 38.

Then click OK.

Use these settings and apply the drop shadow to the other two photo piece layers.

11. Now for the fun part!! To be able to distort and warp the photo corners and keep the shadows realistic we need to separate the shadow from the photo piece.

To do this click the left photo piece layer to make it active.

Now right click on the little down arrow head, on the far right of the layer.

This will give you a drop down menu, choose Create Layer.

You will get a message saying that some effects cannot be reproduced…just click OK.

This splits any layers styles that you have used for a layer and puts each one on it’s own individual layer.

The drop shadow will now be on it’s own layer so we can play and distort the photo piece and the shadow will stay unchanged.

You now have an extra layer with the drop shadow for the photo piece. You need to do this for the other two photo piece layers to separate their drop shadows too.
So repeat section 11 for each of the photo layers.

12. The next thing we need to do is warp the photo corners to make them look curled.

Click on the left photo layer and from the top tool bar select Edit>Transform>Warp.

This will give you a grid around the left photo piece. Drag the bottom left corner up and to the left slightly to make the corner appear curled.

Next move to the top left corner and drag it up and to the right slightly to curl it too. Have a play with this, you can bend them anyway you want, you don’t have to do exactly as I do..it’s your choice.

When you have finished click the tick in the top tool bar to accept.

Repeat this with the other two photo pieces to curl and warp one or more of their corners.

13. Finally we need to add a white border to the photo pieces to finish them. It’s easier to merge the photo pieces and do this in one for all the photo pieces.

Hold down the CTRL key and click on each of the three photo layers to make them all active. Then press CTRL + E to merge them to form one layer.

Click on the icon in the merged layer and you will get the marching ants around the photo pieces.

14. Make a new layer just above the merged photo pieces layer and click on the new layer to make this the active layer.

Now in the top tool bar select Edit> Stroke and use the settings below, then click OK..

This will give you a new layer above the photo pieces with a white border. This is your photo edge.

You can now merge the three drop shadow layers, photo layers and white border and transfer to your layout.

Or you can save the template, shadows and white border as a psd file to use again!!!

TIP

The beauty of keeping the drop shadows separate is you can still change them to blend with any back ground you add by changing the Opacity of their layers.

So if you find the shadow too harsh for a light background then just lower the opacity or change the blend mode of this layer.

But don’t take my word for it…have a play!!

If you want to download the tutorial in PDF you'll find it here

 

Snagable...is that a new word? Anyway....you know what I mean!!

A while ago I did a tut on making your own blinkie......but I didn't do the follow up on how to add your blinkie to your blog so that people can snag it with a clickable link back to your blog or website. I've  been slow in doing this and have now updated my own blinkie to include the instructions on how to snag it (see my sidebar). I kept meaning to do it...but, you know what it's like.

So after much  tying myself in knots I've come up with this tutorial, which I hope is not too complicated!! (I'll do an other post that will listed instructions on adding other peoples blinkies to your blog after you've snagged them.)

I use Blogger, so the instructions are based on Blogger and how to add your blinkie and link using the Blogger Dashboard.

1. To do this properly there are two things you need to do before we start:

First, you need to upload your blinkie image to your photo hosting....which ever one you use, I use Photobucket. Copy the URL of the link to your image as you'll need it later.

Secondly, you need to write a blog post telling people how to snag your blinkie. I have backdated mine so that it's not on the front page of my blog. You can backdate a post by going to POST OPTIONS at the bottom left of the screen you use to write your post on Blogger. Click Post Options and choose any date you want to post your instructions. It's easy to change for those of you who use Windows Live Writer too.I choose a date last October for mine.

You need to write something like this in your post:

If you'd like to snag my blinkie and add it to you blog, with a clickable link back to Name of Your Blog, here's how you do it!

1. Go to your Blogger Dashboard and Select LAYOUT.

2. Now choose PAGE ELEMENTS and then select ADD A GADGET.

3. From the choices pick HTML/JavaScript, then in the content box paste in the  following code: (You would add the following in your post to give the link)

<a href="your blog url" target="_blank"><img border="0" alt="your blog name" src="your image url or direct link" ></a>"

Then save your post to the date you want, it doesn't matter what date really. After it's posted to your blog get a copy of the page URL as you'll need it later too.

2. Next go to you Blogger Dashboard and click the tag that says Layout and select Page Elements. This will take you to the Add and Arrange Page Elements screen.

 

 

 

2. Click Add a Gadget

 

 

 

 

3. This will give you a pop up window that allows you to make a choice in what you want to add to the side bar. Scroll down until you see add Picture and click.

 

 

 

 

 

4. This gives you a new window Configure Image.

 

 

 

 

5. Where it says LINK, put in the link to the post on your blog on how to snag your blinkie.

Where it says IMAGE, click on the circle next to "From the web" and paste in the URL for your Blinkie Image from the web. (The one we copied at the beginning from Photobucket or similar hosting.)

If you want to give it a title such as "Click to Snag" then type it into the TITLE box, it's a matter of choice on this one.

Click Save in the bottom right corner and your done!! The blinkie will be at the top of your sidebar so you may want to move it down...it's up to you but it's saved to your blog!!

If you want to download the tutorial as a PDF you'll find it here

Now people can click on your blinkie, go to your post and learn how to snag it with the code included. I just hope that I haven't made this as clear as mud, lol!! Any questions just email me and I'll get back to you. If you manage to do it using the tut...let me know so I can drop by and take a look. Good luck!!!

Watch out for the tut on how to add other peoples blinkies to your blog after you've snagged them!!!

Have a wonderful weekend and take care.

Last week Mira of Scrappy Mom asked me how you made blinkies so I have done this tutorial to explain how I make mine. We all love blinkies and making them is not so hard as you think. For ages I thought they must be so hard to do.....but they're not. If you can do a layout then you can make one of these!!!

Later next week I'll do tut on how to put your blinkies in Blogger with a link.

Basically you are working with layers as you do on a payout but on a smaller scale. How many layers you work with depends on how you want your blinkie to look. I'm sure that my way is not the only way but it works for me.

Basically you need your normal graphics package to make the layout of the layers that make up the blinkie and also an animation software package to bring it to life. If you don't have animation software in your package there are some great free ones out there that you could use. Or try a trial from people like Ulead Gif Animator they offer a 15 free trial...plenty of time to practice your blinkie skills, lol!! (No, this is not an advert!!!)...or Google "Free Animation Software" and see what it comes up with.

I have written the tutorial using CS2 but you can use the same principles in the software you use.

There is a a download link at the end in case you prefer printing the tut instead of reading it from here. So lets get started.

1. Blinkies can be any size, but they do need to be small and the resolution should be 71 dpi for the Internet.

I want a finished blinkie that will be 150 pixels x 50 pixels, 72 dpi.

This is a very small size to work on screen with so I am going to start with it a bit bigger and reduce it down to 150 pixels x 50 pixels at the end.

 

2. So that we can see what were doing lets make it "Fit on Screen".

Now we are ready to play!!

I'm going to keep mine simple but once you get the idea you can make yours as fancy as you want with loads of layers.

3. For the first layer pick the colour you would like as the background and using the paint bucket fill the layer.

Next I opened the file with one of the trees from the freebie Springtime Blog Train Kit. (If your going to use elements that you have always, remember to reduce the dpi to 72 and make sure that the size is reduced to scale with the blinkie size.) Plus check the TOU of the designer to make sure it's OK to use.

I reduced the tree to 71dpi and then the size to 216x199 as my starting point. (Don't panic because it looks blurry at this stage.)

 

Now drag the tree/element to the blinkie file, don't forget to hold down the shift key. The tree will be in it's own new layer above the colour layer.

As you can see the tree is still too big so using Edit>Transform>Scale I have resized it down till I get it to the size I want.

Like this.

4. Every layer of the blinkie needs to have a solid background colour or paper. These are normally the same for each layer, but you can make them different if you want...it's up to you. I am using the same colour through out.

So we need to merge the solid colour and the tree to make our first blinkie layer. To do this click on the colour layer and hold down the CTR key, then click on the tree layer. this will make them both active.

Now press CTRL + E, to merge the two layers. Nnow have one layer with the tree and the colour.

5. Text layers work well in blinkies, so I added a new layer of the solid colour and then a text layer. When I had the text how I wanted it I merged the colour and the type layers.

For my next layer I did exactly the same as for the first layer but moved the position of the tree and changed the colour of it to pink.

Okay I only have three layers...rather a sorry little blinkie!! But you can add as many layers as you want to your, but by now you have the basic idea.

Here's what my Layers Palette looks like, I have named the layers so that I know what each one is. It helps when everything is so small and we do need them in the right order or the blinkie will "blink" in the wrong sequence.

6. When you have finished adding layers the image size needs reducing down before we continue.

Go to Image>Image Size

Reduce the size to 150 pixels x 50 pixels, keep at 72dpi and we're ready to animate!!

A word of warning!!! Make sure you save your blinkie at this stage as PSD file. If you decide that you want to make changes later it would be awful to have to start from scratch!!

7. Now click on the icon to edit in image Ready or Ctrl+Shft+M.

Your screen in Image Ready should look something like this.

 

 

8. Make sure the first layer of your blinkie is the active one and then click the little eye next to the other layers to hide them.

9. Move to the Animation Palette where you will see you have your first frame (layer) showing. Now we need to add the next frame. Click on the small arrow in the top right of the Animation Palette and pick New Layer.

 

Next make the second layer in your Layers Palette active by clicking on the layer and then on the little eye to reveal it again. The will add the layer as a frame in the Animation Palette and so you have two!!

 

10. Repeat this process until you have added all of your layers as frames into the Animation palette .

11. We need to set the time that each frame will show for before the next frame appears. I am going to set mine to 0.5 second. To do this move to the first frame and click the arrow in the bottom left corner and pick the delay time you want.

Do this for all the frames. Normally I set them for the same amount of delay but again that's up to you.

To see what you blinkie will look like working, press the play button and it will run through the sequence for you.

Assuming your happy with it we need to save it. It's important that the file is saved as a GIF. So make sure that you change it if it's on JPG.

Click on GIF and use the following settings to optimise it.

Save it as File>Save Optimised As and name your blinkie and click OK.

Now you have a blinkie.... but to use it you need to upload it to the place Internet where you store your images, somewhere like Photobucket.

When you have it upload you can copy the URL and past it into your signature in Forums etc.

 

 

Boy that was a LONG post!!!

I hope you could follow it and please feel free to download the PDF to use as you do make it. Any questions email me and just ask.

***If you want to know how to add a blinkie to Blogger then check back next week for a tut on how to do it.