PCM.daily banner
25-12-2024 05:12
PCM.daily
Users Online
· Guests Online: 29

· Members Online: 1
sohanaeyehospital

· Total Members: 162,231
· Newest Member: sohanaeyehospital
View Thread
PCM.daily » Pro Cycling Manager 2006-2020 » Pro Cycling Manager 2012
 Print Thread
[Tutorial] Creating A Shirt for PCM
miggi133
Since I repeatedly got asked how i make my jerseys and I also have seen many comments where peolple ask how to make custom shirts, i decided to to write a tutorial on how to use gimp in oder to create jerseys. I also added RJC's tutorial on how to work with Photoshop to create jerseys into this thread.
I hope this will serve new shirtmakers to get off with a good starting point!

I will provide the material you need in this thread as well. You just have to Download them!

BEFORE YOU GET STARTED:

USE DIFFERENT LAYERS FOR DIFFERENT ASPECTS OF THE SHIRT!
AND BE SMART ENOUGH AND SAVE A COPY IN PSD FORMAT! IT MAKES LIFE ALL THAT MORE EASY!!!

Spoiler
Its just a mere advice but use layers. As soon as you wanna do a quick change or a national championship shirt with the templates provided, youll appreciate the fact that you have an image with up to 50 layers or more. And the psd file makes sure that these layers will stay distinctive for as long as you have the file... Editing a shirt could not be easier!


Tutorial for working with GIMP (including Shorts Tutorial)
Spoiler
i1097.photobucket.com/albums/g358/miggi133/Tutorialpart1.png
i1097.photobucket.com/albums/g358/miggi133/Tutorialpart2.png
i1097.photobucket.com/albums/g358/miggi133/shortsTutorial.png


Important notice for novice GIMP 2.8 users

Spoiler
The newest gimp version works a bit differently when you want to save the shirt. In order to save the shirt you must click export instead of save as. I also recommend to export the shirt twice (once as psd and once as tga or png or whatever format you want to!) as the creator has modified the newest version in a way to promote gimp picture files! Importing remains th same (open file)


Tutorial for Working with Photoshop - Created by RJC_43
Spoiler
A couple of things before we start off however. I'm using Adobe Photoshop CS3, and would definately recommend getting it if you want to make some good shirts. I'm not saying you can't make a good shirt without it, but I don't have any experience in that field.
Whatever I write here, is in its entirety how I function, and how I do things. Others may do it another way, or find it easier to do so. This little bit of help isn't to be slated, you may add to it if you like, you may share your ideas, but if you happen to have a problem with what I write, either keep it to yourself, or PM me so we can abuse each other in private.

First off, the layout of Photoshop can be confusing. I know when i started out, i was rather lost on how to do anything! So to keep it simple, here's how my photoshop looks:

The left toolbar, which has all the tools you need to make your first shirt:
i33.photobucket.com/albums/d87/Cleavers/LeftToolbar.png

If you select one of these tools, the upper bar will change to show the options relating to that tool. So as we can see, I have the "Move Tool" selected, and it shows the relative options:
i33.photobucket.com/albums/d87/Cleavers/TopToolbar.png

Opposite the left toolbar, we have what can be simply described as the right navigator/colour selector/layer viewer. Here you can zoom in, move about, choose colours, choose different layers to work on, and many more options.
i33.photobucket.com/albums/d87/Cleavers/RightNavigator.png

Now that we know what, roughly, is what, we can go about starting a jersey.

Clicking FILE - NEW will bring up this kind of menu:

i33.photobucket.com/albums/d87/Cleavers/NewFile.png

You can input a name here for your file, and make sure that the dimensions are correct. 455 pixels wide, and 313 pixels high are what you need, and everything else you can just keep the same.
Clicking OK loads the new file, and you will have a background layer, probably of white (not that it makes a difference).
To keep it simple, just leave this layer as it is.
Now we need to know which parts of this white space to fill with colour so that the jersey looks right. To do this, we need to add a "plis" or in other words, the jersey's folds. There are plenty in this forum to be had, so find one, save it to your computer and open it up in photoshop.

i33.photobucket.com/albums/d87/Cleavers/NFPlis.png

If we now select the second tool down on the LEFT TOOLBAR (called Rectangular Marquee Tool) and click and drag a box over the entire area of the plis, we can copy (ctrl+c or edit - copy) the plis.
Once copied, go to Window and select the first file you made:

i33.photobucket.com/albums/d87/Cleavers/Windowhange.png

Once there, just paste the plis. (ctrl + v or edit - paste). A new layer will appear over the background layer, with the plis in it.

Select (just left click) on the Background layer, and then click the "new layer" button. This will produce a new layer in between the background and the "plis":

i33.photobucket.com/albums/d87/Cleavers/NewLayer.png

i33.photobucket.com/albums/d87/Cleavers/NewLayer2.png

On this layer we can make the shirt have colour!

Reselect the "plis" layer, and change it's blending to "multiply"

i33.photobucket.com/albums/d87/Cleavers/PlisMultiply.png

This way, the layers underneath the "plis" layer will show through.

Now you are ready to go back to "layer 2" and add some colour.
I usually choose one main colour I'm going to use, and paint bucket the entire layer:

i33.photobucket.com/albums/d87/Cleavers/PaintbucketIt.png

Now you have an extremely basic jersey that you could use in a game.

Save now, and stay tuned for another update on how to:
Add more colours the easy way.
Add sponsors.

To add more colour, the hard option (or could be called - the way I did it!), is to add it in, either in another layer, or on the same one, pixel by pixel, using the paintbrush or pencil. This takes a LONG time, and produces some pixelated work that isn't all that attractive.

The easy way to do it, is to use the "pen".

i33.photobucket.com/albums/d87/Cleavers/PenTool-1.png

Select the same buttons as are shown in that picture to get the same effects as I get. Or alternatively, use F1 to bring up the photoshop help file to gain a professionals advice!

In this case, I want to draw onto a new layer, so in the same way as before, select layer 2 and click new layer. Layer 3 should appear. Make sure that it is selected so that you are drawing onto that layer, and none other.
When using the pen tool, keep in mind that every left click will produce a new point, and every left click and hold will produce a "curved" point.

For the first example, all I am going to do is add a square shape.
Click 4 points:
i33.photobucket.com/albums/d87/Cleavers/PenTool1.png

And then finally click on the first point once more to join up the box:

i33.photobucket.com/albums/d87/Cleavers/pen2.png

Right clicking near to the pen lines brings up a menu. You can delete the lines if you are not happy with them, or can fill the area with colour by selecting the "fill path..." option.
This gives the option of filling the area with the foreground colour, or the background colour, or any colour, so it is advisable to select the colour you want prior to starting to draw for ease of use. (just select a colour from the right hand area).

i33.photobucket.com/albums/d87/Cleavers/fillpath.png

Click OK to fill the path in. Once done, you can now right click again and delete that path.

i33.photobucket.com/albums/d87/Cleavers/filledpath.png

And thats how you do simple shapes.

For more complicated ones, click and hold the left mouse button when selecting corner points, and you can bend the lines to make curves:

i33.photobucket.com/albums/d87/Cleavers/CurvesPen.png

Holding down and dragging out the guiding lines for longer increases the curves. To get a grasp of the idea, its best to play around and gain experience through doing.

Remember to do every new colour addition on a new layer to prevent mistakes becoming irreversible.

Any questions, feel free to ask.

The Sponsors.

First off, with sponsors, think and look at actually professional jerseys. Look at how big their sponsor logos are, and put in some consideration before you go ahead and put a minor sponsor plastered all the way across your jersey. Saying that, having small sponsor logos may be effective for a team with a lot of sponsors, but if your team has just the one big sponsor, then sure, use it quite a few times.

Ok, to start with, have your jersey up and running. I'm using a random one I made:

i33.photobucket.com/albums/d87/Cleavers/BaseJersey.png

And then we need some sponsors. THink about whom you want, and where you want them before you start.

In this case, I'm going to be using Wiggle as a co-sponsor, and INet as a main one. This is as well as the usual clothing sponsors, bike, equipment, foods, etc.

With a bit of luck, you can find some sponsors online via google's picture search. (Wiggle logo for example). Some will need editing prior to use, and some won't. My Wiggle logo will not:

i33.photobucket.com/albums/d87/Cleavers/H3EasySponsor.png

If when loaded up, the picture has those hatched boxes in the background, it means that there is no background to the picture, so you can rectangle box select the whole lot and copy paste it onto your jersey. Pasting will produce a new layer. Which is what you want for ease of editing.

If you, however, find a sponsor with background, or extra bits you don't want, then do the following!:

i33.photobucket.com/albums/d87/Cleavers/H3GoogleSponsor.png

Open it up in Photoshop as usual:

i33.photobucket.com/albums/d87/Cleavers/H3INetCuttinOut.png

Select the magic wand tool. This will enable you to select different parts of the logo as you wish. Look at my settings on the upper tool bar to get a rough idea of what to do. When all parts are selected, again copy/paste will surfice to get it onto the jersey.

i33.photobucket.com/albums/d87/Cleavers/H3INETPasted.png

As we can see, it's far too large for the jersey, and we'll need to change that.

Select the move tool. And on the upper toolbar the "transform controls", so that a tick appears in the little box.

i33.photobucket.com/albums/d87/Cleavers/H3MoveToolTransformControls.png

This will create a box around your image, or the layer you are on's image. When you move the cursor close to the box surrounding the image (from the outside) the cursor will change into a double-ended arrow. If you click at that point, the upper toolbar will change into editing that image. We can change the size of the image here, or the slant, or the rotation.

i33.photobucket.com/albums/d87/Cleavers/H3InetRejig.png

As you can see, I decreased the size of the image to 30%, when happy click the "tick" on the right of the upper tool bar. This will change the controls back to how they were before entering transform control. Using the up/down/left/right arrow keys move the logo into the right place. Holding down "shift" will move the logo faster.





Also, If there is any interest later on, I could do a tutorial in which I show you, in a few quick and easy steps, how to make national championshirts.
Edited by miggi133 on 19-09-2012 20:34
 
miggi133
Downloads and useful Links


-Downloads for the Tutorial! Now includes national championship jersey templates!

- Alternative Plis (Textured Layer without stichings on the shorts)
Spoiler
i1260.photobucket.com/albums/ii566/laidbackmarc/p16.png

Credits go to BoogieBoogie


-Template for African NC's Includes a template for every african country!
Edited by miggi133 on 02-06-2013 16:20
 
miggi133
Reserved
 
miggi133
I added the second Part of the Tutorial and The Download Links. If You still have some questions please feel free to post them in here...
 
Ad Bot
Posted on 25-12-2024 05:12
Bot Agent

Posts: Countless
Joined: 23.11.09

IP: None  
Alakagom
Looks really good Miggi Wink Should be definitely very helpful for everyone new to jersey making.
pcmdaily.com/images/awards/2012/avatar.png


pcmdaily.com/images/awards/2012/admin.png
 
miggi133
Just added RJC's tutorial for Photoshop which he made years ago.

@Alakagom (or any other Admin):
Could we make this a sticky thread? I will update it with the other Tutorials I can find...
 
tovhol
Show with Paint too?
 
miggi133
You mean with Paint.net?

If I find the time in the next few days, ill do one. Unless I find one which eould be a uge relief for me since I am not that skilled in working with it...
 
miggi133
I added another Plis without Stitchings on the shorts. This one leaves more creative freedom for the pants...
 
miggi133
I think I have to bump this one...

To an admin: Could we please make this a sticky thread?
 
baseballlover312
I can't get the GIMP tutorial or example. Sad
RIP Exxon Duke, David Veilleux, Double Feature, and Monster Energy
pcmdaily.com/files/Awards2016/avatar.png
pcmdaily.com/files/Awards2019/funniest.png
pcmdaily.com/images/mg/Awards2020/funniest.png
pcmdaily.com/images/mg/Awards2020/forumthread.png
i.imgur.com/VCXYUyF.png
i.imgur.com/4osUjkI.png
 
miggi133
What do you mean? You cant download them or you cant find them? Cause it works out fine for me. Plus, I didnt make it available to download since you can save it as a picture on your computer...
 
baseballlover312
It's just not there for me. Must be the browser.
RIP Exxon Duke, David Veilleux, Double Feature, and Monster Energy
pcmdaily.com/files/Awards2016/avatar.png
pcmdaily.com/files/Awards2019/funniest.png
pcmdaily.com/images/mg/Awards2020/funniest.png
pcmdaily.com/images/mg/Awards2020/forumthread.png
i.imgur.com/VCXYUyF.png
i.imgur.com/4osUjkI.png
 
miggi133
What browser do you use?
 
birch23
Ist it possible that you actually will consider making the tutorials available for download...I've tried the save as picture option and failed.

It's the Photoshop tutorial I'm interested in I use Photoshop Elements 7 and although this tutorial is the first I have come across about using Photoshop...and although this is an older version of PSP there are similarities enough to try and create my own maillots......at least I would be able to give it a try...Smile
 
miggi133
Sure, I can make it available as a word document tomorrow.
 
jseadog1
can someone help me, I cant find the mark all button in GIMP

EDIT: Nevermind, found it
Edited by jseadog1 on 25-07-2012 03:08

pcmdaily.com/images/mg/Awards2022/userproject.png
pcmdaily.com/files/Awards2016/fantasy.png

PCM.Daily Survivor Season 2 Fan Favorite Winner

PCM.Daily NFL Fantasy Football Champion: 2012
PCM.Daily NHL Prediction Game Champion: 2013
PCM.Daily NFL Prediction Game Champion: 2012, 2013, 2015, 2016, 2021
 
SweatyViking
jseadog1 wrote:
can someone help me, I cant find the mark all button in GIMP

EDIT: Nevermind, found it


Where?
 
miggi133
After you created your shapes (assuming that you only updated an older version of gimp) you have to change from the lyaer menu over to the tool menu. There are 2 buttons. Follow path and mark all.
 
SweatyViking
miggi133 wrote:
After you created your shapes (assuming that you only updated an older version of gimp) you have to change from the lyaer menu over to the tool menu. There are 2 buttons. Follow path and mark all.


I'm using GIMP 2.
 
Jump to Forum:
Login
Username

Password



Not a member yet?
Click here to register.

Forgotten your password?
Request a new one here.
Latest content
Screenshots
He is in a rush
He is in a rush
PCM11: General Screenshots
Fantasy Betting
Current bets:
No bets available.
Best gamblers:
bullet fighti... 18,776 PCM$
bullet df_Trek 17,674 PCM$
bullet Marcovdw 15,845 PCM$
bullet jseadog1 13,852 PCM$
bullet baseba... 10,539 PCM$

bullet Main Fantasy Betting page
bullet Rankings: Top 100
ManGame Betting
Current bets:
No bets available.
Best gamblers:
bullet Ollfardh 21,990 PCM$
bullet df_Trek 15,820 PCM$
bullet Marcovdw 15,300 PCM$
bullet jseadog1 13,800 PCM$
bullet baseball... 7,432 PCM$

bullet Main MG Betting page
bullet Get weekly MG PCM$
bullet Rankings: Top 100
Render time: 0.40 seconds