Tutorials / View Tutorial

Advertisement

By Cyclonesue on Oct 23, 2009 • Sims 3 Pattern Making Tutorial

What you will need…

(1) A graphics program that can divide graphics into separate RGB (red, green, blue) images (channels)

(2) Optional - a DDS plug-in (not all graphics programs support them). If you’re using Photoshop, nVidia has produced a Photoshop plug-in specifically for Photoshop (http://developer.nvidia.com/object/photoshop_dds_plugins.html). Note that this only works in 32-bit versions of Photoshop (there's no 64-bit version). For any other art program, search the net. If your art program has no supported DDS plug-in, you will need to use the PNG format instead (see PNG or DDS below).

(3) The TSR Workshop tool (http://www.thesimsresource.com/workshop)

PNG or DDS?

To be able to make patterns with the full 4 colours of Create-A-Style, you will need to save your pattern as a DDS file. Some graphics programs (including Photoshop, GIMP and Paint Shop Pro) have DDS plug-ins available on the net that you can install. Other programs (including Corel photo X and Photo X2) don’t seem to have DDS plugins at all but can still support the PNG format instead (your only restriction with PNG will be that you’re limited to just 3 of the 4 available pattern colours – though most patterns actually don’t require 4 separate colours).

 

Prepare a new custom pattern image…

To make a custom pattern in your graphics program, you need to create a new, empty image.

The only settings that are important are:
· Size (your image must be 256 pixels wide by 256 pixels high)
· Image format (it must be an RGB image – 8 bits per channel)
· It needs a black background (explained later)

None of the other settings shown on the right are important and can be ignored.

 

Your image’s background colour…

Some people recommend a 100% white background, others recommend a transparent background, and still more suggest 100% black. For me, black has always worked the best when converting a texture into a pattern and allows you to make use of a secret-fifth colour (well, not THAT secret really)...

If you’re not sure, choose black like me so that your image will work like mine through this tutorial.

Greyscale

You're finished pattern will be a greyscale image ready to be converted by the TSR Workshop tool into a pattern. Here is how a greyscale image works:

· Black is invisible
· White is solid
· Grey is see-through (the darker the grey, the more see-through it becomes)

Channels instead of layers…

We’re going to divide our pattern into CHANNELS (because that is what patterns use in Create-A-Style). Graphics programs differ in how they allow you to work in channels; Photoshop has its own Channels window as shown on the right. However, when making patterns, channels allow you to copy and paste into them in exactly the same way you would with layers.

 

For our pattern, the channels will layer on top of each other, with red at the bottom, followed by green, then blue. The alpha at the top is mentioned a little later.

The finished image layers the channels in the order shown on the right. Images in a higher channel will obscure anything it overlaps in a lower channel, so you need to be careful about that. Fine for a tartan rug, but not good for brick!

 

Adding a fourth colour (an alpha)…

RGB images only have three channels - a problem if you want to make a 4-colour pattern! But all we do is cheat by adding an 'alpha' as the missing fourth channel. For patterns, the alpha is nothing special; it's just another channel.

Your new alpha will probably be named Alpha 1. Only add one alpha. If you have additional alphas in your image, delete them because the game can only use four colours in Create-A-Style. Adding 20 alphas is just plain silly so don't do it!

How channels work in the Create-A-Style tool…

And now the fog should clear a bit! Channels merely represent the four colour pickers in the game! The picture on the right shows that every channel in your pattern relates to a colour picker in the Create-A-Style screen. How cool is that?!

Any graphic you place in your red channel will be controlled by the first colour picker in the Create-A-Style tool. The graphic you place in your green channel will be controlled by the second colour picker, and so on. Hopefully now you can understand 'why channels'!

If your pattern doesn’t use some of the channels, its corresponding colour picker in the Create-A-Style tool won’t be clickable. Remember: there is no snobbery or fame to be had im making 4-colour patterns! Many EA patterns use only one - and EA pretty much know what they're doing!

Hint: The names of the channels (red, green, blue) bear NO relation to the colours of the pattern (ie the blue channel does not need to hold blue colours…).

For my brick pattern, I placed the mortar image in the red channel, then used the remaining three channels for different selections of brick. This allows the player to make three different shades of brick. My shades differ only very slightly in this example.

 

Seamless tiling

Before you do ANYTHING with your pattern, you must ensure that, when the pattern is repeated vertically or horizontally, no join lines are visible (and that's known as ‘seamless tiling’):

· Any lines or pattern must join unnoticeably
· There should be no gaps between each repeated image
· The pattern itself should have no noticeable 'repeat' to it

The green squares on the right are each made up of a pattern tiled 4 times (that is: each green square is 2 patterns wide, by 2 patterns high). In fact, it’s rather obvious how many times the pattern is repeated in the left-most square because you can see the joins clearly because the pattern does not line up. The rightmost green square does tile correctly with no visible join and so is more seamless (though the middle column of tiles is a bit dark and might result in some repeated dark bands when used over large areas).

 

You might be making a single pattern as a motif for a tee-shirt, but someone who downloads your pattern might want to use your pattern as wallpaper or the covering of a sofa (in fact, you can count on it)! It is for this reason that some Sims websites (TSR too) will reject your pattern unless you provide screenshots proving that your pattern does tile seamlessly. Extreme closeup of your pattern on a Sim's sock does not count as evidence of good tiling!

How to make seamless tiles

There are various plug-ins available on the net for seamless tiling in Photoshop, and plenty of downloadable widgets aimed at achieving seamless tiles. There are also tutorials on making your tiles seamless manually (and it's actually very easy to do it manually with Photoshop's offset filter). These are beyond the scope of this tutorial but you should find plenty of information if you search the net for seamless tiling help.

For this pattern I actually used the in-built seamless tiling option found in most recent versions of Paint Shop Pro (including Corel Photo X and X2 – under Effects/Image effects…). It works really well for most graphics, including my uneven bricks pattern (an extract of the pattern tiling shown here in Corel’s Seamless Tile preview window).

 

35 Comment(s)

Note: We do our best to make sure the comments posted are of non-offensive material and on-topic. If you see something that is irrelevant or abusive, please report it and we will remove it as soon as possible.

On Oct 23, 2009 cazarupt wrote:
Brilliant tutorial Sue I'm still pretty much beginner at making patterns, but this tutorial really explains everything I didn't understand. Thankyou
On Oct 23, 2009 kattsand wrote:
Thank you so much for taking the time to do this, it was very helpful and very well explained. Thanks again!
On Oct 23, 2009 duckeggpie wrote:
Thank you Its really good!! I will have to have a go at making patterns now
On Oct 24, 2009 Spongebob101 wrote:
GAH
On Oct 24, 2009 simromi wrote:
Awesome tutorial Cyclonesue!  I made a few simple patterns, but now I feel inspired to make more.  Thanks for sharing your knowledge!
On Oct 24, 2009 Jaws3 wrote:
Yay! I have to admit that every other patterns tutorial I've read has left me smiling and nooding, mostly pretending to understand what I've read! I'm glad there's something now for us...slower... folk!
On Oct 24, 2009 SimonettaC wrote:
Oh thank god!!! I was struggling so much, that I had even written a few begging letters to a few Artists for help. I appreciate all the time that people give on here anyway So I hate to put on anyone and ask for help, so I really do appreciate people who take the time to produce tutorials for donkeys like me. That's why I love you Sue, your a TSR Star! Best wishes from your personal donkey and long time fan.. 
On Oct 25, 2009 LD202 wrote:
thx that was great one. it explained a lot. thx again
On Oct 25, 2009 MidnightRose wrote:
Thank you once again Sue!! This will really help me with the more compicated patterns I want to create!
On Oct 25, 2009 RULEFE wrote:
Thank you.
On Oct 26, 2009 Rosaleena wrote:
genius!!
On Oct 27, 2009 DragonQueen wrote:
   Bless you, Sue, I think you may have answered all my frustrations with this tutorial! 
On Oct 27, 2009 DragonQueen wrote:
Ok, never mind, I spoke too soon!     Any idea what a JIT Debugging error would mean?
On Nov 2, 2009 moonhunt wrote:
Thank you very much. I learned a lot from this.
On Nov 5, 2009 aloleng wrote:
Thank you Sue. I learned and made my first pattern because of you. Keep it up.
On Nov 15, 2009 poundingheart wrote:
great explainations but it is still beyond my simple brain. I am afraid I am one of those people that need it explained in step by step literally lol  
On Dec 23, 2009 PRESARIO2316 wrote:
didt understan word what you mean. still lost in it....
On Feb 19, 2010 championcashley wrote:
I've no idea what I'm doing!  I'm with poundingheart, I need step by step instructions!
On Feb 19, 2010 MzBubblii wrote:
My photoshop won't allow me to save with the alpha channels. It's grayed out.
On Feb 24, 2010 littlecritter wrote:
Thanks for the tutorial think I might have a go at it
On Feb 26, 2010 bellagirl380 wrote:
Brilliant! Thank you so much for taking the time to do this! I'm half computer illiterate and I've cracked out two patterns already!
On Mar 5, 2010 fredbrenny wrote:
Dear Sue... would you have this tutorial as a pdf file? I would love to print it and work with it!
On Jun 4, 2010 MissFashionWales wrote:
Where do you get the software from?
On Jun 5, 2010 Purpleto280 wrote:
 
On Jun 5, 2010 Purpleto280 wrote:
I love this tut but I am useing Paintshop pro and can not find how to add the Alpha channel ... please could you explain thanks.
On Jul 21, 2010 agapi r wrote:
Great tutorial It helped me alot.
On Jul 23, 2010 Princess-Diamond wrote:
But i can`t find the TSR workshop progam
On Aug 8, 2010 murfeel wrote:
Is the Workshop pattern maker now obsolete since EA came out with Create a Pattern? Which is better--(*easier*, whisper) to use? And, of course, more efficient?
On Jan 25, 2011 clairkp wrote:
Thanks for the Tut, but I can't find the TSR Workshop Pattern Tool. can anyone tell me where to find it?
On May 15, 2011 TigerLiyene wrote:
Thanks for awasome tutotial!!!  
On Jun 6, 2011 Degera wrote:
I'm late to the party, as always, but I wanted to say thank you for this.  I was struggling with a crushed velvet pattern that just didn't want to stop being all white (*cough*).  I'm blaming the pattern for this of course.  But your tutorial was a huge help.  Thank you 
On Jun 22, 2011 allison731 wrote:
Thank you very much 
On Jul 10, 2011 kmiloqc93 wrote:
thank you so much  
On Aug 4, 2011 altea127 wrote:
Thank you!!!
On Aug 24, 2011 Nemesis_3050 wrote:
Thank you a lot for this tutorial ^^

Add a Comment

Warning: Use of bad language, unsuitable links or flaming will result in deletion of your account - regardless of your membership status. Please note that comments must be suitable for our PG13 audience. Your IP address is logged and abuse of this service will result in a ban and evidence sent to your ISP.

 

This site is not endorsed by or affiliated with Electronic Arts, or its licensors. Trademarks are the property of their respective owners.
Game content and materials copyright Electronic Arts Inc. and its licensors. All Rights Reserved.