Introduction

With a new game comes new custom content - and new methods of creating that custom content. TS3 introduces what may be a new concept to you: Multipliers. Multipliers are an image that is, as the name suggests, multiplied against the pattern being used. The lightness and/or darkness of the multiplier determines where shadows and highlights appear.

Multipliers can be drawn by hand, which involves a lot of work – or they can be created automatically in some 3D programs in a process known as “baking”. During the baking process, the mesh is rendered with shading that you would find in the real world and then the shadows are “baked” onto a texture in accordance with the UV Map.

Creating a UV Map that can be baked to can be a hassle due to the specifics of how the baked image is created. When creating shading by hand, similar faces can be overlapped and you can draw some generic shading that will work for all of the faces. When a multiplier is baked, it’s very important that faces do NOT overlap. The 3D program generates a shadow specifically made for each face, and ONLY that face. When two faces overlap and share the same space, the program tries to create each shadow in the same texture space – which it can’t – so you just end up with a big mess, rather than one shadow that works for multiple faces.

Once you have your mesh made and UV Mapped (make sure to note there are no overlapping faces!), baking the shadow map is quite simple. I’m going to assume you have already made your mesh in some other program (or even in Blender, if you know how) and have it properly UV Mapped and ready to go. If you made your mesh in another program, export it out as .obj now to somewhere you can easily find it.

Upon opening Blender, the screen you are presented with is two windows – a 3D window on top that should have nothing but a cube and a light, and a window on the bottom that is filled with buttons. In the 3D window, the first thing to do is press “Delete” on your keyboard, then click OK to get rid of the cube.

File > Import > Wavefront (.obj). Browse to where you exported your mesh to, select it, and click import. You will be presented with a box that looks like this:

Setting up the Scene

Adjust the settings so the dialog looks like the one above, (Click “Smooth Groups”, change “Clamp Scale” to 0, and turn off “Image Search”) and then click import. Your mesh should now be in the 3D view (although it will appear to be facing the wrong way, this doesn’t matter.)

A quick rundown of how to move your mesh around and rotate it – click and drag with middle mouse button to rotate the view; hold shift + middle mouse button to pan the view. The scroll wheel controls zooming in and out.

Look for a dark gray line between the windows that, when the mouse passes over, changes to a double arrow cursor.

Viewing UV Map and Mesh together

While hovering over that line with the double arrow cursor, right click on that line and choose “Split Area.” A gray line will follow your mouse now, get the line in the middle of the top view port and left click. You should now have two 3D views.

Look in the bottom left-hand corner of one of the windows for a button that looks like a grid. (I’m going to choose the right-hand viewport). Click the grid button, and from the menu that comes up, choose “UV/Image Editor”. One window should now be your 3D view, and the other should be an empty gray UV grid. Press “Tab” on your keyboard, and your mesh should turn pink in the 3D view while the UV Map appears in the UV window. If nothing happens upon pressing tab, click in the 3D window, press “A” then right-click your mesh again to reselect it – then try pressing tab again.

In the UV Editor window, click the “Image” menu and choose “New.” In the dialog that comes up, change the size of the image to 512x512 (or 1024x1024 if you really need the extra room), then click okay. Your UV map should now be on a 512x512 (or 1024x1024) pure black texture.

Look at the bottom panel now, with the buttons. Towards the top of that panel there will be a series of 6 buttons in one group, and 5 in a second group. Click the 5th button of the second series, it should have a little globe icon on it and be labeled as “World”.

Enabling Ambient Occlusion

Upon clicking the World button, you will be presented with LOTS of buttons and sliders and numbers. Ignore them, and look for a tab that says “Amb Occ” and click it. It should be in the third set of panels out of the four. Once you click it, click the button that says “Ambient Occlusion”. Change the “Samples” value from 5 to 10.

Baking the texture

Looking back at the two series of buttons, click the 6th button in the first series “Scene”, or press F10. Where you found the “Amb Occ” tab before, now look for a tab labeled “Bake” in the same place.

Look for a button on that tab that says “Ambient Occlusion” (second button down on the right side of that tab) and select it.

Click the large “Bake” button. It might look like the program is about to crash, but if you wait a few seconds it will start baking, and filling in your UV Map with the appropriate shading and shadows.

Saving the Multiplier

In the UV Editor window, click the “Image” menu again. Click “Save As”. Browse to where you want to save it, type in the name you want to save it as, but DON’T click save yet. Look at the bottom of that viewport for a box that has “Targa” in it. Click that box and change it to JPEG. Now you can save it to the location of choice, preferably somewhere easy to find.

Because Blender doesn’t have the option to save as .DDS, you will have to open the JPEG you just saved in your graphics program and save it out as DDS to make it usable in workshop.

• TSR Workshop 0.8.7 or later (http://www.thesimsresource.com/workshop)
You will need TSR Workshop for importing/exporting your meshes and textures and exporting your final work as a .sim3package or .package. This tool doesn’t make meshes, you need a 3d application for that.

• A graphics editor capable of supporting DDS (I’ll be using Photoshop CS3)
You’ll need a graphics editor to draw your hair textures and save the textues in .dds format. This is the only format The Sims 3 recognizes. You can’t just save your textures in .bmp or .jpg.

• Milkshape 1.8.5 or later
You’ll need Milkshape mainly for bone assignments and because Workshop has Milkshape plugins to export – import .wso files. This format can hold bone assignment information. But for modelling I strongly recommend to use a more professional 3d application like 3ds Max, Maya and Cinema 4d. It doesn’t mean you can’t mesh in Milkshape. But Milkshape has very limited tools to help you get your work done faster, so you’d probably spend weeks in Milkshape to create a smooth and beautiful hair mesh. Trust me, it’s a lot of work!

• CrazyBump (http://www.crazybump.com/) (optional)
This program is amazing . You can make your bump maps, specular and normal maps within seconds with this tool. Try it!

Step 1

So, first things first. Install TSR Workshop then go to C:\Program Files\The Sims Resource\TSR Workshop\Extras\Milkshape Plugins and grab the two files named msTSRWorkshopExport.dll and msTSRWorkshopImport.dll. Now go to C:\Program Files\MilkShape 3D 1.8.5 and paste them there. Now your milkshape has TSR Workshop plugins!

Step 2

Now fire up TSR Workshop. Hit Create New Project > Hair > Age > Sex > Clothing Category and pick a hair from there.

Pick a hair that suits your new custom mesh best. If you’re planning to make a long hair pick a long one from the list so you can study how their vertices are assigned to bones and copy them. You can also pick a hair that has accessories like hair clips or hats if your new mesh has accessories too. This will make things easier later.

Step 3

Name your Project, find a unique name for the unique indentifier (for example creatorname_hair_01) find a name for the title and write a description. Since I’m too lazy to fill all those spaces I just paste Ulker_hair_00x to all of the spaces. It doesn’t matter what you write really. Just make sure the unique identifier is somewhat unique!

Step 4

Let’s just save our project in .wrk format and close Workshop. We’ll mesh hair now! Open your favorite 3d application and import one of the example bodies. I’ll be using 3ds Max 2010 and importing the adult female body in this tutorial. But you can do the same things I’ll be doing in another 3d application too. Now group the face, scalp and the body together and freeze them so you don’t move their verts by accident.

1. Select Shadow Mesh

As you can see, the sunshadow mesh isn't yet adjusted.

Change to the mesh tab where you've previously imported the high and the low detail mesh. From the dropdown menu select Shadow high level of detail.

2. Press Generate Shadow Mesh Button

The Generate shadow mesh button almost next to the dropdown menu should now become active.

Click it to open the Select MLOD window. You have to tell TSR Workshop what should be all included in this shadow mesh from the High level of detail mesh. What generally should be excluded is the groundshadow mesh (you can recognize it on the low vertices/faces count). When you're done selecting the meshes, click on OK.

3. Done

The newly generated sunshadow should now become visible in the 3D Preview. If not, make sure you are in the correct LOD mode and have sunshadows showing activated . In the Mesh Tab you've also got a rotation slider available so you can check how the sunshadow looks from different angles.

4. Repeat for Low LOD

Now repeat step 1 and 2 for the Shadow low level of detail. This time you choose the meshes from the Low level of detail mesh in the Select MLOD dialog.

Step 1 – Loading TSR Workshop

Go to your Start Menu > All Programs and load the TSR Workshop.

Step 2 – Creating a New Project

Navigate to the top left of the Workshop and click on the ‘Create new Project’.

In the new window that will pop out in front of you select Makeup/Facial overlay and click the button ‘Next’ in the right bottom corner.

As I said before I’m going to make an eyeshadow so I’ll choose afMakeupEyeshadowSmoky and click ‘Next’

In the next screen you will be asked to give your project a name and some additional details. Although it is very important to give your projects a unique identifier and fill in all the other boxes, we’re actually only going to use this project to get a file we will need – we won’t be exporting anything for the game from here. So for now, just click ‘Next’.

Finally your new project will load and you will be able to see the eyeshadow on the model in the left window and project details in the right one.

When you click on the ‘Texture’ tab you will see that under ‘Textures’ there are ‘Face Overlay’ and ‘Face Specular’. The important one for us is ‘Face Overlay’, which determine where the makeup is placed on the face.

Probably by now you also noticed that at the bottom, under colors, there is only one color that can be changed. That means you won’t be able to create a multicolor makeup starting from the eyeshadow you have opened.

However, this is still a very important step – as I mentioned earlier we’re just needed to find an image file – the face overlay is the image file we needed here, so now we’re going to export it.

Programs we will be using

TSR Workshop
Adobe CS2 or higher
DDS Plugins for Adobe

BlackGarden’s Tutorial will also be very useful if you don’t know about Adobe’s pen tool:
Extracting Sims and Objects from Screenshots

Step 1

You should have already meshed your plant and have your UV map handy. Make sure your map is the size of the dds files from workshop for this tutorial. The size of the dds we will be using is 256 X 256. Then import your meshes to WS. Delete all Variation Files by choosing them and in turn hitting the red X until you only have one file.

Step 2

These are our dds files we will be working with. We will not be exporting the mask for this tutorial, we won’t need it.
In turn export Overlay, Multiplier, and Specular naming them and placing them in a file you can find easily.
Open Adobe CS2 or higher. Drag, in turn, your Overlay, Multiplier, and Specular into Adobe

Step 3

Now you will make a blank 256 X 256 file to work with. Not necessary but an easier way to make your files. Make it black.

I’m going to take my UV map and place it on the blank file Like so:

Step 4

Now we will position our plant and other non recolorable images on the map.

Step 5

Now delete the UV map, flatten image and you should have this:

Step 6

Now we have our working “Model” for the rest of our dds files.

Now we’ll work on our Overlay First

Copy this “Model” to your overlay file. Ctrl A, ctrl C this file and then ctrl V to the overlay. Your overlay now has its base.

Ah, but your overlay needs a new alpha file. So back to your “Model”. Duplicate the main layer of the model file. Using your wand tool you will select all black parts on the duplicate layer and right click select inverse. Using your pencil at the highest setting and making sure your main color swatch is white click on your selected image. You should have something that looks like this:

Step 7

Now we want to ctrl A and ctrl C to copy this layer to our Overlay Alpha. So lets do that now, ctrl V to paste and you should have an alpha layer for your overlay that looks like this:

Step 8

Flatten layer and save as a DXT5 ARGB 8 bpp | interpolated alpha. Overlay is now done.

ONWARD! Now would be the time to grab a cup of coffee or a Soda…..So I’ll wait for a minute.

Ok minute over. Now we will work on the Multiplier.

The first thing we want to do is go back to our “Model”. Make sure you deleted the Alpha File we made for our overlay. You should now be back to this for your “Model”:

Step 9

Now we want to make a multiplier file. So again duplicate your “Model” layer. Now go to Image/Adjustments/Desaturate. Now your “Model” should have a layer that looks like this:

Step 10

As before you will copy this layer and paste it over the multiplier file. Now we get into the tricky parts……Yes what makes you think it can’t get any more complicated? Hmmmm?

Take your UV map and place it on top of both the Multiplier layer then reduce visibility to 35%. You should have something that looks like this:

Step 11

Now see how we still have the pot to do? Well we are going to hand draw around the pot with a grey layer. So make a 256 X 256 Grey layer to work with and save it. Now place that saved layer over this multiplier and reduce visibility to 45% so you can see the UV map underneath. Rastersize the layer in case you didn’t know you had to do that. Right Click on the layer, Rastersize. You should now have this:

Step 12

Now we will cut around the pot using our pen tool. If you don’t know how to do this I suggest you read BlackGarden’s Tutorial first found here:

Extracting Sims and Objects from Screenshots

Now we will delete the extra layer and the UV map, then flatten so that we are left with this:

Step 13

Now we Could get into all the technical stuffs about shading in your multiplier because the pot part does need some shading, but that is not the purpose of this tutorial. So we won’t :0).

So Onward, now we need an alpha layer for the multiplier. Yes on plants the Multiplier has an alpha layer. So now we will go back to our “Model”. Select the black parts with your wand tool and then select inverse so that your parts are selected. Going to your pencil tool again we want to make white the parts to the plant. Ending up with something that looks like this again:

Step 14

Now place our UV map over top of this file. Reduce visibility to 35% so you can see underneath the UV map. Now comes the most important part or making our leaf totally invisible around the leaf in game. You are going to trace your UV map around the entire leaf surface of the mesh part with your pen tool (Again referring to BlackGardens Tutorial). Like this:

Step 15

Notice how I drew a little bit larger than my mesh map. Now we will layer via cut just that section. Delete the UV map and place a white background layer underneath the cut out. Flatten and it should look like this:

Step 16

Now you will copy and paste this to the alpha layer of the Multiplier and your channel should look like this:

Step 17

Now save to DXT5 ARGB 8 bpp | interpolated alpha. Your Multiplier is now done.

Take a break, Walk around and clear your head, the hard parts are now done. We have one more thing left to do. The Specular.

We’re going to go back to our “Model” mesh and clear off all the editing we have done thus far. So Edit/Step backwards until you get back to where our “Model” looks like this:

Step 18

Now we want to copy this to our Specular file and then place our UV map on top with a 35% visibility so we can see below. Cut out Place a white layer under your UV map and cut out your planter part like this again using the pen tool:

Step 19

Now save to DXT5 ARGB 8 bpp | interpolated alpha. Your Multiplier is now done.


Take a break, Walk around and clear your head, the hard parts are now done. We have one more thing left to do. The Specular.

We’re going to go back to our “Model” mesh and clear off all the editing we have done thus far. So Edit/Step backwards until you get back to where our “Model” looks like this:

Step 20

Add a totally black alpha layer and then save as a DXT5 ARGB 8 bpp | interpolated alpha. Now we are ready for import back into Workshop.

So in turn import each file into Workshop, Overlay, Multiplier, and Specular. Your plant should look something like this:

I will show you how easy it is to make your very own custom painting by your favorite artist using one of the very lovely frames that already exists in your game.

What You will Need:

• TSR Workshop (8.7 or latest release)

• Graphics editing program (I will be using Photoshop CS3 (a good working knowledge is a plus) or the program of your choice.

• DDS plug-ins for Photoshop, current version (installed)
(http://developer.nvidia.com/object/photoshop_dds_plugins.htm). Gimp and Paint Shop Pro also have plug-ins available on the internet.

• Good quality image of your choice or you can use mine. Just right click and save it. But, I do ask that you only use it for tutorial purposes as I’ve already uploaded it for publication on TSR.

I’ll be using one of my favorites, The Waterlily Pond with the Japanese Bridge, 1899 by Claude Monet.

Section 1 - Creating a New Project

We’ll start by opening Workshop (WS) and clicking on Create New Project

In the Create a new project screen select Object and then click Next

You will now find yourself on the Object Clone screen. In the Object By Category section on the left, select Décor/Wall Art. You will see workshop display all the paintings in the game. Remember the only paintings available to clone are the ones with a frame. I’ve selected the Painting still life for my painting. Click Next and you’re on your way.

At this point the Project details screen will pop up. Here you will type in your Project Name, Title and Description. When you are finished with all of your information go ahead and click Next

Your project has now been created and we are ready to customize it. As you can see from the screenshot, your project is opened on the Project tab. It’s a good idea to familiarize yourself with all the sections. It’s in this tab where you can change your project name and description if you find any mistakes and in game categories.

When you’re finished with the Project tab go ahead and click on the Textures tab. You will see a dropdown box called Variation. If you click on it you will see exactly that, how many frame variations (colors) this particular mesh has. There are 3 for the Painting Still Life. Make sure the first one is selected and move on to the next section.

There are several tutorials discussing how to make patterns for the Create-A-Style tool in Sims 3 that are helping many people make great patterns. However, I started out as a total beginner, and was still fumbling with issues such as ‘why channels?’ and ‘how do I add an alpha?’
when other people were seemingly outputting a pattern a minute!!!

If you too are floundering and feel like you know nothing, hopefully this tutorial will help you. After you’ve succeeded with this one, you’ll be able to move on to more advanced stuff. This tutorial is meant for people who still have no idea what they’re doing and need to know WHY they're doing this or that. So it DOES go on a bit. But that's me!

Your pattern

I’m not going to make a pattern from scratch (because that would assume you can paint stuff)! Instead, and because I can't paint stuff either, I’m going to convert an existing texture using a basic select tool to split a brick pattern across three channels (and an alpha) to make the English Victorian brick pattern shown on the right. You can use any pattern (including my brick pattern).

Whatever you use, ensure you start with a pattern that has easy sections to cut out and divide, and is sized 256 pixels wide by 256 pixels high.

Hello!

This tut will teach you how to create your own eye shadow in the simplest way that I know of. We will be editing a Maxis eye shadow (I said it was simple!) and then importing it into the game. I know it's not special, and we're not fiddling around with colors and masks, but it's the core... the basics for the beginners!

You will need:

• TSR Workshop (up-to-date, remember!)
• PhotoShop (I use 7.0)
  
• The .DDS plugin
• Sims 3 (of course!)

We'll start by opening TSR Workshop, and clicking "Create a new Project".

Then this box should come up:

We want to select "Makeup/Facial overlay".

Once it's selected, click next. This tree should come up (it may take a moment to load the info):

When the tree pops up, click Young Adult, then Female, then Everyday. We want to select "afMakeupEyeshadowSweet". This is because we will be creating an eye shadow tail (you'll see what I mean later). Now click next.

This box comes up:

The box I've highlighted is the most important part of them all. Each item you make needs a Unique Identifier. So just add the first letter of your name or any word you like - as long as it's unique (make sure it doesn't have same identifier as another item basically).

Fill out your Project Name, Title and Description in any way you like... it's totally up to you.

Click Next when you're done. When the Finished box comes up, click Ok.

Now your 3D Object preview comes up. On the navigation panel to your right, click the "Texture" tab. Like so:

Then we want to export the Face Overlay into a .dds file. We do this by hovering over the Face Overlay bar and then clicking the small "..." box that comes up. Then this box comes up:

Can you see the similarity between these white smudges and the in-game eye shadow? It's hard to think of at first, but you get the idea. We then need to click "Export". I'd recommend creating a new folder and saving it as "makeup_face_overlay" or something like that. Then just click Save.

This tutorial is a beginner's guide to changing the logos and graphics on Sims 3 clothing using the TSR Workshop and Adobe Photoshop with the DDS plugin. I will only be explaining the steps I use to accomplish this task. If you wish to learn more about the TSR Workshop as it pertains to clothing, I would highly recommend that you read through Sinastra's "In Depth Clothing Re-Texturing Tutorial for the TSR Workshop" as she goes into much more detail about all the different tabs and what they mean. I will be describing only the exact steps I use in this process, but this is a good start for the beginner to learn to create some simple custom clothing.

Begin at the beginning

Our first step is, of course, to open the TSR Workshop. You will start by clicking "Create New Project". This will bring up a new window, we will click on "clothing" and then click "next".

Choosing clothing item to clone.

The next window to appear will show us a tree view on the left with the different ages, sex and categories of clothing to choose from. For this tutorial, I will be using the girls tee with a rainbow graphic on it. As the stencils are already enabled on it, it is a good place for the beginner to start. So first click on child, then female and then everyday and scroll down until you find this shirt, if you wish to follow this tutorial exactly.

Your Project Details

In this step you will create your project name, the title for your item, a description and most importantly a unique identifier. You MUST change the unique identifier so the new item you create does not override the original item!! Do not use the default!! It's a good idea to try and make the name unique as the Sims 3 launcher will not install an item if it has the same name as something already installed. I like to add my name or initials to the project name and identifier. Once you have filled in all the information, click "next" in the bottom right corner. A new window will pop up called "Finished". Just click "OK" in the bottom right corner.

Preparing to Export

The next window to open up shows the clothing item we chose for our project and all the information pertaining to it. For this tutorial, I will not be making any changes to the shirt other than the graphic on the front and the colors of the shirt. So, first select the "Texture" tab at the top, then highlight the "Stencil A". Highlighting this will make the small box with three dots appear to the right. Click on this box.

Exporting the Image

A new window will pop up with the original image. We are now ready to export this image and make it our own. Click on the "Export" button. **The Import button located directly below the export button is what you will click to import your texture back into the workshop**

Saving the Image

Now save the image somewhere it is easy to find. I like to save directly to my desktop, but you can save it wherever it is easiest for you. Don't bother changing the name, just click save. We are now ready to edit the image in Adobe Photoshop. I just leave the TSR Workshop running while I edit the image.

In Depth Clothing Re-Texturing Tutorial for the TSR Workshop

Welcome to my in depth clothing re-texturing tutorial for the TSR Workshop. Before we begin, I would like to stress that this tutorial does not cover meshing. This tutorial is for using existing game meshes (from the base game, no expansion or store-bought items) to create something new.

The steps in this tutorial were done with Adobe Photoshop CS3. Even if you do not use that particular program, please read this tutorial as it still may help.

This tutorial is suggested for beginners, and will walk you through step by step in the creation process. Please bear in mind that re-texturing is rather new to me as well so this tutorial will not be perfect. However, I hope it still helps you with the beginning stages of learning how to create new items for The Sims 3.

If you have any questions or need help with the workshop, please do not comment on this tutorial, but post in our TSR
Workshop forums. There are many people there who will take the time to help you.

The DDS plugin is required in order to open/save the DDS files mentioned in this tutorial. You can get this plugin here

Part 1: Source Images

The first step in the creation process is finding your source images.  Some artists prefer to draw their own clothing ideas, but the majority get their ideas from real clothing. If you plan to re-draw the entire design in photoshop, an image, even a small one, is all you need in order to do so. However, if you plan to literally “copy” the design as well as the texture, you will need higher quality images.

There is no easy way to find these images. All I can suggest is to check the websites of your favorite clothing retailers. Most retailers only show a medium-sized image of the front of a piece of clothing. But sometimes you will get lucky and find a retailer who has high quality images of  not only the front, but the back (and sometimes the sides) as well.

What makes a good source image? If you plan to copy the image, size and quality is important. If you don’t know how to re-draw the item, stay away from source images with patterns. Your design has to look good both with and without patterns in-game.  So a basic fabric is best.

The image on the left is a good example of a basic fabric design. The image on the right, is obviously an example of a not-so-basic design that you should avoid (unless you plan to do a LOT of re-drawing).

Part 2: TSR Workshop's Interface

The second step in creating your clothing is to open the TSR Workshop.

The three menu items listed on the left are pretty self-explainatory. The first item “Create New Project” is what you will choose if you wish to create a new item. This includes clothing, accessories, makeup and hair. The second “Open Project” allows you to open any saved project, and the Third “Recent Projects” isn’t selectable at all -- however, all your most recent saved projects will be listed below allowing you to click and open them easily.

Now it's time to create our project. So click on Create New Project and proceed below.

In “Create New Project”  you are given 4 different project types in which to choose from:

• Clothing
• Makeup/Facial Overlay
• Hair
• Accessory

For this tutorial, we will be choosing Clothing.

Upon choosing clothing, Workshop will then load all the base-game clothing meshes. A selectable tree will appear, allowing you to choose a mesh.

Clicking on any of the plus signs (+) next to the Sim type will give you more options. For this project, we will be choosing Adult > Female > Everyday

From here, we will be choosing a mesh best suited for our source image.

Part 3: Choosing A Mesh

I have chosen the following source images to begin with:

Now I have to look through the meshes and find one best suited for this design. The most important part when choosing a mesh is:

What part of the mesh is extruded?

Or should I say... 

Which part of the mesh is not flush against the skin?

When re-texturing an item, this is the only area (or areas) you have to really pay attention to when choosing your mesh.

For example, with the clothing we have chosen -- do we want the bottom of the shirt to be flush against the body? Do we want it out away from the body some, like shown in the picture? Do we want the skin between the shirt and the stomach to show, or do we want it to overlap the pants? Ask yourself these questions when choosing a mesh.

I have decided that just like the original image, I want the shirt to overhang the pants slightly. Therefore, I have chosen the following mesh:

The mesh could have been a turtleneck and it wouldn’t have mattered (unless you plan to re-use the original images and just edit), just as long as the extruded area were were the shirt overlays the pants. ANY area flush against the skin in ANY mesh can be changed. You can take away sleeves, add a v-neck, add straps, whatever you want to - as long as you pay attention to the extruded areas.

Part 4: The Project Interface

On the next screen you are greeted with some options. Yay! You can either put these in now, or add them later before you save your design.

If you know what your design will be and what it will be called, I suggest putting these in now so you don’t forget.

• Project Name
  This is what you want your project to be known as (on your computer). When saving your workshop file, the workshop will automatically fill in this name as your project when saving.
   
• Title
  The title you want people to see when loading your finshed project into the game.
   
• Unique Identifier
  This is very important. All other slots can be filled out incorrectly, but not this one. EVERY project you make MUST have a different unique identifier. Hence the “unique” part of it. If you were to have two items in your game with the same identifier, only one would load. Never use the default.
   
• Description
  Self Explainatory. Describe the item as good as you can here.

On the next screen after putting in your details (or skipping it), your mesh will load. In the case of the mesh I have chosen, this is what I see:

A - This area is where you can change the view of your mesh. Using Pan you can move your mesh up, down, left or right. With Zoom, you can use your mouse buttons or scroll wheel to zoom in and out, and with rotate you can click and drag with your mouse buttons to rotate, all the while  being able to zoom with your scroll wheel.

B - There are three tabs here that each have different screens with different options. The project tab allows you to set the title, description and unique identifier of your item as well as choosing the Sims that can wear it, its categories, and extra options. Texture allows you to choose the images used in your design, and Mesh allows the importing and exporting of meshes.

The Project Tab:

C - Here you will see the main part of the project tab. In this first area you can enter the title and description of your item if you skipped it (or if you want to change it). You can also choose which Sims can wear the item.

D - Clicking the plus icons (+) will give you even more options.

When re-texturing clothing, do not change any of the options for “Type”.

Clothing type should be pretty self-explainatory. Usually, there is no need to change this option.

Categories should also be fairly self explainatory. Checking these boxes will tell the game which categories your item needs to be in. Choosing more than one will put the item in multiple categories. For this shirt, I will be unchecking Formalwear and Sleepwear.

In Extras, you can change your Unique Identifier (file name) as well as specify your own custom launcher thumbnail. Just create a 64x64 image with a preview of the image with your name and/or logo and you can select it through this option.

The Texture Tab:

On the next tab, the Texture tab, is where you will spend most of your time when re-texturing meshes. It may look overwhelming, but once you figure out which each item does, working with them will be a breeze. Not all items on this list will be explained - as the Workshop is new to me as well, there are a few areas I am unfamiliar with. However, it should not effect your ability to re-texture clothing. These other areas will be added in time when I learn their significance.

• Overlay - You won’t always use this. Only use the overlay when you want to have an unchangable area of your design. For example, the buttons on a pair of jeans.
   
  Important Note: In some cases, the mesh you are using will come with an overlay. If you want to remove it, simply create a transparent 4x4 .dds and put it in it’s place.
   
• Mask - This is used to define which parts of your design are recolorable. Just like in patterns, each part of the recolorable
  design is red, green, and blue. There is no 4th color alpha layer option here.
   
• Multiplier - This is your base texture. It will include the shape of the clothing, the texture, including wrinkles, stitches, or anything else you want to add to your design. Be sure to add an alpha layer to define the areas you want your design to appear.
   
• Clothing Specular - This definies how reflective your texture will be. You will simply copy your multiplier in your graphics
   program (with a new file name) and adjust the brightness/contrast of the image. The brighter the more reflective, the darker the less reflective.
   
• Pattern A, B & C - This is where you choose how many recolorable areas are in your design by enabling Patterns A - C. Pattern A is the red channel, B is the green channel, and C is the blue channel. You can set colors as well as patterns to use here as well.
   

• Stencil A, B, C, D, E & F - These stencils can be used for logos or other designs you wish to place on your clothing that you do not wish to be recolorable.

The Mesh Tab:

As explained before, the third tab listed is the mesh tab. However, we will not be doing any meshing in
this tutorial.

Part 5: Exporting Project Files

On the texture tab, when beginning a new project, you begin by exporting your project files (if you plan to use them as a base or reference). We will be exporting the following files:

• Mask
• Multiplier
• Skin Specular

We will be using the skin for reference.

To export the images, click the name of the item you want to export. With it selected, you will see a small button to it’s right with “ ... ”

Click the dots, and the following window should appear:

Depending on what you are exporting, the image won’t always be the same. Click the ‘Export’ button, and save it to your hard-drive in easy to find location. Make sure to save it appropriately, so you know which file is which. For example, as this is the mask file, I would save it as: tank_mask.dds

Do the same for the other images I said to export, Mask, Multiplier & Skin Specular:

• tank_mask.dds
• tank_multiplier.dds
• skin.dds (we won’t be importing the skin back in)

Continue to page 2 for the next part of the tutorial...

In this tutorial I'll show you how to use Photoshop's pen tool to extract a Sim, or an object, from a screenshot taken with the Sims 3 in-game camera. This tutorial is aimed at intermediate Photoshop users who maybe just aren't quite sure what the pen tool does, or how or why they should use it.

Needed tools:

• Photoshop (any version, however "Elements" versions may not have the pen tool, which is required for this tutorial)

But first, why do we want to use the pen tool? Why not just put your Sim or object against a plain background?
It's a good question, it's really quick and easy to put a Sim or an object against a plain background and then use the magic wand selector in Photoshop to remove the background. However, this technique can result in a jagged edge, rather than a smooth edge, which won't look as good on previews. The pen tool allows us to create a smooth path to select our Sim or object with.
Also, for pictures of Sims, the best lighting in the Sims 3 game is in Create-A-Sim. Pictures taken in Create-A-Sim will show off your Sim and clothes in the best possible light, but of course we can't have a plain background in Create-A-Sim, so the easiest way to remove the background is using the pen tool.

The Method:

• Open up your Sims 3 game, and take any screenshots you like using the in game camera. Here's the screenshot I'll be using for this tutorial (fig 1):
  
  

    Fig 1

• Decide which part(s) of the picture you want for your screenshot. I only want the Sim, nothing else.

• Open your screenshot in PhotoShop and choose the pen tool.

• Decide where you're going to start from. I'm going to stop at the top right side of the picture, and work round clockwise.

• Now, identify two "corners" to your Sim, or object. By "corner" I mean somewhere where the edge changes sharply, rather than in a smooth curve. Click once on each of these first two corners, and anchor points will appear on them, as shown in the picture below (fig 2).
  
  

    Fig 2

• Of course, the edge of the Sim betwen these two points is not straight, so we need to adjust our line to make it match. You can add a curved anchor point anywhere on your path just by clicking. So here, I'll add an anchor point halfway between the first two points, like in this picture (fig 3):
  
  

    Fig 3

• The points are still a straight line, but now we just hold the CTRL key, and click and drag the new point into position. The line will automatically curve in between the three points (fig 4).
  
  

    Fig 4
 

• You may need to add many anchor points to make your path match the curve of your Sim or object. If you add an anchor point then decide you don't need it, click it again to remove it (fig 5).
  
  

    Fig 5

• Sometimes, you might add an anchor point which makes your path stick out a long way from the edge of the Sim or object you're trying to cut out. This isn't a problem - as you can see below it's easily fixed just by adding more points, holding CTRL and dragging them into place (fig 6).
  
  
        Fig 6
  
  

• Continue in the same way - identify the next corner, click it, then add anchor points between that and the previous corner, and drag them into place until they match the curve. When you get back round to where you started, click on your first point again to complete your path (fig 7). If you need to adjust your path after you've closed it, hold CTRL and click on it - this will 'reactivate' your path so you can continue to add more points.
  
  

    Fig 7

• Now you have the outline of your Sim or object, but what if they have some extra gaps that we need to cut out? This sim has a gap under her arm, and some between her fingers (fig 8).
  
  

    Fig 8

• Simply click on the first two corners of one of the gaps, and create a path for the gap in the same way as you did the main outline (fig 9).
  
  

    Fig 9

• Here is my finished set of paths. I've added a path in the gap under her arm, and more around the fingers (fig 10).
  
  

    Fig 10

• Now, open the "paths" panel. This is usually on a tab near the "layers" panel, but if it's not you can also select it from the Window menu.
  

• Click this button (shown by the arrow in fig 11) to turn your paths into a selection.
  
  
      Fig 11
  
  
  (Note: if this doesn't select everything you wanted it to, hold CTRL and SHIFT, and click on each of your paths in turn to "select" them all, then press the button again.)
  

• Copy and paste your Sim onto your preview picture. Check the edges to make sure you're happy with how it turned out. If they're not, go back, and CTRL + click on a path to 'reactivate' it for futher editing, and make any changes you consider necessary. This is my finished cutout (fig 12) (keep reading for more tips!):
  

      Fig 12

  You can also see my finished cutout in her preview picture by clicking here.

Additional Tips:

TIP: When you add an anchor point you'll notice a straight line with two dots on the end appearing. The line is a tangent to the curve, and these dots are called "handles". You can move the handles to change the angle of the curve at this point. The best way to find out how this works is simply to do it! Create a straight line, add an anchor point in the middle, and see what happens when you adjust the angle and length of the handles.

TIP: A unique preview that stands out will really show off your work at its best. For ideas, look through the downloads area of TSR, and study those screenshots which catch your eye. A good example of an excellent preview style is Murano. Notice how he maintains a consistent style, which means his work is instantly recognisable, but at the same time shows off his work in an interesting and eyecatching way.

About This Tutorial

This tutorial has been created by Joshua "Flobi" Hatfield of flobi.com for the wonderful folks at thesimsresource.com.

The purpose of this tutorial is to take an image with 4 layers and create a viable The Sims 3 pattern having each layer representing each of the 4 recolorable colors by their opacity. This is designed to be an in-depth tutorial giving precise step-by-step instructions.

For this tutorial, I am using my wavy-grid-illusion pattern which I have posted on thesimsresoruce.com. I have taken my blue channel and changed the color in the original to black so that you can see that this will work no matter what color the original layers are as the tutorial is based on the opacity and not the color or brightness. Note: Using this tutorial, each layer represents a single color in the final package based on the opacity of the layer. The actual color/hue/brightness/etc. of the layer is irrelevant, only the opacity is used.

Prerequisites

You will need the same things to follow this tutorial as you needed following Pegasussims's wonderful tutorial; nothing more, nothing less. Before starting, you should visit that tutorial and take the time to install the DDS plugin from Nvidia which will be required near the end of this tutorial.

Extracting the Layers into Luminance Maps

The first thing we need to do is to extract the layers each into their own image file so that we can convert them to a luminance map. Begin by creating 4 images that are 256x256 with a black background.

1. Open a new image: Click File->New... or the new image button on your toolbar, or type CTRL-N.
2. Use all the settings in the image above and, click OK to create the new image (The Color is black, #000000).
3. Repeat (steps 1-2) three times so each layer will have its own image.

Additionally, make sure you have also opened your original image with 4 layers. Again, for this example, I am using wavy-grid-illusion.pspimage.

In the image above, I have selected the whole image, but the selected layer extends past the canvas, so you do not see the selection border.

1. After opening and focusing the source image, CTRL-A to select the whole image.
2. If the selected layer extends past the canvas, use Selections->Clip to Canvas to shrink your selection to only the canvas size or the layers will not line up correctly.
3. Select the bottom layer and copy it using CTRL-C. Do not use CTRL-SHIFT-C as that will copy a merged version of the entire image.
4. Select one of your new images and paste it in there using CTRL-V.
5. Repeat this for each layer (steps 6-7), copy/pasting each layer into a seperate image.

You can see the results below in Image3 and Image 4. Image 3 appears totally black because the content of that layer are black and the background is also black, you can see later that this layer will become visible to you. (Image1 and Image2 in the image below are results after steps 9-11.)

After copying each layer to its own image, we need to make the color of that layer white (in the image above, this has been done already for 2 of the images). I investigated a number of ways to do this and the one here seems to be the easiest.

1. Focus the first new image (make sure the pasted layer is still the active layer).
2. Click Adjust->Brightness and Contrast->Brightness/Contrast... (shown above)
3. Set the Brightness to 255 and the Contrast to 100 (shown below) and click OK.
4. Repeat (steps 9-11) for the other 3 new images.

In the images above and below, you can see that this has been done for two and note the difference in the third where the previously black layer has been converted to white.

When finished, all layers should appear in black and white as shown below.

1. In turn, select each of the 4 new images, then Layers->Merge->Merge All (Flatten) (shown above).

1. In turn, select each of the 4 new images, then Image->Greyscale (shown above).

Now, all of our layers have been converted to luminance maps. For 3 of them, we can combine using the Combine from RGB function. The fourth we will force into the Alpha channel of the image.

Putting the Luminance Maps Together

The lowest three layers of the image are going to be put into the red, green and blue channels of our final image. Red is the bottom most color, green on top of that and blue over green.

1. Click Image->Combine Channel->Combine from RGB... (shown above).

1. Select the luminance image of the bottom-most layer for the Red channel source.
2. Select the luminance image of the second from the bottom layer for the Green channel source.
3. Select the third from the bottom as the Blue channel source and click OK.

In the example above, you an see that mine are Red => Image1, Green => Image2 and Blue => Image 3. This very likely may not be the numbers as they appear in yours, so pay attention that you map your lowest layer to red, next up to green and above that to blue. The top layer will be mapped to the alpha channel later.

Above you can see results do not look like the original image. This is okay. Additionally, you can see that the top-most layer is not represented visually at all. It won't be visible in this image, but rest assured, we'll get it in there. We're not trying to get it to look good in PSP (you should have done that before starting), we're trying to get it into a format that the DDS exporter will understand.

Now, for the final layer, we are going to create a map and assign that map to the alpha channel of the final image.

1. Select the luminance image of the top layer.
2. Click Layers->New Mask Layer->From Image... (shown above)

1. Check Source luminance and uncheck Invert mask data (as shown above) and click OK.

A new mask layer should appear and be selected. With that mask selected...

1. Click Layers->Load/Save Mask->Save Mask To Alpha Channel... (show above)

I found this perticular step a little tricky when I was coming up with it, so pay attention.

1. From the popdown, Add to document (shown above), select the final image (which was created by Combine from RGB earlier).
2. Enter Alpha in the Name.
3. Click Save.

Because this is not visually represented on the screen, you can check the image information (Image->Image Information... after focusing that image) to see that there is now an alpha channel.

The only thing left is to save the file into DDS format. If you haven't already, install the DDS plugin. You can find directions at the top of Pegasussims's wonderful tutorial. 

1. Focus the final image and click File->Save, click the save icon in the toolbar or type CTRL-S to save.
2. Select DDS * (*.dds) from the Save as type menu (shown above).
3. Give it a File name (with a .dds extension) and click Save.

The options in this menu above are the default options. I do not know of any reason to change these options and am not familiar enough with any of them to give further input on them. I would ignore them if I were you.

1. Click Save (shown above).

Open the The Sims Workshop

Open the DDS file in The Sims Workshop. (I see no need to replicate the manual instructions on importing DDS files into TSW as they are already clear there.) Below, you can see this pattern with colors assigned.

For those curious in the effectiveness of the layering ability provided by this tutorial, I recommend you check out these images: bottom layer, bottom 2 layers, bottom 3 layers, all 4 layers (I used yellow for the alpha layer).

Additional Considerations

• For a three-layer only file, the luminance image for the 4th layer is not needed, nor are any of the steps involving it.
• For a two-layer or single layer file, three luminance images are still needed, however, leave the unused ones black. You will still need to apply greyscale to the unused ones and possibly flatten.
• If any pixel in the original image is not fully opaque, the Background fill color (in TSW as shown above) will show through. This can be used as a 5th color. This 5th color, however, cannot be changed in CAS in the game. If you are clever, you can use that to your advantage to insert texture in a reliably determinable color.
• Do not apply transparency directly to the merged RGB image (i.e. in a way that is visible on the screen), this will disrupt the RBG values in the DDS export and probably leave Background fill color borders around the transparency. Only apply transparency through the Save Mask To Alpha Channel... functionality.

Credits

I would like to thank the following people/groups without whom this tutorial would not be possible.

• Pegasussims, whose wonderful tutorial taught me so much in the process of getting here.
• All the people who worked on The Sims 3 Workshop. This is a wonderful tool and I am so excited to be able to use it to create and share with the community.
• The whole thesimsresource.com community who kept me entertained, occupied and informed in the terrible delay waiting for TS3 to come out.
• NVidia, I'm sure, who let us use the DDS plug-in for free.

• The Gimp (freeware) - http://www.gimp.org/. You’ll need version 2.6 or higher.
• DDS-plug-in for Gimp - http://nifelheim.dyndns.org/~cocidius/dds/ (use the win32 binaries link under downloads, and place the extracted dds.exe file in the Gimp plug-in folder, usually located at C:\Program Files\GIMP-2.0\lib\gimp\2.0\plug-ins).

For this tutorial it is assumed that you already have some basic knowledge about how to work with the Gimp.

Patterns in Sims 3

Patterns in The Sims 3 make use of the 4 channels red, green, blue and alpha. The channels themselves are grayscales, and work as a mask. A pattern can use 1, 2, 3 or 4 channels.

There are basically two ways to create the channels: the direct method (working directly in each of the channels) and the indirect method (working on a base image and use the RGB channels of that image as the channels for your pattern.

Patterns with only one color (light and dark versions of one color) can be made very well with the (easier) indirect method. Patterns with 4 color channels must be made with the direct method. Patterns with 2 or 3 channels can be made with both, but it depends on the type of pattern which method will give the best result.

In this tutorial we will start with the more simple indirect method, and move on to working in the channels themselves later on.

Creating Channels – Indirect method – One color

First will be explained how to use the indirect method for patterns with 1 color.

• Open Gimp and create a new 256x256 image.
• Create your pattern. Since it’s a 1 color pattern, it will need to have lighter and darker shades of grey. Make sure the pattern is seamless. As an example is here a built-in pattern of Gimp used (fig 1).

   Fig 1

Everything in the pattern that is white, will fully take the color that is used for the pattern. The more darker grey it is, the less it will take the color that you choose for the pattern.

• Choose a pure red as foreground color (255,0,0).
• Select Bucket Fill – Mode: Multiply.
• Fill your pattern with pure red (fig 2).

   Fig 2

• Save your file as DDS: Compression None - Format RGBA8 - Generate mipmaps (fig 3).
• You can now start Sims3Workshop, import your DDS file there, and choose the color that you want to use for this pattern.

   Fig 3

Creating Channels – Indirect method – Two or Three colors

When using 2 or 3 channels, you’ll need to work with layers. Make sure you have the window for layers open in Gimp (Windows > Dockable Dialogs > Layers).

• Add 1 or 2 layers, depending on the number of colors you want to use for your pattern.
• Create each part of the pattern on a different layer.

Here you see the base of a pattern that will have 3 color options (fig 4).

   Fig 4

• Color the layers red, green and blue (when using 2 channels use red and green). Always use red for the background and green and blue for the layers above that (fig 5).

   Fig 5

• Merge the layers down to make it a one layer image (Layer > Merge down)
• Save your file as DDS: Compression None - Format RGBA8 - Generate mipmaps.

Working directly in the channels

As long as you’re using solid colors in you pattern, a 2 or 3 channel pattern can be made with the indirect layer method without too much problems. But when your pattern has parts that are not solid, the red, green and blue channel can get mixed up, resulting in parts of the pattern that will take for instance a bit of both the colors in the green and blue channel . In that case it’s best to work directly in the channels. In the Gimp you will need to decompose the color channels into layers to be able to do that.

• Create a new 256x256 image.
• If you want to use 4 channels, you’ll need to add an alpha channel. To do that, choose Layer > Transparency > Add Alpha Channel (fig 6). If you want to use less than 4 channels, you can skip this.

   Fig 6

• Decompose the color channels into layers. (Colors > Components > Decompose) (fig 7).

   Fig 7

• Choose RGB if your pattern will have less than 4 channels, and RGBA if you want to use 4.
• Check the “Decompose to layers” box (fig 8).

   Fig 8

You now get a new image with 3 or 4 layers, called red, blue, green, and alpha. You can only work in grayscale in these layers.

Create the different parts of your pattern in each of the layers, and keep in mind that white parts will fully take the color, black will be fully transparent (it will let the channel below it show it’s color and for the lowest channel(red) it will show the background), and grey will partly show the color. Don’t use transparent parts when working in the decomposed channels, only black, white and grey (fig 9).

   Fig 9

Since you can’t work with transparency in the decomposed channels, it is easier to create the base of your pattern in a different image, with each part in a different layer, and copy those parts into the decomposed channels. That way you can use transparency while designing your pattern. Make the decomposed channels completely black before you copy your pattern on it, and invert the black/white of your pattern if needed (Colors > Invert). Here is an example of a 4 channel pattern, with the original design in a different image, and each part of it copied into the decomposed channels.

When you’re ready with creating each part of your pattern, you’ll need to compose the channels again, to make the decomposed channels work again as red, blue, green and alpha channels.

• In the menu choose Colors > Components > Compose (fig 10).

   Fig 10

• Choose Color model RGB if it has 3 channels, and RGBA with 4 channels. Don’t change the other settings (fig 11).

   Fig 11

At this point the result you get can look very strange, especially when you have used the alpha channel. The color channels will also not look like you just made them when they were decomposed. Don’t worry, the end result will be ok.

This is for instance how the composed image of the earlier example and it’s red, green, blue and alpha channels looks like (fig 12).

   Fig 12

• Save the compose image as dds file (you need to have the dds-plugin for this).
• Use Format RGBA8.
• Select "Generate mipmaps" (fig 13).

   Fig 13

You can now import the dds file in The Sims 3 Workshop (fig 14).

   Fig 14

The RGB mask Image can first look strange in The Sims 3 Workshop, but as soon as you have assigned colors to each of the channels, it will look like the pattern you designed (fig 15).

   Fig 15

Additional Gimp tips

For making seamless patterns, it’s often helpful to turn the grid on, and make the grid fitting the 256x256 size.

• Choose Edit > Preferences > Default Grid.
• Change Spacing Width and Height to 8 pixels. (The grid will only change for new images! Existing images will keep the grid they had).
• Choose View > Show Grid and/or View > Snap to Grid.

Test the seamlessness of your image by Tiling it.

• Filters > Map > Tile ( 1024 is a good size to test for seamlessness).

You can change the layer and channel preview-size , to give you a better view on how they look.

• Click on the little triangle in the upper right corner of the layer/channel window.
• Choose Preview Size > Enormous.

When you want to turn a colored image to a grayscale, you can tweak the way it is done.

• Colors > Desaturate. You can choose between Lightness, Luminosity or Average. The best result will for patterns often be the one that gives you the most contrast.
• If the grayscale doesn’t give enough contrast, you can tweak it further by using Colors > Brightness-Contrast.
• If that’s still not giving the wanted result, you can also use Colors > Curves. Grab the curve and move it to get the result you want to have.

I do not use alpha masks, therefore I stick to a maximum of three colors. With alpha masks you have more control over your colors (which I would prefer if it didn't confuse the heck out of me. So, if you know how to use 'em, use em!), but I like this method just fine.

Before we get started...

To use this tutorial, you need the following programs / plugins:

1. Adobe Photoshop (I use CS2 in this tutorial).

2. TSR's TS3 Workshop

3. MV's Color Replacer Plugin (for PS)

Lets Begin...

In this tutorial, I will be using the following image as an example. I recommend using this image while reading this tutorial so you can work step by step along side me.

As you can see, my starting image is not 256x256. 400x400 or above is my preferred starting size (and you'll see why), but 256x256 will do as well.

1

When you have the pattern you want to use as custom content, open it in Photoshop. Always double check your pattern to make sure it is seamless and will properly tile in the game.

2

Do the following to your image:

Image > Adjustments > Desaturate

Image > Adjustments > Invert (This can be skipped if you prefer, but 99% of the time I invert).

3

With the above image, our goal is to have THREE colorable palettes as there are three colors, so:

Adjust the brightness and contrast of your image until more than one shade is distinguishable (Image > Adjustments > Brightness/Contrast).

4

IMPORTANT! Remember the following order for recoloring:

Always add color in the following order: Red - Green - Blue

Red is the base, which should always go on the 'background' of the image. The base color for this image would be the lighter of the greys.

Green is the next lowest color, followed by blue, the highest.

5

In this step we will be using the color replacer plugin. If it is properly installed, you get to the plugin by going to Filters > MV's Plugins > Color Replacer

A box should pop up.

Your cursor should be an eyedropper. Select the first color you want to replace, which is the lighter of the greys. On the lower of the color boxes, click it and select a red color.

Tolerance is VERY important. Make sure to use that slider to get the effect you want. If it is not high enough, your color may not all be selected. But don't OVER slide it, as at full strength it will cover the entire image.

Use the slider until your red is only covering the areas you want it to.

Hit OK before using the plugin again to do your next color.

Note: If it refuses to stick to one area, your Brightness/Contrast was not good enough and your shades are too close together.

Repeat this step for the next two colors.

Green will be the petals, blue the center of the flower.

Not exactly the prettiest picture in the world, but it is for a purpose! This is why I start with 400x400 or above. The color, especially around the circle of the flower is a little rough, but because my image is larger than 256, I can resize it and it should smoothen everything out.

6

Resize your image to 256x256

Not perfect, but should be good enough to move to the next step. (You can spend some time touching up the rough spots if you'd like -- normally I would, though most of the time my results are not rough like this. But of course it happens with my tutorial image, eh?).

Save your image as a PNG and open it with TSR's Workshop tool

This is what you should see after opening your image.

Select Red, Green, and Blue. Click each box to choose the colors you want to appear on the initial pattern.

7

Click 'Show as tiled' when you are finished, and double check to make sure the image tiles correctly.

Sweet! If everything is to your liking, Add a title and a description, and be sure to put the item in the right categories. By default it starts up with Abstract > Cloth. Occasionally I'll forget to change this :(

Once everything is set, click the 'Upload to TSR' button.

8

This step is very important. It can be tedious to do for every pattern, but you should not skip it. TEST your patterns. (I have had patterns not install in the launcher or patterns that installed fine for me but did not work for people on TSR, so check them!) 

Go to your TSR submissions page: http://submissions.thesimsresource.com/submissions/

Check 'Get It From my File Storage' and find the .Sims3Pack you just uploaded. Once complete (when it takes you to the edit page), go to the Uploads tab and click the magnifying glass next to your submission.

On the next page, click the Icon to download the .Sims3Pack file and open it with your launcher.

Did it work?

9

Test it in game. It is always important to test everything before submitting to TSR as you cannot edit submissions once they are approved. This is also a great time to take screenshots for preview images!

Bright, but very pretty! Success!

10 

Make sure to edit your page details -- put in an appropriate Title, Description, and be sure to note how many recolorable palettes are in the pattern -- and of course, create a preview image, as it will make your submissions look that much better.

Hope this tutorial helped!

Subtitles

The video tutorial comes along with English and German subtitles. It also allows you to translate one of these into your own language using the Translation feature.

Software used

• Illustrator CS3
• Photoshop CS3
• TSR Workshop
  

Installing DDS Plugin

You have to download the Photoshop DDS plug-ins here: http://developer.nvidia.com/object/photoshop_dds_plugins.html

Click on Download Current Version to download the file and then install it.

If your Photoshop is in English the installer might have chosen the right destination in the Photoshop directory for the plug-ins. If it’s not then you have to translate the folders name to know where to move the plug-ins to. The correct folder should be C:\Program Files\Adobe\Adobe Photoshop CSX\plug-ins\file format

Help

Please use the TSR Forums for getting help regarding this tutorial.

Special Thanks go to MsBarrows for her guidance, patience and know how.

What you will need to complete this tutorial:

• Paint Shop Pro - In this tutorial I used PSP X2
• If you are using Paint Shop Pro X2 you will need to download Nividia DDS V3.02 from www.fpsbanana.com/tools/download/650
• If you are using Paint Shop Pro XII or earlier you will need to download the latest Nividia DDS from http://developer.nvidia.com/object/photoshop_dds_plugins.html

You will need to make a file called PlugIns under C:\Program Files\Corel\Corel Paint Shop Pro Photo X2\PlugIns (You will be able to do the same with the older version of PSP, your address will just read a little different then mine.) You will need to place a copy of the DDS PlugIn in this PlugIns folder.  If your DDS was downloaded as an .exe file, it should install to this folder.

If you are using PSP X2, you will need to enable your plugins if you haven't already.  You do this by going to File - Preferences - File locations.

Under File types, click on Plug-ins.  Under Plug-in File Folder, uncheck Limit load plug-in to those with an .8B? extension only.  If the location of your plug-in file isn't listed, click add and find the location.  Under the folder options make sure Enable and Use Sub Folders are checked.

After completing this tutorial you can continue with Murano's Sims 3 Workshop Pattern Plug in Manual.

This is Where We Start

Important fact for you to remember when working with the color channels and the alpha channel:

• Black = invisible
• White = visible
• Gray = Transparent.

Open your pattern in PSP. Goto Image - Resize. Under Pixel Dimensions make sure you are set to pixels.

Under the “New” column type 256 for width.

It should change both width & height, if not under the advanced setting you will need to un-check the “lock aspect ratio”.

Click OK. Now your image is 256 x 256, the size needed.

When I made my pattern, I made sure it would tile properly. I also made it with Red, Green, Blue and White. This was just to make it easier to make the color channels. Once it is completed and installed into your game, you will be able to turn it to any colors you want. You will want to make any alterations that you want to your image at this time to insure that it is tilable.

To make the Red channel

Click on Layer - New Adjustment Layer - Channel Mixer.

Since we are making the Red channel, slide the Red slider all the way to 200. Slide the Green and Blue to -200.

 Before hitting “OK” click on the “General Tab” and type in the name field “Red”.

Now click OK.

Click on the “eye” (visibility toggle) of the Red channel layer. You don't want to see this layer when making the other channels. You will do this after every channel layer you make.

Repeat this process two more times. Once for the Green channel and once for the blue.

For the Green channel the sliders are as follows:

• Red: -200
• Green: 200
• Blue: -200

For the Blue channel:

• Red: -200
• Green: -200
• Blue: 200

Don't forget to change the name on the General Tab. If you do forget it is not a big deal as you can change it on the layers palette.

Now that we have made the color channels it is time to make a mask. In the layers Palette make sure you have the background layer selected. Goto Layers - New Mask Layer - From Image.

In the add mask from Image window you will see your pattern name. Make sure “source Luminance” is checked.

At this point you will want to take a good look at your mask. Any areas that are gray will be partly transparent. For this image I used the Flood Fill tool with black to fill in the gray areas. As you fill them in they will become more transparent.

With the mask layer highlighted in the layers palette, go to Layers - Load/Save Mask - Save Mask to Alpha Channel.

Type Alpha in the name field and hit Save. You will not see anything happen after you hit save. At this time make the mask invisible in the Layers Palette.

If you are using Paint Shop Pro X2, you will want to go to File - Save as. Under file type you want to select dds. I didn't change any of the settings on the pop up screen, I just hit save.

At this point please proceed with Murano's Tutorial Sims 3 Workshop Patterns Plugin Manual

If you are using Paint Shop Pro XI or older you can proceed with Murano's tutorial How to create a RGBA Stencil Mask starting at the Save as dds point. Then continue on to the Sims 3 Workshop Patterns Plugin Manual.

You have to download the Photoshop DDS plug-ins here: http://developer.nvidia.com/object/photoshop_dds_plugins.html

Click on Download Current Version to download the file and then install it.

If your Photoshop is in English the installer might have chosen the right destination in the Photoshop directory for the plug-ins. If it’s not then you have to translate the folders name to know where to move the plug-ins to. The correct folder should be C:\Program Files\Adobe\Adobe Photoshop CSX\plug-ins\file format

Concept

A pattern in The Sims 3 has four channels to hold mask information. These are Red, Green, Blue and Alpha (RGBA) where every channel can save a greyscale image. The following pattern (fig 1) is going to illustrate the concept of stencil masks, not the making of the pattern itself.

    Fig 1

Let’s break up this pattern in its colour layers (fig 2).

    Fig 2

Now we sort these layers in channels and making them greyscale, so they work like alpha masks for the colours. White is fully opaque, black is invisible and greys are transparent (fig 3).

    Fig 3

Create the RGBA Stencil Mask

Open a new 256x256 pixel RGB/8 document (fig 4).

      Fig 4

Change to the Channels tab and add an Alpha (fig 5), since there are four channels in this pattern. You don’t have to add the Alpha channel if you have only 3, 2 or 1 channel used for your pattern. Don’t delete any of the RGB channels. Photoshop won’t like that.

    Fig 5

Copy/paste each of those masks in the correct channel (fig 6).

    Fig 6

With Alpha visible the image will look something like this (fig 7).

     Fig 7

It looks odd but this doesn’t matter as long the masks in channels are correct.

Go to Save as… and choose the D3D/DDS (*.DDS) file format with Alpha channel enabled. Hit Save and the DDS plug-in dialog pops up. Choose the DDS internal format 8.8.8.8 ARGB 32 bpp | unsigned from the drop down list and click Save (fig 8).

    Fig 8

You’re done!

Now move on and import the DDs into the TSR Workshop Pattern Tool!

Note: Almost all kind of meshes in the Sims 3 do have a Stencil Mask. This time they don’t hold colours but are the mask for patterns to compose the final mesh texture.

   Fig 1

Click the folder icon to browse and open your DDS texture (fig 2). Learn how to create a DDS texture for the Pattern Tool here.

You can also import PNG and BMP files if the DDS file format is too advanced for you at this moment. Note that PNG and BMP can only save 3 channels.

  Fig 2

You should see your DDS/PNG/BMP texture appear in RGB Mask Image (fig 3).

  Fig 3

You know from your graphic program how many channels there are. In this example there are 3 channels. Therefore the Red (1), Green (2) and Blue (3) need to be ticked. Alpha (4) not (fig 4).

  Fig 4

Choose a colour for your first channel by clicking in the white square or by pasting a Hex-colour in the appropriate field.

  Fig 5

Repeat this for the other ticked channels (fig 6).

  Fig 6

You might want to choose a different Background fill if your Red (1) channel isn’t fully opaque (fig 7). Not required for this example.

  Fig 7

You can see the results of your colour changes in the preview window (fig 8).

  Fig8

Fill in the Title and Description and choose the Category and the Surface Type (fig 9).

  Fig 9

Upload Option 1

If you wish to upload your pattern directly into your Filestorage at TSR for easy publishing to the community, click Upload to TSR (fig 10).

  Fig 10

The first time you do this you’re asked to fill in your Name, Website URL (TSR profile link), TSR Email and TSR Password in CreatorDetails. Check ‘Do not ask next time’ if you don’t want to see this window again (fig 11).

  Fig 11

Log in to The Sims Resource and click Sims 3 Submissions in the top bar. Under the Filestorage tab you should find your pattern and can there submit it for publishing on the site.

Upload Option 2

If you want to create a Sims3Pack, click Export (fig 12). If you didn’t use Option 1 before, you have to fill in your CreatorDetails (See Option 1).

  Fig 12

Save your pattern to the desktop (or any other place where you will easily find it again). Double click the Sims3Pack and your pattern is installed into the game.