Free Graphics Resources – Tutorial

Do you want to design your own cards or stationery but don’t know where to start? Here’s a tutorial using Photoshop!

Every week starting on Mondays, 6 shops on  Creative Market offer a free digital downloads of one of their products. Each 6 products are chosen by the Creative Market staff for that week only. So I thought I’d do a series of tutorials suggesting ways to use some of the resources. And best of all, if you download them in the week I write the blog post, they are totally free!

creative market homepage

The Creative Market homepage: I’ve marked the link for the free goods with a pink arrow.

You’ll have to register with Creative Market if you don’t already have an account but this doesn’t obliged you to buy anything.  Here are the free goods on offer in any particular week .

Here are the six products on offer this week: I’ll test out four of them.

free graphics

These are the free graphics offered this week. I’ll cover 4 of them in this tutorial.

{Marie} Business Card Template  by MediaNovak

Spring is Coming/! Gentle Watercolours by Lembrik’s Artworks

90s Inspired Retro Shape Icons by JOLT

Risoless Script by Konstantine Studio

When you download them, save them somewhere you can find them again on your computer.  Then click on the zip file to unpack it – see graphic below for the Marie Business Card Template:

instructions for opening files for this tutorial

All downloaded, so here goes with the tutorial!

The Marie Business Card Template consists of 4 files for each horizontal and vertical layout – 2 jpgs showing examples of the completed business card (front and back) and 2 Photoshop files with a layered template.  I’m just going to show you ideas for editing the front.  When I opened mine I had a box pop up to say that I didn’t have the fonts  used installed on my computer.  Photoshop offers to find alternative fonts.  Click ‘resolve’ to find a suitable substitute or just click cancel – don’t worry too much about this as I’ll be showing you how to change the font later.

free business card template

Just click cancel when this pops up, I’ll show you how to change the font later

Click on the T (for text) on the tools menu (left hand side of the screen) and on the layer which says ‘MARIE GREEN’ and highlight the text you want to change by clicking and dragging your mouse over the text.  Change it to your own name.

instructions for changing text

I’ve already changed my name here

Click on the ‘move’ button on the toolbar on the left hand side.  You can see it highlighted in darker grey in the photo below.  Click on the character toolbar on the right and scroll through the different fonts.  You will see them change to each font in turn as you scroll down – pick one that you like.  Do the same to change the size, spacing etc.  Here is mine.  Repeat these steps for the rest of the text.

how to change fonts easily

Again if the ‘character’ toolbar isn’t open, click Window>character and it will appear

You can change the background colour by clicking on the layer called background color, double clicking in the colour box and picking a new colour from the color picker which pops up. Click OK to save.

showing how to change background colour

double click on the colour box in the layers panel to open the colour picker

You can turn the various leaves and effects on or off to change the background or you can bring in a completely new background.  For the purposes of this demo I’m going to show you how to change the background using some of the other free goods.

how to turn layers on and off in Photoshop

In this case I decided to add one of my turquoise watercolour ombre papers. Open the file, click ctrl a to select it all, and ctrl c to copy it to the clipboard.

my turquoise ombre background

Then click on the business card file, click on the layers panel just below the white rectangle and click ctrl v to paste it in.  It will add a new layer automatically.  The business card file is a very small one (3.75″ x 2.25″) so you will probably need to resize the background.

how to resize files in Photoshop

Click on one of the corners (where the little squares are) of that black box and drag them to resize the file, and then press the enter key to confirm it.

Click ctrl t (transform command), hover over the corner of the box that appears, and when the cursor turns into a double sided diagonal arrow, holding down the shift key to keep the same dimensions, resize it to fit.    To keep the ombre effect on this one I didn’t bother holding down the shift key and just clicked and dragged the 4 sides to fit the rectangle.  When you’re happy with the size, click enter and it will save it.

turquoise ombre watercolor background added

Resizing done!

I decided to add some of these jazzy 90s inspired retro shape icons to my ombre background so I opened the zip file as before, clicked on the png files (which have a transparent background) and clicked ctrl a and ctrl c again to copy, ctrl v to paste the shape into the business card on top of the new ombre background and the white rectangle but behind the text.  I resized and rotated them as necessary (for that you hover over the corners until the cursor turns into a double sided arrow that is bent – sorry, I tried to do a screenshot but it wouldn’t work!) and this was the result:

90s retro icons added

It gives a different feel to the image, don’t you think?

Next I installed the Risoless font: to do this, click on the downloaded file and click on either the OpenType or TrueType file, I’m not sure what the difference is between the two but they both seem to work on my computer.  Then click ‘install’ on the box that appears (see below).  You will now be able to use that font in any application that uses fonts.

the box to install a new font

 

adding Risoless font

Click on the character menu and scroll through as before – you’ll see that the Risoless font has appeared.

To give a very different feel to the business card I decided to use the fourth free product, gorgeous hand painted Spring is Coming! Gentle Watercolours.  I changed the background to this one from my Blue Shibori Paper Pack, again copying it, pasting it just below the white rectangle, and resizing it holding down the shift key to keep the proportions right.

shibori watercolour background

I added some of Lembrik’s Artworks’ flowers by using the rectangular marquee tool to isolate just part of the flowers, copying, pasting, resizing and rotating as shown above.

use the marquee tool to select just the part you want

use the marquee tool to select just the part you want

the finished design

What do you think of the results?  Grab your free files this week and show me what you make with them!

By the way, here is an FAQ about licenses for using Creative Market products.  If there was anything you don’t understand in this tutorial, do ask me in the comments and I’ll try and help.

*NB this post contains affiliate links to Creative Market

Related Posts Plugin for WordPress, Blogger...

, , ,

No comments yet.

Leave a Reply