If this is your first visit, be sure to check out the FAQ by clicking the link above.
You may have to register before you can post: click the register link above to proceed.
To start viewing messages, select the forum that you want to visit from the selection below.
Madame Malkin's (Graphics & Art)Come on into to the mad workshop where SS's finest avvy and siggy makers are hard at work! Make requests here. Also includes SS's art work and portfolios.
Welcome to all SSers with an interest in graphics to Madam Malkin's very own Tutorial centre! Keeping with the Madam Malkins theme, we have decided to name the thread Sewing Lessons.
The objective of this thread is to share. It is for anyone with any background or knowledge of making graphics to give tutorials, tips and certain "cheats" that will help each other as well as anyone who is interested in giving this addictive hobby a try.
It is completely voluntary, that is to say that anyone and everyone is allowed to post a tutorial here. ALSO, we welcome requests from fellow makers who wish to know how to use a function, or to create a certain effect, or simply anything to do with making graphics.
Our purpose? To make sure we're all lookin' spiffy with our snazzy graphics! lol
Rules:
For requesters:
1. Do not post graphics or graphics requests here. We don't make siggies or avvies, we only teach how to make siggies or avvies.
2. Be patient. If you've asked a question, just wait until someone who knows the answer comes along and answers. We don't know everything, but hopefully the accumulated knowledge should be enough.
3. The main thing you should know is that we are here to answer questions starting with "How can I make..." and not "Where can I find...".
4. Before posting, read and make sure your question hasn't already been answered.
5. If you want to duplicate an effect you saw in a certain graphic... ask the maker of that graphic!
For tutors:
1. Try to be CLEAR with your instructions. Make it so that everyone knows what you're talking about.
2. State what program you are using.
3. Name your resources (textures, brushes, fonts, patterns, etc.).
4. Try to post your tutorials in proper English.
We are here to:
- Share tips and tricks of the trade (trade... except we're not making moolah!)
- Learn how to use graphic design programs.
- Tutor and answer.
We sure aren't here to:
- Share icons or banners.
- Share resources (like textures or brushes you may have made).
- Make requests.
- Give feedback on what you may have done.
- Advertise your own graphics thread.
After sales service (lol):
- When using a specific effect taught by someone, be sure to (if not credit) at least give some recognition to the person you learned the technique from.
- This thread is only for posting tutorial requests and tutorials. Comments should be PMed to the specific Tutor.
*Abbreviations:
PSP - Paint Shop Pro (Followed by a number, which is the version of the program)
PS - Photoshop
T - Translatable means it can easily be used on any program
This is one of my tutorials for an icon I made a WHILE back. I think it was back in December I made this. Anyway I hope you find it useful. I'd recommend this for intermediate users because it involves PATIENCE.
Translatable for pretty much any graphics program except MS Paint.
SPOILER!!: Rita Skeeter Tut
1. First, start off with this picture of Rita Skeeter and Bozo.
2. Crop it to something like this:
Label it as "base."
3. Copy the base. Sharpen it (using a filter), then set it to Soft Light @ 100% (or any blend mode that softens the sharpening while still maintaining the integrity of the image.
Label it "sharpen, soft light" so you know what you did to it.
4. Desaturate the base to get rid of the overly-vibrant look. I just used "Color Variations" and set the desat at 50%. You can do it a lot of different ways, though.
5. Next, apply this gradient:
194648 and 1C3A54, made by me. Set it to exclusion @ 77%, label it "exclusion gradient."
6. Apply these two gradients:
Label as "screen gradient 69%."
Label as "color burn gradient 56%."
Both were made by . Don't forget to set the said blend modes and adjust the opacities.
7. Ok, so far, we have this:
Make a new layer right below the three gradients (and above the two base images). Apply these brushes made by someone I don't rember on LJ:
Both in white, label as "brush 1" and "brush 2."
The avvy should now look like this:
8. It looks ew, n'est-ce pas? Copy the layer labelled "sharpen, soft light" and paste it on top of all the layers. Set it to Soft Light @ 100%. Go to Color Variations again, and increase blue by 100%. This is what you get:
9. Text time...I put "t h a t s k e e t e r w o m an " with spaces, in Georgia, black, size 7, italicized.
10. Make a new layer above the text and apply this brush:
In black, at an angle.
1. Crop the image down to a section that you want. I firstly cropped it to a 344*344 square, then resized it down to 98*98
2. Duplicate the base twice (copy one of these and set it as a new image. We’ll need it later on.)
3. Change the original base to grey scale.
4. Set the first copy to Soft Light 100% and the Second copy to Screen 60%
5. Then create two new raster layers.
6. Flood fill the first with a light pink/salmon (#F4CBAA) and the second with a brown (#A56705). Set them both to Soft Light 100%
7. I then took the image from the beginning, the spare one, and set it to Aged Newspaper. I don’t know what that is in PS, but in PSP8 it is under Effects -> Artistic Effects ->Aged Newspaper->25 Years. I set this layer to Soft Light 100%
8. I don’t like the colour of my image at the moment, so I duplicated the brown raster layer and brought it to the top. I then set his layer to Colour(legacy) 25%
9. That’s the image done, but I wanted to put on some text, cause I had a name of a song stuck in my head, and needed to get it out, lol. So I created a Vector layer and added “London Calling in size 5, Be My Valentine font. I then set this layer to Overlay and duplicated it. The duplicated layer I set at 40%.
hi there i asked this in wrong thread a min ago but will try here now
i am trying to enter the icon contest but im unsure of how to be able to make it 100 by 100 at the same time as being 20k or less as on CS2 a 100x100 icon is 29.3 k.
i hope i didnt confuse you as much i did myself.
can anyone explain to me where im going wrong?
thanks
First of all, understand that you can save your graphics as different file types. The ones most commonly used are PNG, JPEG and GIF. JPEG and GIF are usually smaller than PNG (but PNG is really pretty), depending on the quality of the file you .
Using PS (CS3 for me), if you want to save them as PNGs anyway, just: File > Save for Web and Devices > PNG-8 and save.
okay, weird question and hope this is the right place
How can I make the text disappear when I find images that has those overwrite texts on it? Any tips for doing this?
We're really not supposed to remove watermarks, are we? lol but I know when I use an image that has something in it I don't want (like... another person in the background, or smudges on the person's self or watermarks) I usually use the Push or Smudge tool. Push when I use PSP, and Smudge on PS.
Just... zoom in as much as you need, and drag the closest colour over the watermark. Set the brush to a small size, like 2-3 depending on the amount of detail in the picture. After you've done this (you'll need to be very patient), just use the Soften brush, set with a low opacity and go over it to blend it in.
There's probably a better way to do it, but this is how I've always done it. Maybe someone else has another suggestion?
Yearbook Editor-In-Chief Yearbook Head of Graphics
Kelpie
Join Date: Sep 2006
Location: BUE w/ my bff Alyssa
Posts: 23,433
Hogwarts RPG Name: Ian Michael Ashby
Graduated
Since so many people seem to like it....
Booger
So you know that comic book effect I do? Well, I figure it's time I teach you all how to do it. It's super easy.
(here's an example):
Anyway, it's so easy you'll be floored.
Oh, and by the way, I'm using Photoshop CS2
SPOILER!!: Comic Book Effect
1. Open up your image.
2. Change the name of the layer from Background to PHOTO. It will help you keep track of your layers....all two of them.
3. Next, change the levels of the picture (Image > Adjustments > Levels).
The levels I always work from are 60, 0, 220, and you adjust from there. The first number affects how dark the black parts of the image are, and the last number affects how bright the light parts are. You want the dark parts to be fairly dark and the light parts to be fairly bright. Here, I've changed the levels to 30, 0, 150. Just do whatever looks best to you.
See the difference?
4. Next you're going to add the Film Grain effect (Filter > Artistic > Film Grain).
Set the Grain to 4, Highlight Area to 0, and the Intensity to 10.
5. Duplicate the layer and label it HALFTONE.
6. Now we're going to pixelate the image by going to Filter > Pixelate > Color Halftone.
Choose whatever number looks best to you for the Max Radius (the bigger the number, the bigger the dots). The input has to be at least 4. With smaller pictures, 4 works best, but the bigger the picture, the bigger the number you'll want....unless you're zooming in really far.
7. Finally, set the blending mode of the HALFTONE layer to "darken," and you've got your comic book effect!
You can go back and change the size of the dots if you want.
...Sorry the pictures are so small that you can't read the text. I didn't want to stretch the page (I can put up bigger ones if needed).
Anyway, I hope you all enjoy creating your own comics!
- Kelvin
__________________
_______________________________________Professor Ashby is so ninja right now.
Last edited by Ama; 11-16-2008 at 08:20 PM.
Reason: spelling. <_<
Would it be possible to have a tutorial on how to use features such as adjustment layers, gradients etc. and what effects they give? I find myself able to make simple graphics using the simpler effects (darken, multiply, soft light etc.) but I have no idea on how to use the other features and what outcomes they will have.
I hope I'm not being too confusing...
EDIT: Also, what are 'curves layers' and 'colour adjustment layers'?
Thanks, Laura xxx
Hey Laura, this is a great question and I know that a lot of people who are just starting out with the more advanced programs are curious as to what each layer means. A lot of the time, people discover the results on their own, but there is a GREAT tutorial posted at Photoshop Tips and Tutorials. I couldn't have explained it better:
Quote:
What is an Adjustment Layer?
We can think of them as transparencies lying on top of each other. Imagine you take a transparency and you draw something on one and then place it on a stack. Next you take another transparency and draw something on it and then place it on the same stack. What is going to happen is that you will be able to see stuff from the first sheet as well as stuff drawn on the second sheet as long as they don’t overlap. That is what basic layers are.
Adjustment layers work in the same way in that you can see through them but they don’t change anything actually below them. So you can apply an adjustment (such as hue/saturation changes) on a transparency/layer and it will become an adjustment layer. Next you take this adjustment layer and place it on our stack of layers. Magically, when look through the adjustment layer everything seen through it seems to have that adjustment. However, it doesn’t actually change the layers below thus giving you a lot of control over what you do. You can change the adjustments later if you don’t like the effect as well.
Quote:
The Adjustment Options
There are 12 Adjustment Options available to you when you create an adjustment layer. I will go over them in more detail for beginners in later posts but I will give a general description now. They are:
Solid Color
This slaps a solid color on your stack of layers just like the name suggests.
Gradient
This puts a gradient on your stack of layers
Pattern
This allows you to choose a pattern and it applies it to your layer
Levels
This allows you to adjust the tones in your image. You can set the darkest tone and the lightest tone in your image and make the whole image change appear. You can make a dull image appear bright using Levels
Curves
You can use this to fix your highlights and shadows
Color Balance
Adjust the colors of highlights, midtones and shadows separately using this option.
Brightness/Contrast
This lightens or darkens your image and increases or decreases the contrast.
Hue/Saturation
This can be used to control the colors, the saturation and lightness or darkness of the image.
Selective Color
This allows you to add or remove percentage of a color present in your image. If you want your reds redder and your blues less bluer then this is what you use.
Channel Mixer
This allows you to adjust the reds, blues or greens. So you are adjusting each color channels itself
Gradient Map
This adds gradients insides different colors of the image. Unlike the gradient tool, that put a solid gradient over everything, this puts colors in each color of the image.
Invert
This changes all the colors to what is opposite to them in the color wheel.
Threshold
This changes stuff to black or white. The slider allows you to choose what tones it will be changing.
Posterize
This reduces the number of colors used in the image.
Hope that helps, and a lot of practice and experimenting will help loads!
Yearbook Editor-In-Chief Yearbook Head of Graphics
Kelpie
Join Date: Sep 2006
Location: BUE w/ my bff Alyssa
Posts: 23,433
Hogwarts RPG Name: Ian Michael Ashby
Graduated
Booger
Recently, I've been posting graphics where I have text following a curved line, and I had a question as to how to do that, so I made a tutorial.
First of all, an example of what it looks like:
[
SPOILER!!: Curved Line Tut
Now then, this is how you do it (Note - I am using Photoshop CS2, and I have no idea whether or not it is translatable, but I assume that it is)
1. Edit your graphic until you're ready to place your text. Right now, mine looks like this:
2. Pick the "Pen" tool (the tool that looks like a pen tip).
Make sure that you have the "Paths" setting on (the second box from the left on top - it has then pen tool inside of a box)
3. Draw your line by clicking your mouse along the path you want the text to follow. Make sure you go from left to right, or else your text will go upside-down (unless that's what you want). Tip: Zoom in on the image so you know where you're drawing. I am following the white line created by the brush. See the thin grey line that's forming (I know.....it's really faint)? That's the path you will be typing along.
When you are done drawing your path, hold the "ctrl" button and click anywhere on the canvas. This will close the path.
4. Now then, select your text tool. When the pointer is away from the path you have just created, the text tool will have a box around the I symbol. When it is ON the path, there will be a diagonal line going through the I symbol. Choose your point on the line and click. Start typing! (Note: Even though the grey path line will appear every time you select the text layer, it will NOT show on your final image).
5. Now then, I'm done with my text, but if you want to move it further down the line or take it back to the left more, choose the "direct selection tool." Click your text and slide it along the path you created until you're happy with its placement.
6. To finish up, I selected the text layer and put an Outer Glow on it (using the Layer menu), and now I'm done!
[
__________________
_______________________________________Professor Ashby is so ninja right now.
There are no programs that I am aware of that you can get for free without downloading or signing up for an e-mail or whatever. Trial versions of Photoshop and such things are free but then again they're only trials.
Actually you CAN use Paint to make graphics. My friend Kelly does it all the time. If used properly you can make some amazing stuff in Paint.
NOW I've got another tutorial for yall. I wrote this tutorial a couple weeks ago for someone on LJ so I figured that I should share it with you lovely SS people.
Program Used: Photoshop CS3 Difficulty: Intermediate Translatable? NO. This tutorial is STRICTLY for Photoshop users. It has Selective Coloring in it and A LOT of it so no.
We're going from to
SPOILER!!: Blake Lively Tutorial
1. Layer -> Duplicate Layer -> Screen
Play around with the settings for your image. Since my base was kind of dark, I set it to 100 percent.
2. Layer -> New Fill Layer
Fill this with a yellow color. I chose #fff460. Set this to Soft Light at around 30 percent.
3. Layer -> New Adjustment Layer -> Hue/Saturation
Play with the setting for this. I set mine to +30.
4. Layer -> New Adjustment Layer -> Selective Color
I decided that I wanted Blake's diamond earring to shine so I merged all layers (Layer -> Merge Visible) and took the Sharpen tool to her earring. My mode was normal and my strength was 50 percent. (To get to the Sharpen tool, right click on the Blur tool and you'll see it.)
& that's it! If you use this PLEASE let me know so I can see your results!
A good friend asked me to make a tutorial on how I do the colouring in my graphics. So here you go people, the secret to what I do.
Being a simplistic child, I'm always looking for the easiest way to do stuff. I'm also a fan of vibrant colours in graphics, but I'm not a huge fan of playing with levels and stuff. They make my head spin. So, to recap, I like colour, but don't like spending a lot of time trying to get it. Thankfully, I've found a way to make bringing colour out simple and it only takes a few layers! (YAY.) So let's see, I use Adobe Photoshop Elements 6, but I HIGHLY doubt that'll be an issue. Easy, simple and pretty nice lookin!
We'll be going from: to to
SPOILER!!: Shelby Color Tut
Step 1: Create your base. Here, I used the every lovely picture of my puppeh. (-snickers- She was staring a ball that was on the floor). But yes, find the picture you want and crop it down to 100x100px.
Step2: Tis a little bland lookin and a tad dull, so duplicate the base and set it to overlay at 100%.
Step 3: Ookay, so we got a bit of colour and a bit of brightness, but perhaps it could be toned down a bit, but still, we need more colour! -ish a colour freak- So, duplicate your base again and place it on top of the overlay layer and set it to luminosity at 100%.
Step 4: Oooh, purty...but still MORECOLOUR! =D Now, put a Hue/Saturation layer. (Layer>>New Adjustment Layer>>Hue/Saturation) And put these levels: Hue = 0 // Saturation = +20 // Lightness = 0 and you get this: NOTE: Not all images take the same saturation level! Some look better with less and others need a bit more. Also, sometimes, it's personal preference. ITSUPTOYOU.
YAY! COLOURRR. -flails and parties- So, to finish off the icon, just a bit of text:
Step 5: Using the eyedropper tool thingy, I picked up a bit of orange of the puppeh's fuzzy head and used it for the text colour. So, for the text, I used 18pt Arial Narrow and the colour I used is #fbaf0a. With those three things, I typed out "s h e l b y" (minus the quotes) and set it over by her nose:
Step 6: The text is hard to see, right? So, stroke outline the text with 4pt of white (#ffffff) and then take the layer that is the outline of the text and gaussian blur it. I used a radius of 5.0, but it really depends on your taste, so play around! Also, make sure you put this layer underneath the orange "s h e l b y" text layer. But, generally, you should get this:
Step 7: YAY, we can see it now! And for finishing touches, just a bit of tiny text in any colour you want, placed underneath the "s h e l b y". =D
YAY! We be finished. Well, this is not a bad place to end, but you can go on and do a couple more things...and, of course, I did. XD So,
Step 8: Directly above the Hue/Saturation layer, place a solid colour layer. You can use any colour you want, but I used ORANGEEEE (#fbaf0a) and set it to hue at 100%.
Step 9: Almost done, I swear! Now, duplicate your base again and place it above the solid colour layer. Set this layer to soft light at 100%.
Step 10: FINALSTEP! Hehehehe, duplicate your base ONE more time and set it above the layer we made in step 9. Set this layer to lighter colour at 100% and voila!:
Okay. I'm done now, I swear! -chuckles- Enjoy this and I hope it helps you in your quest for colour. Typically, the first four steps are the quickest and the easiest and they're what I typically do. =D YAY. First tutorial, so I hope it was goood! Oh, and don't copy everything that I do. Change it up! Switch it 'round! Play with it and make it cooler than mine!
Later, peoples!
__________________
We are stronger here together, than we could ever be alone. So hold on to me, don't you ever let me go.
Tonks FC Head Auror TF's Graphics Officer BW's V. Prez Yearbook Graphicer
Diricawl
Join Date: Aug 2005
Location: I live in your eyes.
Posts: 6,542
wicked!green | | Monster Truckerr!
Tutorial: Blending Images By Laura
I was asked which method I used to blend images when I make graphics, so I decided to make a tutorial.
I need to stress that this is not the ONLY way to blend images, nor do I know whether it is the best way, but it is how I do it and it usually works pretty well!
I'm using Photoshop CS3.
SPOILER!!: Blending Tut
STEP ONE:
Choose the images you want to blend and open them up in your program. I've gone for Emma and Rupert.
SPOILER!!: Screen Cap
STEP TWO:
Maximise one of your images. It doesn't matter which one really. I chose Rupert.
Create a new layer by going to Layers -> New layer.
SPOILER!!: Screen Cap
STEP THREE:
Click the gradient tool on the left hand size of the screen. It looks like this:
Then, go to the top of your screen to the rectangular box with a gradient in it and click it. When open, make sure the second box from the left on the top row is selected, called "Foreground to transparent":
STEP FOUR:
Make sure your new layer is selected. Draw a gradient. Start about 2cm above the bottom right hand corner and angle it downwards, drawing from right to left. Your gradient should end up looking something like this:
SPOILER!!: Screen Cap
STEP FIVE:
Select your gradient by holding down Control (Ctrl) and clicking on the little image on Layer Two.
SPOILER!!: Screen Cap
Only the gradient should be selected.
STEP SIX:
Still with your gradient selected, normal click on your image layer to select it. Then, press the Delete key. This removes a chunk from your image in the same shape as the gradient.
SPOILER!!: Screen Cap
STEP SEVEN:
Delete the layer on which the gradient is.
SPOILER!!: screen cap
Your image now fades to transparency on the right hand side.
STEP EIGHT:
Copy this image on top of the image of Emma Watson, changing the dimensions if necessary. The images should appear to be blended, such as below:
SPOILER!!: Screen Cap
Finished image:
If it's a little untidy, I usually use the smudge or blur tool to cover things up a little. Textures, opacity and colouring can also help. If it's MAJOR untidy, you may have missed a step or something. If you follow this carefully everything should be OK.
-----
Phew. If anyone is confused about my stupid wording etc. PM me!
SS Quill Journ. NLFC VP/Matt’s Prez Yearbook Jr Writer
Basilisk
Join Date: Jul 2003
Location: Chi-Town ★
Posts: 40,085
Hogwarts RPG Name: Jack Tyler Fritzera
Sixth Year
x9
Ministry RPG Name:
Benjamin Peter Cobblesten
Accidents & Catastrophes
Team Taylor & Jacob
I personally have not used Paint to make any of my graphics, but I have used almost every version of Photoshop and Paint Shop Pro. I've seen a lot of questions about free programs, and I'd actually recommend GIMP. It's free and has a lot of the tools that Photoshop has, minus Selective Coloring and Channel Mixer, of course. If you're looking for Selective Coloring the only program that offers that that I know of is Photoshop, sorry :/
The only problem with GIMP is that it's a lot harder to work around than Photoshop, but if you're patient and willing to learn how to navigate around it you can easily make lots of pretty stuff. I personally don't use it cause I get easily frustrated and I have Photoshop, so I really don't need it
Anyways, I thought I'd join in on the fun and post a tutorial for you all A lot of people don't seem to know how to use Selective Color, Channel Mixer, etc. to make really pretty colorings so I thought I'd share I know some people are fans of intense coloring and stuff, and I'm one of them, so if you think this icon or technique gives you too MUCH color then don't use it
I use Photoshop CS2, so it's NOT translatable, unless you want to see how it works out without the Selective Color, of course
Hokai, so let's get started!
We're going from this to this in just a few steps
SPOILER!!: Shia Labeouf Tutorial
So far I've found that this technique works better on darker icons rather than lighter ones--down at the examples there is an icon that was used with a bright base, so you can see how it turns out with lighter pictures. It was a bit more blue than I liked but it was still decent nonetheless
Step 1:
First take your base and crop, sharpen, all that jazz.
I used the blur tool to make the lines in his palm less noticeable.
Step 2:
Next, duplicate your base and set that layer to Soft Light, 100%
Step 3:
To brighten things up a bit, duplicate your base again, only this time set it to Screen. The opacity depends on the image, for this one I set it at 45%, but I've also had it set all the way up to 100% on other icons as well
Step 4:
Create a new Channel Mixer layer by going to Layer-->New Adjustment Layer-->Channel Mixer. Enter in the following settings for each level:
RED
128
0
-38
2
GREEN
0
100
-4
0
BLUE
-4
0
122
4
That makes our icon a little more blue and brings out the reds in his skin and lips
Step 5:
Create a new Curves layer, once again by going to Layer-->New Adjustment Layer-->Curves and enter in the following points (yes, there are three, and they're all on the same setting, RGB)
First Point:
56, 71
Second Point:
120, 126
Third Point:
170, 140
So now we have this:
Here is a cap of what your graph should look like as well
Step 6:
Now, the red was a little dark for my liking, so create a new Selective Color layer, by going to Layer-->New Adjustment Layer-->Selective Color and plug in the following settings
REDS
-100
-16
43
-20
YELLOWS
100
-100
100
0
CYANS
100
100
100
100
NEUTRALS
57
0
-23
-13
And now we have something like this:
The reds look a lot nicer, as do the blues, and look! His tie is a really nice shade of yellow as well
And that's it! You're all done!
As with all tutorials, the settings on each and every step should be tweaked with and changed to fit whatever base you're working with. These numbers are guidelines, folks: you should change them to fit your icon. This tutorial is NOT going to work exactly with every base you come up with.
On that note, I'd love to see what you come up with! Feel free to snag any of the icons, just credit Lissy, and if you use this tutorial, I'd like to know, just so I can see how it works on other icons
Other Examples: (please note: may have been made with slight modifications to screen and curves layers)
Hokai, so lately I've been noticing that there aren't enough Picnik turtorials! *gasp* I know. Shocker. So, I decided to be super kind and add one for all y'all Picnikers.
Is it translatable? I have... No clue. It might be, due to the fact Picnik is like a simplified version of Photoshop.
HOKAI. Me start now.
We're going from this -->
To this. -->
SPOILER!!: Tutorial Gabe
Step 1: Crop, resize, all that stuff.
Step 2: Take 'Sharpen' from the Edit tab and set it from '0' to '5'.
Step 3: On the same Edit tab, choose 'Colors' and set Temperature from '0' to '30'.
{OPTIONAL} Step 4: Go to Exposure and set 'Exposure' to '20' and 'Contrast' to '5'.
{OPTIONAL} Step 5: Add text, shapes, affects and etcetera. (I added text, used 'Blemish Fix' from 'Touch-Ups' and added 'Sepia' from 'Effects' with 'Fade' set on 75%.)
So, depending on where you stopped, yours should look either like these.
Stopped at Step 3:
Stopped at Step 4:
Finished all steps:
Of course, you always have the option of skipping Step 4 and heading from Step 3 to Step 5, which would look like this:
Of course, every picture is different. You can tweak with settings and numbers to create the perfect affect for that one picture. This tutorial might not work for every picture... But seriously, I'd love to see what you can make with this turtorial! If you're using it pleasepleaseplease credit Maya.
Oh, and feel free to snag any of the previews. =D
__________________
it's been -------------------------------------------------------------------------- ----nine bitter years!
Lately, I have been actually saving PSDs. I used to never do it for I would always forget and then when I went back and tried to recreate a coloring I couldn't recreate it exactly. I am here to share a coloring for a large graphic (A Userinfo banner for LJ or whatever else you want to use it for).
I use Photoshop CS3. It is only translatable to other Photoshops because of the use of Selective Coloring. Sorry non Photoshop users. =/ I use Selective Coloring for most of my stuff. I'll try to think of something only using soft light layers for those who don't like SC later.
Today, our pretty and adorable models will be the girls from Wonder Girls. How appropriately named they are.
First, as always, crop your image to however you want it. You may sharpen if you feel your image is too blurry but I, personally, tend to almost never sharpen. Sometimes you sharpen and it looks right but once you start getting the image lighten with the use of soft light layers and the abuse/use of selective coloring, the image starts looking pixelated and just not pretty. SO. Yes, once you have the image the way you want to work with we can start.
STEP ONE: Duplicate your base and set it to 100% SOFTLIGHT
STEP TWO: Make a new FILL LAYER with a medium dark blue and set it to 100% SOFT LIGHT. I used #4d83b0 in this case.
STEP THREE: Make another FILL LAYER with a medium dark pink-purpleish (lol) color. I used #b66ba3. Set it to 100% SOFT LIGHT
STEP FOUR: Another FILL LAYER set to 100% SOFT LIGHT using a dark orange color. Think pumpkin. lol I used #e98761
STEP FIVE: Make a new FILL LAYER with a green color. I used #6ec872.Set this layer to SOFT LIGHT (100%)
STEP SIX: Now, yet another FILL LAYER. This time flood it with a baby blue color. I used #aad5eb. Set it to SOFT LIGHT 100%
STEP SEVEN: One last FILL LAYER with a peach-pink color. I used #ffdada. Set it to SOFT LIGHT 100%
At this point you might think the image looks a bit too bright. Never fear, we can fix that with--SELECTIVE COLORING OF COURSE. But, OF COURSE. Amaris loves that little gadget.
So, go to your "Layer" tab, click on "New Adjustment Layer" from the drop down menu and choose "Selective Coloring" from the second drop down menu.
A window shall pop up. There is a new window/set of numbers for each color.
THERE. Now it's not that weird blah bright with no contrast. However, there's a weird red hue/tint in the hair that I am not liking. How do I fix that? Yet another Selective Color layer. Make it. Okay! REDS:
CYAN: +23
MAGENTA: +12
YELLOW: +12
BLACK: +10
YELLOWS:
CYAN: -100
MAGENTA: +23
YELLOW: -100 BLACK: +100
Now it looks so much better. You could stop here or you could add a new FILL LAYER of a navy blue color set to EXCLUSION 100% like I did. You can also add any texture or text or brushes you want.
You must remember though, the thing about SELECTIVE COLORING is that it varies and RELIES greatly on the image you're using. The reason these settings worked for THIS image is that because the picture contained a lot of yellows and reds. These settings would most likely not work on an image with a lot of blues and greens. Just remember to play around with the settings (not only in the Selective Coloring but with the SOFT LIGHT layers) if you're trying in another image.
This isn't a global tut. It's more of a practice exercise to get you experimenting with Selective Coloring. I hope you liked it if anyone has any questions....uh, PM me?
I bring you another tutorial! It has been a while since anyone shared any tuts with other SSers and I have several PSDs littering my computer so let's put them to good use.
I use Photoshop CS3 + Extended. This is only translatable to other Photoshops due to the use of Selective Coloring. (Yes, I am aware that I do not give SC a break. It can't be helped).
Tutorial # 2: Koda Kumi Blue Background
We'll be going from this to this
SPOILER!!: Koda Kumi Tut
First, of course, you'll be choosing the image you want to use and cropping+resizing to your liking. I used a promotional picture of Koda Kumi's last album. Note: The background is blue. As I have said before, the effects of Selective Coloring vary depending on the image you are using. If you want to achieve this same look you might want to choose an image with similar contrast in colors and color palette.
STEP1: Once you have your base image, duplicate it and set it to softlight 100%.
-->
STEP2: Now, that's better. The softlight layer made the colors pop more and the image generally brighter. Of course, we won't stop there! There's another way we can make our colors more vibrant: Soft Light Layers mixed with Selective Coloring. We shall start with another fill layer set to soft light 100%. I used #81a5c1.
And we go from to
As you can see, the soft light blue layer took away the yellow+orange from the image and added blue and a nice glow to the subject's skin. But we mustn't stop just yet. We shall make yet another soft light layer!
STEP3: Add a pink fill layer set to softlight 100%. I used #dab4d7.
--->
STEP4: Add a green fill layer set to softlight 100%. I used #a6c7a5.
-->
STEP5: Add one last fill layer of a light brown color and set it to soft light 100%. I used #ba9f96.
--->
Now you're probably going, "Ama, that's too bright and washed out". And you know what? You're totally right. We shall fix it with *GASP* Yes, Selective Coloring. What a darling.
STEP6: Go to Layer > New Adjustment Layer > Selective Color and use the following settings:
REDS:
cyan: -100
magenta: +100
yellow: +100
black: +100
YELLOWS:
cyan: -100
magenta: +100
yellow: +100
black: +100
CYANS:
cyan: +100
magenta: +100
yellow: -100
black: +100
MAGENTAS:
cyan: +100
magenta: +100
yellow: -100
black: +100
NEUTRALS:
cyan: +56
magenta: +12
yellow: +45
black: +5
Now you have gone from this to this
As you can see, the green tone is gone and has been replaced by a blue tone all around. You could stop here, if you're happy with the coloring. But if you're picky like me (and a lil crazy too boot) then you will make ANOTHER SC Layer to figure out a way to make that blue even more intense.
STEP7: Layer > New Adjustment Layer > Selective Color
And use the following settings:
REDS:
cyan: -100
magenta: +23
yellow: +100
black: +12
YELLOWS:
cyan: +100
magenta: +49
yellow: -100
black: +100
CYANS:
cyan: +100
magenta: -23
yellow: -100
black: +12
BLUES:
cyan: +100
magenta: +100
yellow: -100
black: -10
MAGENTAS:
cyan: +100
magenta: -100
yellow: -100
black: +100
NEUTRALS:
cyan: +12
magenta: -5
yellow: +12
black: +4
Now you have gone from this to this
See? Now that deep blue is really popping. But--perhaps a tad too much. So we have to soften that blue blow a bit if we don't want to blind people.
STEP8: EXCLUSION LAYER - I like to use navy fill layers set to exclusion. You can fiddle with the opacity of your layers to get the look you desire. I used #07041f set to 100% Exclusion in this case.
-->
Again, at this point you may want to stop if you're happy with the look you have achieved but if you think your canvas is looking a little drab and empty you can go on ahead and do what I did, which was experiment with textures.
STEP 9: TEXTURE USE - I went and peeked around my textures and found this wacky bright light texture I wanted to give a try. I got the texture from LJ. (Credits is in the filename itself).
Well, anyways, slap this baby on top of your image and set it to screen 100%. I didn't like how it was covering my subject entirely so I moved it to the top left of the icon canvas. I also deleted bits of it that were still poking at Koda heh.
-->
STEP10: LIGHT TEXTURE - So far so good, but the light texture isn't looking much like light to me. It needed to be a bit more bright and glowy. I used yet another light texture to achieve that. I set that one to screen and deleted the bits that were covering my icon subject.
(sorry about that...hehe just wanted to show you something)
The result is the following:
But now Koda is looking a little washed out. I want her to stand out, not the light texture!
STEP11: Unhappy, I went back and duplicated my base layer and brought it to to the top setting it to soft light 56%. Again, feel free to use a different opacity. Whatever works best for your image and your personal tastes.
The result?
-->
STEP12: BRUSH - I still wasn't quite happy! So I used a scribble text brush in a white color over the light texture. Set to normal 100%
STEP13: I wanted to add a little contrast to all the brightness so used yet another scribble text brush, this time in black. Set to normal 100%.
STEP14: Happy, at last, with the general look of the icon I decided to add one bit of pizzas by throwing into the mix a Saturation layer. Go to Layer > New Adjustment Layer > Hue/Saturation.
MASTER:
Hue:
Saturation: +12
Lightness:
STEP15: And, because I just have to push myself I add one more adjustment layer. This time Brightness/Contrast. Layer > New Adjustment Layer > Brightness/Contrast
Brightness: -5
Contrast: +6
Final Result?
AND we're finally done! ^__^ With those steps I have managed to get from here to
Any questions, (or requests for PSD) should be sent to me in a PM =) to avoid clutter here. Hope you enjoyed this tut and/or found it useful.
SS Quill Journ. NLFC VP/Matt’s Prez Yearbook Jr Writer
Basilisk
Join Date: Jul 2003
Location: Chi-Town ★
Posts: 40,085
Hogwarts RPG Name: Jack Tyler Fritzera
Sixth Year
x9
Ministry RPG Name:
Benjamin Peter Cobblesten
Accidents & Catastrophes
Team Taylor & Jacob
Alright, here's another tutorial that I made, less difficult than my Shia icon to get people acquianted with Selective Coloring and all that (trust me, it's NOT scary!)
America's Next Top Model Analeigh
Going from this to this
Made in Photoshop CS2. NOT TRANSLATABLE. Sorry It has Selective Coloring and all that jazz.
SPOILER!!: Clickie for Tut
Alright, so get your base and crop to 100 px by 100 px. I took a picture of Analeigh from America's Next Top Model, cause I was totally in love with this pic and just HAD to make an icon out of it
Now, it's not colorful or bright and not very eye catching, so in this tutorial we'll basically be brightening things up, increasing the saturation, and playing around with selective coloring to make some of the colors pop.
1. Create a new Curves layer by going to New Adjustment Layer-->Curves. Make one point and enter the following settings:
INPUT: 48
OUTPUT: 82
To make it a bit lighter. So now we have this:
2. Personally, whenever I'm playing around with Selective Coloring, I up the Saturation on my icon to make the colors more vivid So, go once again to New Adjustment Layer-->Hue/Saturation. Keep it on "Master" on increase the saturation to +30
And viola
3. Since I like lots of warm colors, like red and magenta, I created a Selective Coloring layer to make the reds really stand out in my image. So, go to New Adjustment Layer-->Selective Color. Here are the levels I changed and the numbers to imput:
As you can see, she looks a lot more colorful, and I used the CYANS to make her navy blue dress pop out a bit more too. But I liked how her skin wasn't nearly as pale as it was before, which just makes the icon a lot more interesting to look at
4. Finally, I added just one more Hue/Saturation layer, increasing the saturation under "Reds" to +17
There you go! Feel free to snag the icon if you'd like, just credit Lissy please Remember, like Ama said, Selective Coloring is all based on the colors in your original image so please tweak these numbers around to fit your picture
SECOND RESULT: DELETE that last Channel Mixer layer and simply
substitute the layer with this Curves layer.
Layers/New Adjustment Layer/Curves
Red: Point 1 - 182/194, Point 2 - 130/86 Green: hands off! Blue: Point 1 - 213/167, Point 2 - 26/113
Set it to Color (Legacy). Or it clearly looks weird.
You're done, my lovelies!
A delicious duo of iconage! Hope this helped and I’d love it if you PM’ed with questions or your results! Sorry if this is completely unreadable, yeah, just talk to me! Oh and, CREDITCREDITCREDIT! You don't know how doofy happy I was to actually make a coherent tut!
More examples:
__________________
I was five and he was six We rode on horses made of sticks
He wore black and I wore white He would always win the fight bang bang
My baby shot me down
SS Quill Journ. NLFC VP/Matt’s Prez Yearbook Jr Writer
Basilisk
Join Date: Jul 2003
Location: Chi-Town ★
Posts: 40,085
Hogwarts RPG Name: Jack Tyler Fritzera
Sixth Year
x9
Ministry RPG Name:
Benjamin Peter Cobblesten
Accidents & Catastrophes
Team Taylor & Jacob
I accidentally stumbled upon a coloring that I really liked while making my new profile picture, and I liked it just so darn much I'm sharing it with you
Today we'll be starting with THIS lovely picture of Josh Hartnett and then ending up with THIS or THIS, depending on where you stop
NOT TRANSLATABLE due to Selective Coloring. Sorry Made using Photoshop CS2. It's not incredibly easy but not too difficult either
SPOILER!!: Josh Tutorial
First, get a base. This tutorial works better with icons that are originally somewhat bright, like the image I picked. He's outside, so he has a bit more light around him than if he had been inside.
Because I was making a profile pic, my image was a little larger than usual. So, for this tutorial, we're going to be cropping down the picture into icon size to make it easier to read and so it takes up less space
1. We can't just going playing with Selective Color right now otherwise the colors won't turn out all pretty like we want them So we're going to add some Color Fill layers. First, I made a new color fill layer by going to Layer-->New Fill Layer-->Solid Color. I filled it with a light, pinkish red color, in this case I picked #f3c1c1. Set this layer to Soft Light, 60%
2. Create another Color Fill layer, this time with a light sky blue. I chose #aae7f9 and set it to Soft Light, 47%
3. Create yet another Color Fill layer with a dark navy blue, so dark it's lingering on black. For this image I used #0c031f. Set this layer to Exclusion at only 50%.
4. Now we start with the selective coloring. This is layer one of three, so be warned, lots of selective coloring in this tutorial. Go to Layer-->New Adjustment Layer-->Selective Color. Use these adjustments on the following levels:
REDS
-100
43
-22
0
CYANS
100
100
-100
100
NEUTRALS
-10
2
-8
4
And that's the end of Selective Color layer one
5. Now we're going to create a Color Balance layer. Go to Layer-->New Adjustment Layer-->Color Balance.
Midtones:
17, 16, 24
Shadows:
37, 22, -19
Don't mess with the Highlights setting, unless you feel like being creative and seeing what happens with your image. But for the purpose of this image I just left them alone.
6. Now we're going to add another Selective Color layer.
REDS
-100
10
100
0
YELLOWS
94
0
-83
0
NEUTRALS
35
0
-22
0
7. Now for our final Selective Color layer.
REDS
-100
0
15
0
NEUTRALS
35
0
-22
0
And we're all finished!
The coloring looks a lot brighter on the full size image
OPTIONAL step:
On a new layer, paste this texture over your image from Hybrid Genesis and position it so it's exactly where you want it over your image. Set it to Multiply, 70%.
And there you go! I added in the texture step to show how adding the texture on top can also affect the coloring of the image.
Feel free to use any of the yummy icons of Josh, just credit Lissy when doing so
I dug up some old tutorials from when I was using PSP, these aren't like epic or anything but they might be a help to those just starting out using the Paint Shop Pro software (version 9, mind you):
Sewing Lessons Tutorials 
(which won 1st Place at an icontest..but I don't like to brag XD)
We're really not supposed to remove watermarks, are we? lol but I know when I use an image that has something in it I don't want (like... another person in the background, or smudges on the person's self 
to 
to 
to 
x9
to this 
in just a few steps 
to this 
on top of your image and set it to screen 100%. I didn't like how it was covering my subject entirely so I moved it to the top left of the icon canvas. I also deleted bits of it that were still poking at Koda heh.
to this 
It has Selective Coloring and all that jazz.
< Finished product: just add whatever text/brushes you want.
