You clearly put a lot of work into this. +rep
Mods might want to think about stickying this in some forum, or perhaps adding it to
The list of useful threads
Mods might want to think about stickying this in some forum, or perhaps adding it to
The list of useful threads
If I helped you out, be sure to throw me a +Rep!
-
My Soraka Guide | My Review Service
Thanks for the sig, MissMaw!
-
My Soraka Guide | My Review Service
Thanks for the sig, MissMaw!
farllen
<Member>
<Member>
benjack121
<Member>
<Member>
farllen
<Member>
<Member>
benjack121
<Member>
<Member>
farllen
<Member>
<Member>
benjack121
<Member>
<Member>
is already understood as changing the color of the templates, but some will not let me :/ cambiarcelas image as 62 and several more, one could change the color of the image 41 :/, what I do is dye image but with pixlr these pictures as the 62, 64,67,28, etc. .. will not let me change the color :/ help me plis
farllen
<Member>
<Member>
You need to log in before commenting.
For more examples of the kind of mods this guide will allow you to make (or to check out my mods), click here.
Table of Contents
1. Necessary Resources
2. Changing Images
3. Changing Colors
4. Thanks & Credit
Necessary Resources
- Sothink SWF Decompiler (I use 7.4)
* Get the full version as the trial only lets you modify the first couple files.
- Adobe Photoshop CS6 Extended (I use 13.0)
* Or use another program of your choice with similar fuctionality.
* Or use the awesome online photo editor at www.pixlr.com. I will be providing instructions for this below the photoshop ones.
- Skin Installer Ultimate (I use 4.34)
* Or you could install the files manually. Instructions for this can be found online, although using SIU is (imo) much easier.
- These basic templates:
LANDINGPAGEASSETS
DOCKEDCHATASSETS
CHROMEASSETS
BUDDYPANELASSETS
* Since this guide is just a basic mod guide, I'll only cover these four, however there are many more files you could mess around with.
If you have all of the above downloaded and installed, you are ready to make a client mod!
Changing Images
This section of the guide will show you how to change the images in your client to whatever images you would like to use. This takes a lot of words to write down but is actually very quick.
Getting Ready
1. Open up Sothink. Use the explorer on the left to navigate to the LANDINGPAGEASSETS template. Click on it to load it.
2. On the right under Export, click the plus sign next to "landingPageAssets.swf". This will open up to show all of the different file types within this .swf file. Click the plus sign next to "Image".
3. The two files you will be changing are IMAGE 35 and IMAGE 56. Tick the boxes next to these two and click on "Export Resources". Choose a folder to save them in and click OK.
4. Open up Photoshop. Select the gradient tool.
5. Click on the gradient preview on the top toolbar, NOT the arrow beside it. (If you hover, it will say "Click to edit the
gradient").
6. Click on the second preset gradient called "Foreground to transparent". Click on the bottom left box underneath the preview.
7. This will activate the Stops menu beneath the preview. Click on the box next to "Color:". Make the colour black. Click OK. It'll end up looking like this:
8. Give this gradient a name and save it as a new gradient.
IMAGE 35
1. In Photoshop, click File>Open and open IMAGE 35.
2. Go to File>Open and open the photo you want to replace it. Use the Rectangular Marquee Tool and select the whole picture. Copy the picture and paste it onto IMAGE 35.
3. Use the Move Tool to move your picture. If you want to resize/rotate it, go to Edit>Free Transform and click enter once you're done.
* Keep in mind that the left side of IMAGE 35 will be partially obscured, so you may want to place the subject of your picture more to the right hand side.
4. Now right click on one of the layers on the right hand side and select "Flatten Image". This gets rid of the original picture.
**WARNING: Once an image is flattened, clicking Save will automatically overwrite the original IMAGE 35 that you opened up. If you want to save it seperately from the original, use Save As.
5. You will notice that on the right side menu, this photo is labelled as "Background". We don't want this. Double click on "Background" and a box will pop up. Click OK and the photo will become "Layer 0" (number doesn't matter).
6. Click Layer>New Fill Layer>Solid Color. Click OK. Set the color as: #03060B. Click OK.
7. In the right side menu drag "Color Fill 1" below "Layer 0". You should be able to see your picture.
8. Click on "Layer 0". Then on the toolbar below it, find the button called "Add Layer Mask" and click it.
9. Select the Gradient tool. Select your newly made Gradient from before from the drop down menu.
10. Click and drag from halfway down the left side of the picture to the centreish of the picture. You can fiddle with this until it looks the way you want it to.
11. Once you're satisfied, right click on "Layer 0" and select "Flatten Image". Save it!
IF USING PIXLR:
1. Go to File>Open Image and select IMAGE 35.
2. Maximize the picture window to make things easier.
3. Go to Layer>Open Image As Layer and select the photo you'd like to replace it.
4. Use the move tool to make it look how you like. To rotate/resize, go to Edit>Free Transform.
5. In the Layers window on the right, right click on Layer 1 and choose "Flatten Image".
6. Go to Layer>New Layer.
7. Select the Paint Bucket Tool. Below all the tools there is a large black box which shows the main color, double click that to open up the Color Selector. Enter color #03060b and hit OK.
8. Use the Paint Bucket Tool on the image and it should turn all that color.
9. At the bottom of the Layers window, find an icon that is "Add Layer Mask" and click on it (make sure that you have Layer 2 selected).
10. Select the Gradient Tool. Click on the Gradient Preview at the top and select the third one in (black to transparent).
11. Click and hold halfway down the picture on the left side and drag to somewhere around the middle. Play with this until it looks good to you.
12. Once again, right click on Layer 2 and select "Flatten Image". Save it!
IMAGE 56
1. Complete steps 1-4 from IMAGE 35 (but obviously using IMAGE 56 instead). Save it!
*Keep in mind that the middle part of the image will be obscured, so you may want to place your subject to the far right or left.
Switching The Images
1. Go back to Sothink. Click on IMAGE 35 (as in the file name, not the tick box beside it). Select "Edit" from the top toolbar.
2. Below where you clicked on IMAGE 35 is now an "Edit" section. Click on the folder and navigate to your photoshopped IMAGE 35. Open it.
3. Click on IMAGE 56 and do the same thing.
4. Click on "Save" from the top toolbar. This will OVERWRITE the original template file.
All done!
Now you can open up SIU. For those unfamiliar:
1. Click Add New Skin. Click add and navigate to LANDINGPAGEASSETS. Open it.
2. Click Add to Database. Give it a name.
3. Go to Install Existing Skin. Tick the box next to LANDINGPAGEASSETS (or whatever you called it). Click Install on the bottom menu.
And now your client mod is installed!
Changing Colors
This is the boring and annoying part. If you want to skip this and are content with blue, black, red, purple, orange, or green clients, I have provided these templates for you:
BLUE: Just use the LANDINGPAGEASSETS download from above. As you know the client is naturally blue.
BLACK: https://www.dropbox.com/sh/whicognt646jplo/AAAcbdh9yEbL-5l6ucsbIQgla
RED: https://www.dropbox.com/sh/wki20qzcr1d7hwn/AACobMJTUDWexxHVscqv9o1Pa
PURPLE: https://www.dropbox.com/sh/v7y8ub9xzpf3jqr/AAAoNvqe9Pgx59ucduewdo_ya
ORANGE: https://www.dropbox.com/sh/v8u0kk7mhuu50w1/AAB6OQLT8K1svjHWgyLonrO-a
GREEN: https://www.dropbox.com/sh/1oevsdt9fvptq84/AACmXDd7bKqPG96ye2jW-yb9a
Otherwise, here are the instructions.
Set-up
- First, choose your template to work from. I'm going to assume that you are using a colored template (NOT the default/blue) since this will make your life a lot easier.
- Next, choose your exact color(s). It'll be easiest going forward if you know the exact name of your color (i.e. #03060b etc).
- You can edit the four files in each template in whichever order you like. You can use these instructions for all four of the .swf files.
Images
1. Open up Sothink and navigate to the .swf file you'd like to change.
2. On the right hand side click the plus sign next to the .swf file name. This will show you all of the filetypes within the .swf file. The only filetypes we will be changing are the IMAGES and SHAPES. For the purpose of this guide you can ignore the rest.
3. IMPORTANT: We must edit the IMAGES before editing the SHAPES. The shapes use the images so you'll just be giving yourself a headache. Click on the plus next to "Image".
4. Now click on "Image". This will show you thumbnails of all of the images in the .swf file. If you're using a colored template, you'll be able to clearly see which ones needed to be changed from default (since they will be a different color than the rest). Tick the box next to all of these and then click "Export Resources". Save them somewhere.
5. Now the ugh part. You'll have to use photoshop/pixlr etc and manually change the color of every image to whatever you like. I'm not going to provide instructions for this since there are many resources online for changing the colour of a picture or tinting it. Make sure that when you save the newly colored images, you give them the same name as the original (to make the next step easier).
6. Once you have changed the color of every image, go back to Sothink. Click on the name of the first file that you exported earlier and select "Edit" from the top toolbar. This will open up an "Edit" section below the file names. Click on the folder icon and navigate to your newly colored image of the same name. Open it and the image will be replaced. Repeat this process with every other image that you exported. SAVE AT THIS POINT by clicking "Save" at the top and overwriting the template.
Shapes
7. Now on to SHAPES. Click the plus sign next to "Shape" and you will see another list of files appear.
8. Click "Shape" to see the thumbnails. Once again you will be able to tell which shapes need to be edited based on whether they are colored or not.
9. YOU DO NOT NEED TO EXPORT THESE. Just click on a file name and then click "Edit" from the top toolbar. This will open up properties for the file.
10. Different parts of each shape can be selected. You can tell a portion of it is selected if it a sort of grid pattern appears on it like this:
11. Once a part you'd like to change is selected, use the color picker on the left to choose your color (or input the exact color name i.e. #03060b etc)
12. If you mess up and want to to start over, click on "Reset". Once finished, click on "Finish Edit".
13. Repeat this process for the other shapes.
14. Once you're satisfied, save your work again! This .swf file is ready to go!
15. Repeat the above steps for the other .swf files.
16. Now just use SIU to install your four files.
All done!
Thanks & Credit
I hope this guide was helpful for you! If you have questions about any part of this guide, feel free to ask me. Happy modding!
Credit:
dhiullian98 - green & red colors
WarriorCupcake - purple colors
and thanks to Sub Temptation, benjack121, and boombaap for asking me to write this. :)