Thursday, April 3, 2008

0

Web Interface Design

Here you will be taught how to make a web interface that is transparent. This design requiresthat you use an image as your webpages background.
1) Open a new file, around 300 x 250pixels, with any background color. I used black.
2) Make a white square on a seperate layer. Set the opacity to 45-55%. This is going to be the table for our web interface.




3) Click on the Polygonal Lasso Tool.
4) Now cut some corners.

5) Still using the polygonal lasso tool just cut out lines from the square. Heres what i did.You don't need to do this, but this gives our website a more techy look.

6) Repeat step 5 until your happy with what you have.
7) (OPTIONAL) If you want a boarder around your table.GO TO LAYER > EFFECTS > INNER SHADOW. Use these setting with any color you want.


8) Now just add a background. I made this one using my Space Warp tutorial. Thats it for our web interface design tutorial.
You can add additional tables to your website for navigation or whatever else you need.

Read More...

0

Interface Skin and Bone

You first need to create your base or orignal pattern. Once you have the original pattern you then load a selection on the orignal pattern, expand the selection by 2 pixels (amount will vary depending on the size of the orig. pattern).

Create a new layer then fill the selection with a temporary color like white. This will create the second pattern that will be our interface skin.




Apply your effects for both patterns. Remember the original pattern will be the interface bone so only parts of that pattern will be seen.

I used the aqua affect for my interface bone (fig. 02a) and the 3D bevel effect (fig. 02b) for my interface skin.

Make sure the position of the elements and that the order of layers stay the same with the interface skin appearing on top of the interface bone layer.


We then cut out sections of the interface skin to expose the layer containing our interface bone. Use the elliptical marquee tool and position it over some areas of our interface skin layer. Hit the delete key to expose some sections of the interface bone layer.

Repeat the process until you are satisfied with the amount of bone layer exposed.






We will then apply a slice effect on the edges on the cut outs we made on step 3.

Use the elliptical marquee tool to select one of the edges of the interface skin made by the cut outs (fig. 04a). Make sure you have a small portion of the edge selected with the marquee tool.

Copy the contents of the selection and paste it on a new layer.

Load a selection on the chipped off edge and apply a vertical linear gradient (fig. 04b). The colors for the gradient will be the lighter and darker shade of the base color of the interface skin. I used black and white for the gradient since my base color is dark grey. Once you're done with the gradient move the chipped off edges back to there original position (fig. 04c).
Repeat the process for the other edges of the interface skin


Double click on the layer thumbnail then add a 1 pixel black stroke around the interface skin layer using layer styles and add a drop shadow to complete the tutorial.

Read More...

0

Photoshop Brush Site Spotlight — Seishido Photoshop Brushes

Seishido offers a beautiful collection of Photoshop brushes that is not to be overlooked! All of Janita's brushes are tinged with an air of whimsy, from her beautifully detailed Angelic set, featuring delicate feathers, gossamer wings and dreamy clouds, to her sweetly festive Seasonal set. Janita was kind enough to let us in on a few of her own favorite sets, and the following are free Photoshop brush previews that she offers exclusively to our site.

Easter Brushset Find Me: A special and brand new Easter set full of high resolution and hand drawn Easter egg brushes, in swirly and floral styles. And to make it even more seasonal there's also a cute bunny brush that has been attached in different sizes. The egg brushes have been made with another brushset, the floral elements are all doodled and this way the brushes look like eggs painted by kids, which can be used for borders, backgrounds, and other graphic needs. Just a lot of Easter bunny designs.

Brushset Pointed Out: This is one of those sets that everyone has a different use for. To me the brushes look like sea plants and faerie wings, but they can also be used as feathers, or just whatever would look cute with these brushes on.

Brushset Pussycat: These brushes are actually made of a scanned feather scarf but no one would ever guess it. Can be used for grungy designs as well as cloudy ones. Same thing as for the Pointed Out brushes, useful in all kinds of different ways, with just endless possibilities.

Read More...

0

Create a Stone Texture

Create a realistic stone texture in Adobe Photoshop Tutorial. A preview of the final result can be seen below:

*How to make a realistic stone texture that isn’t as fake looking as in other tutorials*

STEP 1 (Texture 1)
Open a new document 500 by 500. Select a dark gray as the foreground color, and a washed out or desaturated orange as the background color.

Next go to Filter > Render > Clouds (You can press Crtl + F to get different variations of the clouds)

Then go to Filter > Noise > Add Noise (I used the settings “noise amount 3, Distribution Gaussian, and Monochromatic checked.”


Select the channels window next to layers. Then create a new channel and select it.

Next go to Filter > Render > Difference Clouds

Then go to Filter > Noise > Add Noise. The settings should be the same as before.

Next go to Filter > Fade Add Noise 48%

Lastly go to Filter > Render > Different Clouds. Keep pressing Ctrl + F until the channel is = black and white.

Now it’s time to go back to the layers menu. Select the layer from before and go to Filter > Render > Lighting Effects. I used the settings…

Intensity > 60
Focus > 70
Gloss > -100
Material > 48
Exposure > -6
Ambience > 4

Next go to Image > Adjust > Brightness/Contrast and put the Brightness at + 10 and the Contrast at +12

By now you should have something close to this…


STEP 2 (Texture 2)

Open a new document 500 by 500

Go to Filter > Render > Clouds. (You get to decide the colors, but keep in mind if you want it to look realistic pick colors that could actually occur in a rock. They can be blue and purple, but don’t make it neon colors. Remember to make everything in proportion.)

Next go to Filter > Artistic > Plastic Wrap. Use the settings “Highlight Strength 2, Detail 15, Smoothness 14

This is approximately what you should have so far


Next go Filter > Texture > Craquelure and apply the settings from the picture below.

Combine the plastic wrap and craquelure layers. Once again go to Craquelure filter and apply the settings “Crack Spacing 88, Crack Depth 1, and Crack Brightness 4.

STEP 3 (Stone)

Copy the merged layers from the second texture we made. Paste it on top of our first texture and put the opacity down to 60 %. Hear is my final product...

Read More...

0

Enhance The Rays Of Light In Your Photo

Step 1 - Open your photo and save it as a new image to preserve your original.

Astoria, Oregon

Before The Ray Of Light Effect


Step 2 - Open your new photo and click on Filter>Blur>Radial Blur and set amount to 25, select Zoom and set Quality to best. Move your mouse over the white Blur Center to set the direction of your blur. If you want a more dramatic effect, set your Radial Blur to 50 or something which looks best for your photo.
Step 3 - Next, go to your Layer and select Lighten and set your Opacity at 75. You can set Opacity at what level looks best for your photo.
Step 4 - Afterwards, select the Eraser Tool and erase the sections where you don't want the Ray Of Light effect on your photo. In my example below, I erased the upper right hand side.

Astoria, Oregon
After The Ray Of Light Effect
Step 5 - Now you can save the image.

Read More...

0

Repair Photo Colors By Adjusting Levels

Step 1 - Open your photo and save it as a new image to preserve your original.

Step 2 - Open your new photo and grab your Magnetic Lasso Tool from your left tool bar. When you right click on the Lasso tool, you have options to choose this.
Magnetic Lasso Tool Image
Step 3 - In this example, we grab everything using the Magnetic Lasso except the tree.

Umatilla Park - Oregon


Step 4 - Next, after you Lasso it, you want to click Image>Adjustments>Levels

Step 5 - Make sure your channel is set to RGB

Step 6 - I set the input levels to 0, 0.32, 255 in this example.

Step 7 - I set the output levels to 0, 255 in this example.

Step 8 - Now you can save the image. Since you used the Magnetic Lasso, only what you lassoed will be changed when you make your adjustmensts.

Umatilla Park - Oregon

Read More...

0

Red Eye Reduction

















This tutorial will show you how to get rid of red eye. It's a very useful and easy technique.

Start out by opening your image in Photoshop.

Now if you're lucky enough to have CS2, you can simply select the new Red Eye Tool, located beneath the band-aid icon, and click on the center of the retina. This tool does a great job, but if you don't have CS2 yet, you'll need to keep reading.

Start by selecting the elliptical marquee tool. You can access it by clicking and holding down the rectagular marquee tool until it appears.



Using the elliptical marquee tool, draw circles around the retinas of the eyes. You can draw multiple selections by holding down the shift key. It also may help to zoom in a little when making your selection. I tend to cheat my selection a little on the large side.

Once you have a good selection, first thing you'll want to do is get rid of the red color. Do this by going to the menu item Image > Adjustments > Hue/Saturation. Drag the saturation handle all the way to the left and click OK.


Note: Don't adjust the lightness in Hue/Saturation, or you'll lose your highlight and your eyes will look more like black dots. Read on...

Now you have solid grey eyes, which look pretty weird. You'll need to go to Image > Adjustments > Brightness / Contrast now and drag the brightness down, this adjustment will keep you from losing your highlight. When you are satisfied with your adjustments click OK and there you have it!

Read More...

0

Trapping

Trapping is a very misunderstood and dynamic subject. When printing color, a separate impression is required for each color. Many variables can cause the two colors to be slightly misaligned or out of register.

Trapping is crucial when two or more colors touch or overlap. (as in our illustration above) A slight misalignment in this case can be very unsightly because the paper shines through where the colors don't meet, and a dark ridge appears where the colors overlap too much.





Easy Solution?
Let CDman take care of trapping for you. Since each press is different especially between the

silk-screen and offset presses, it is better for you to let us worry about trapping. If you attempt to trap then the results are not guaranteed to work.
We check for trapping issues for all files. Modifications are made during the plate making. There is no charge for minor trap fixes. If your job is complex and requires manual trapping, we will advise you in an email HOLD message indicating the charges associated to perform this task.

Read More...

0

Grayscale Workflows

When designing for a standard priced CD booklet, one full side (outside) will be quoted out as color while the other side (inside) is black and white or grayscale.

Top row is color (4)
Bottom row is B&W (1)

Standard quotes = 4 over 1 printing:
  • 4 over 1 booklet
  • 4 over 1 traycard

You can pay extra to get color on all sides of your booklet, but for this section of the tutorial we will assume you need standard B&W artwork or grayscale images for the inside of the folder. This standard configuration is called 4 over 1 printing. 4 being the CMYK color and 1 being grayscale using black ink.

Grayscale can be achieved using the black channel only in CMYK printing-

Grayscale Definition:

RGB Grayscale mode uses up to 256 shades of gray. Every pixel of an RGB Photoshop grayscale image has a brightness value ranging from 0 (black) to 255 (white). Grayscale values for printing CMYK CDs and Booklets will be measured as percentages of black ink coverage (0% is equal to white, 100% to black). Gray spot colors are available with such names as "cool gray" so be aware that these still constitute a "spot color" which costs extra if used on any paper parts.

  • Any image can be converted to grayscale. (Provided it opens in Photoshop)
  • To convert a color image to a high-quality grayscale image, Photoshop discards all color information in the original image. The gray levels (shades) of the converted pixels represent the luminosity of the original pixels.
  • You can mix information from the color channels to create a custom grayscale channel by using the Channel Mixer command.

What about stapled booklets?

Just like folders, booklets are also classified as 4 over 1 or 4 over 4. The outermost covers, say pages 1 and 8 on an 8 page stapled booklet would typically be colored while all inside pages, 2 through 7, would be B&W or grayscale.

Read More...

0

CMYK Workflows

When designing for CMYK printing there are a few application specific tips to follow:

Photoshop: Your scanner almost certainly generates RGB information. Don't worry, that's how it's supposed to work. In fact, you should leave your color files in RGB mode until you need to finalize your project, or until you need to know CMYK ink values so you can match colors in another program. While you are working you can check how your files are going to look by turning on the "CMYK preview" mode.

Don't make repeated changes between RGB and CMYK mode, using the mode menu. Every time you switch, a little clarity is lost. One switch is no problem; 20 switches makes a difference.

You may ask, why not simply switch to CMYK mode as soon as possible?

  • RGB files are 25% smaller and therefore 25% faster to work with and easier to store.The SWOP CMYK gamut is pretty small. If you ever want to reproduce those files for a different medium (such as the web), you'll have thrown away some potentially useful information.
  • Some filters only work in RGB mode.
Illustrator: Stick to CMYK and Grayscale color models when working on the paper parts of your project (booklets, traycards, etc.). If you use Pantone Coated colors on anything paper, make sure that you are willing to pay all the associated up charges. Stay away from RGB. Refer to Adobe's web site and the program's help section for details.


Familiarize yourself with Illustratorcolor handling options.(Image above is V.9)

Quark Xpress: Familiarize yourself with the "Edit Colors" dialog box. Use only CMYK mode and ensure that the spot color checkbox is off. Make sure that you are in control of which colors should separate into CMYK by installing a post script printer and using the output tab in the Print dialog window. Be aware that Quark's ability to represent color accurately is, shall we say, less than ideal. (use a swatch book!) -Visit for additional help

InDesign: Use the Window, Color and verify that you are using CMYK colors.

Read More...

0

Spot Colors

So if I can't use RGB, how do I get vibrant colors?

Spot color,also called premixed inks, are the inks used for printing a specific corporate or accent color. Spot color inks are useful for colors that process (CMYK) printing cannot adequately re-produce.
Typically it is harder to print CMYK on a disc face and easier to print SPOT colors which is why it is usually cheaper to use spot colors vs. CMYK on the CD face. The opposite is true for paper parts as print shops all use CMYK as standard inking. Spot colors on paper incure additional charges.

Companies that produce spot color guides (maps) include Pantone, DIC, Focaltone.
Pantone (Spot) Formula guide book.

CDman can reproduce any color from the Pantone Color Formula Guide 1000 (1000 of the most popular colors) as well as the Pantone Metallic Color Guide. We strongly suggest that you do not use any fluorescent colors since they rapidly lose their luster. Please be aware that slight color deviations may occur between color printed on a white surface and the same color printed on the CD’s aluminum colored surface. This is due to aluminum reflecting light (the color might seem darker on the disc than on white paper).

  • Pantone 285 is a blue ink that's mixed from the ingredients Reflex Blue (6 parts), Process Blue (2 parts) and Transparent White (8 parts). In most swatch books, you'll find that Pantone 285 appears more than once, as 285C and 285U. Pantone 285C is Pantone 285 printed on coated paper. Pantone 285U uses the exact same ink formula, but is printed on uncoated paper, resulting in a different apparent color. If your designing for the CD label face use the "C" version as it simulates more closely the shiny plastic of the CD surface. Note the use of the word 'closely'.
  • Pantone numbers with a dash are not accepted. A Formula number is either 3 or 4 digits NO DASHES (eg: Pantone 185-7 is not available with our company)
When to use spot color on the CD face?


  • Always - unless you have been quoted for 4 color CMYK CD face printing.
  • You want to guarantee the color tint for corporate logos.
  • You need three or fewer colors and you will not be reproducing full color photographs.
  • You want clarity in text and crisp lines.
  • You want a metallic effect (fluorescent PMS colors not advised as they rapidly lose their luster).

When to use spot color on the booklet or paper parts?

  • You want to guarantee the color tint for corporate logos
  • You want a metallic effect (fluorescent PMS colors not advised as they rapidly lose their luster.
  • You want amazing BRIGHT! colors on paper and have been quoted for PMS spot colors, and are willing to pay associated up-charges.

When not to use Spot Colors?

  • When working on your any of your paper parts, unless you have been quoted.
  • In Photoshop do not attempt spot colors unless you are very experienced and can work with Photoshop DCS files. Quark and InDesign templates can import DCS spot colors but expect additional up-charges for us to deal with them.
  • Advanced users tip: if you rely on 3rd party plugins to deal with spot colors in your page layout program we will NOT have the plugins to deal with the file. Simple solution: work in CMYK mode then sub out colors. Eg: Black equals WHITE ink and Cyan equals PMS265.
Pantone Swatch Book Suffixes:

C = coated paper

U = uncoated paper

CV = computer video

CVC = computer video simulating coated paper

CVU = computer video simulating uncoated paper

Read More...

0

Gamut

Gamut is the total range of colors produced by a device.

For any printing device there will be physical limits to the range of color that can be reproduced. In the above illustration, what we see is the difference between the bright light of a monitor shooting bright electrons at us vs. the duller effect of ink on paper.

RGB Gamut is larger than CMYK Gamut

If your CD or Booklet design files contain RGB colors when we receive them, they must be converted at an additional cost.

A color is said to be "out of gamut" when its position in one device's color space cannot be directly translated into another device's color space. For example, the total range of colors that can be reproduced on a monitor or color RGB laser printer is greater than that for an offset press. A typical CMYK gamut is generally smaller than a typical RGB gamut. This is the primary reason that colors go dark and dull when you convert an RGB image to CMYK. Most notably, certain vibrant deep blues and rich reds are "outside the gamut" of SWOP CMYK.

SWOP stands for Standard Web Offset Press.

Read More...

0

RGB vs. CMYK

It is very rare that a computer monitor will display accurately the color chosen in your layout or in Photoshop. Professionals spend several thousand dollars, time and effort to 'tweak' their systems so that visually the monitor will display as close to possible the printed page. Keep in mind that the two processes are totally different.

Red, Green, and Blue are "additive colors". If we combine red, green and blue light you will get white light. This is the principal behind the T.V. set in your living room and the monitor you are staring at now.

Cyan, Magenta and Yellow are "subtractive colors". If we print cyan, magenta and yellow inks on white paper, they absorb the light shining on the page. Since our eyes receive no reflected light from the paper, we perceive black... in a perfect world!

In practice, printing subtractive inks may contain impurities that prevent them from absorbing light perfectly. They do a pretty good job with light colors, but when we add them all together, they produce a murky brown rather than black. In order to get decent dark colors, black ink is added in increasing proportions, as the color gets darker and darker. This is the "K" or "key" component in Cyan Magenta Yellow and blacK printing.

Additive color, or RGB mode, is optimized for display on computer monitors and peripherals, most notably scanning devices. The printing world operates in subtractive color, or CMYK mode.
  • Rich black is the usage of all 4 process colors: Cyan, Magenta, Yellow and blacK together. 4 passes of ink building upon each other creates a deeper black than simply using one pass of black.

  • Each color is expressed in a range from 0% to 100%, if you use 100% of each color that would equal 400% ink saturation which will overload the paper and cause the paper to wrinkle (like water painting) You should not exceed 300% total ink saturation.
Whoops!
One of the most common errors made by inexperienced graphic designers is submitting RGB files. As a result we must ask if they would like us to convert to CMYK before we send the files for film output. Most of the time, the color change that will occur is slight. However, every once in a while, the color range after conversion is compressed during the transition to CMYK mode resulting in a complete change in color tones. Be warned that there is absolutely no way to get that deep RGB blue using CMYK, no matter how much we want to.

Photoshop Solution:


Ensure images are in CMYK mode

The Pantone corporation has gone to the trouble of standardizing CMYK color and how it should appear on paper. One book they sell is called PANTONE® process guide coated SWOP.


This gives the designer the ability to see the printed results of the CMYK % values they set in their program's color setting.


Since CDman uses semi-gloss book paper we use the Coated version as opposed to uncoated when trying to decide on CMYK values.

If we refer to a Pantone SWOP book and not our monitors or anyone else's, we will get a true impression of the final color tint. Obviously no book can contain every tint possible and each offset press is slightly different, but there will be a whole lot fewer surprised people if guide books are used.

Terms in brief:

Process = CMYK (mixing 4 primary colors together)
SPOT color = Formula to obtain one 'spot' shade.
Pantone Swatch Book Suffixes:

C = coated paper

U = uncoated paper

CV = computer video

CVC = computer video simulating coated paper

CVU = computer video simulating uncoated paper

Read More...

0

How To Install & Use The Photoshop Frames & Borders Free Brush Set

Download the Frames & Borders Free Brush Set (zip/6.5MB)

This tutorial will walk you through installing and using the Frames & Borders Free Brush Set (zip/6.5MB) by Stephanie of Obsidian Dawn. It also includes tips on using specific brushes from the set to insure that they come out their best!

Extracting the ZIP file After downloading the brush set, place the ZIP file anywhere on your computer where it will be easily found, such as your desktop. Using your extraction utility of choice (Windows comes with one now - just double click on the file), extract the SS-frames.abr file into your Program Files > Adobe > Photoshop (whatever version you are using) > Presets > Brushes folder.

Loading the Brush Set Open Photoshop. If you already had it open just now, the brushes will not automatically show up until you close and re-open the program, so go ahead and do so now. To be sure that your tools palette is visible, click on "Window" in the top menu and make sure that "Tools" has a checkmark next to it. If it doesn't, click it. In your tools palette, click on the Brush tool.

Once you've done so, you'll see a small menu of brush tool options located just below the top menu. Right next to the thumbnail of the current brush that you have selected, there is a small down arrow. Click that to open the brush preset picker.

In this dropdown menu, you will see all of the brushes that are a part of your currently selected brush set. On the far upper right-hand corner, there is a small arrow. Click it.

You are now viewing, among other things, all of the brush sets that are installed on your computer. They are listed just below the section where you can "Save Brushes..." and "Replace Brushes..." etc. The name of this brush set is "SS-frames" so go ahead and look for that, then select it by clicking on it. Photoshop will ask you if you wish to "Replace current brushes with the brushes from SS-frames.abr?"

Click "OK," and now you should see some very different thumbnails in the brush preset picker. Those are the frames brushes! You've successfully loaded the brush set. If you don't see "SS-frames" among the listed brush sets available, then you didn't extract the ABR file into the right directory.

Using the Brushes

Using a Photoshop brush is as easy as clicking on your canvas with the brush selected. But these were made to frame images or photos, so there's a bit more to it than that. Let's start with a fresh canvas. Under the top menu, choose File > New. Make the width and height both 800 pixels, the resolution 72 pixels/inch (should be default), the color mode RGB, and the background contents white.

We need a photo to frame! So, on the top menu choose File > Open and find the photo that you would like to put a border around. Choose "Ok" once you've found it to open it within Photoshop. Under the top menu, choose Image > Image Size. If the width/height are below 600 pixels or so, you don't need to change anything. Just hit "Ok." If the photo is larger than that, however, we need to size it down just a bit. Change the width (or height, whichever is larger) to 600 pixels, and choose "Ok."

Now hit CTRL-A (Mac: Cmd-A) to "select all," then CTRL-C (Mac: Cmd-C) to copy. Now hit CTRL-Tab (Mac: Cmd-Tab) to switch back to the other file that we just made, and CTRL-V (Mac: Cmd-V) to paste. This should paste your photo into the middle of the white canvas that we created.

To frame this photo with one of the brushes from the frames set, we're going to want to ensure that this brush is on its own layer. To do that, under the top menu click Window and be sure that "Layers" has a checkmark next to it. If it doesn't, click on it.

Your layers palette should now look something like the image on the right.

the brush, click on the "Create a New Layer" button at the bottom of the layers palette. It is the icon that looks like a page with the lower left corner turned up, and should be just to the left of the garbage can icon. You can see my icon hovering over it in this screenshot.

By default, this layer should be called "Layer 3" or somesuch. But let's rename it. Right click on this new layer in the layers palette and choose "Layer Properties.." When Photoshop asks you to, name it "Brush" and hit "OK." While we're at it, let's name the layer with the photo on it, too. Right click on that layer and choose layer properties, then name it "Photo" and hit "Ok." We want to be working on our brush layer right now, however, so left click on that layer once to select it.

On the tools palette, make sure that you still have the brush tool selected. Click on the small arrow to the right of the brush thumbnail, located just under the main menu at the top of the Photoshop window (just like we did earlier when we were loading the brushes). Look through the frames brushes and decide which one you'd like to use.

My photo is longer horizontally than vertically, so I chose one of the wider brushes that was made to fit a landscape photo. (Please note, most of these brushes will work just as well for horizontal or vertical photos - I will go on to explain later how you can rotate the brush to work for either.)

The brush that I am using is called "rope-square," and it is made to look like a rope. Once you have selected your brush, you need to find the right size. You can slide the arrow at the top of the brush preset picker window to the right or left, or you can click within the text box and enter a numeric value.

You want to make sure that the inner edge of the brush will cover the entire photo. To see your brush size in relation to your photo, while you are choosing brushes and sizes, you can hover your mouse over the photo and Photoshop will show you an outline of what area the brush will cover. See the outline of the brush below?

Once you've selected your brush size, you need to choose your color. For the brush itself, we're going to use black. Why? Well, most of the brushes in this pack will have some sort of transparent area, if you were to just click once on the canvas to frame the photo. We don't want any transparency, though. We don't want to see parts of the photo beneath the brush - not in most cases, anyway!

So we're going to have a layer where we apply the brush to frame the photo, and then we're going to have a layer beneath that adds any colors that we want to have, as well as taking away that transparency.

So, choose black as your foreground color on the bottom of your tools palette.

Move your mouse over the canvas until you're sure that the inner edge of the brush is covering the portion of the photo that you wish to frame, then left click once.

The frame that you chose should appear on the canvas. In the case of the rope border that I'm using, the brush is extremely transparent, as you can see. But the next step will fix that.

In the tools palette, choose the "Magic Wand Tool." It looks like the image on the left.


Make sure that your "Brush" layer is still active in your layers palette by left clicking on it. Back on the canvas, click in the middle of the border.

select the space in the middle of the frames brush. Holding SHIFT, click outside the border. By holding shift, you are adding to the current selection, so you should now have inside and outside of the frame selected. Everything but the frame itself, in other words. Like this.

In the top menu, click on Select > Inverse. Or, the shortcut for this is SHIFT-CTRL-I (Mac: Cmd-Shift-I). Now instead of having all of the area outside the frame selected, you have the frame itself selected.

We want to make sure that there's no color poking out around the edges of our brush, though, so let's click Select > Modify > Contract on the top menu, and choose 1 pixel. Hit "Ok." This changes our selection area so that it's smaller on all edges by 1 pixel.

On the tools palette, select the "Paint Bucket Tool." On the layers palette, click on the "Photo" layer. Click on the "Create a New Layer" button at the bottom of the layers palette again, just like we did earlier.

Now right click on this layer and choose "Layer Properties" - name it "Color" and click "OK." Your layers palette should now look something like the image on the right.

Using the color of your choosing (in this case, a nice medium brown), click within the selected area on the canvas. This should fill in the brush area with color and take away any transparency that there was previously. CTRL-D (Mac: Cmd-D) to deselect the area that you had previously selected, so you can get a better look at your border. You will still likely have areas of the photo that are poking out around the edges of the frame. Don't worry, we'll fix those next!

In the tools palette, select the "Magic Wand Tool" once again. Making sure that the "Colors" layer is active (click on it in the layers palette), click once somewhere in the middle of the border area. You should now have all of the space in the middle of the border selected, where the photo is.

On the top menu, click Select > Modify > Expand and choose 1 pixel. Now click SHIFT-CTRL-I (Mac: Cmd-Shift-I) to inverse the selection. In the layers palette, click on your "Photo" layer to select it. Hit DELETE to remove the edges of the photograph that are sticking out beyond the frame. CTRL-D (Mac: Cmd-D) to deselect.

Voila! You now have a border around your photo.

If you want to play around with how the border looks, you can change the Opacity of the Brush layer (in the layers palette, upper right) or change the Hue/Saturation of the Color layer (Image > Adjustments > Hue/Saturation). You can also apply various layer styles like a drop shadow, a color gradient, or a pattern to the "Color" layer (on the bottom of the layers palette, the "Add a Layer Style" button looks like an "f" inside a darker circle - that's where you'll find all these options).

If your color is still sticking out a bit from beneath the Brush layer, select the magic wand tool and click on the canvas somewhere within the colored area itself. Click SHIFT-CTRL-I (Mac: Cmd-Shift-I) to inverse the selection. Choose Select > Modify > Expand and choose 1 pixel. Then hit DELETE. CTRL-D (Mac: Cmd-D) to deselect and get a better look at it. Keep doing this until there is no more color sticking out, expanding by 1 pixel each time. You shouldn't even have to do it once, but each brush is different and this explains how to fix it "just in case."

Is the border that you want to use taller than it is wide and your photo is just the opposite? No problem! Most of these borders can be rotated and still work (except for the archway). Follow the steps exactly as they are written above, but just after you click once on the canvas to use the brush, click on Edit > Transform > 90° CW. Then continue on with the tutorial.

Tips for Particular Brushes

For most of the brushes in this pack, the above procedure is perfect for framing photos. There are a few brushes, however, that could use a bit of extra explanation.

Some of the borders are pure black, with no gradients of gray in them. With these borders, feel free to use the brush in whatever color you want, without needing a "Color" layer beneath it.

Brushes that are like this: decorative1, decorative3, decorative5, filmstrip, grunge1, grunge2, stamp.

You can see an example to the right. This is the "stamp" brush.

Some brushes - like the celtic brush - have "holes" or transparent areas in them. You may not want to create a solid "Color" layer, since it would show through these small holes. Instead of using the paint bucket tool, you may want to duplicate the "Brush" layer (right click on the "Brush" layer and choose "Duplicate Layer"), CTRL-E (Mac: Cmd-E) to merge that layer down, and then apply a color overlay to that layer (on the layers palette, click on the "Add a Layer Style" button - it looks like a cursive "f" inside a dark circle - and then choose "Color Overlay").

Another idea for how to deal with these kinds of brushes: you could make it so that the photo shows through the holes, instead of the background. To do this, you'll want to do away with the "Color" layer once again. Use the brush in whatever color you'd like, instead of black. Then, when it comes time to delete the edges of the photo, instead of selecting the inner portion of the frame, use the magic wand tool to select the outer portion of the frame. Expand it by 1-2 pixels by clicking on Select > Modify > Expand. Then select the Photo layer and hit DELETE. You'll end up with something like this.

Brushes with transparency/holes: Celtic, decorative1, decorative2, decorative3, decorative4, decorative4-inverse, decorative5, doily.

For the grunge brushes, the edges are far too uneven to use the above selection method to delete the edges of the photo. In the case of brushes grunge1 and grunge2, I would highly advise cropping the photo by hand.

Use the rectangle marquee tool to make a selection as close to the middle of the grunge border as you can, like I've done here. Once you've made your rectangle, CTRL-SHIFT-I (Mac: Cmd-Shift-I) to inverse the selection and then DELETE to remove the edges of the photo.

And last - but not least - we have the Polaroid brush. You could use the brush "Polaroid - white" to make a white border around a photo and then apply layer styles like drop shadow, bevel and emboss, etc. to make it look like a Polaroid. That's an option.

But if you'd like it to be more detailed than that, follow the course of this tutorial exactly, but use the "Polaroid - dark" brush to make your border. Then on your "Color" layer, make it white. See the level of detail on the border?

That's it! If you have any questions about this tutorial or how to use these brushes, please feel free to ask them at Stephanie's feedback and requests page.

If you are interested in downloading the image pack for these brushes, rather than the brushes themselves, you can find the Frames & Borders image pack here.

And of course, here's a link to the Frames & Borders Free Brush Set (zip/6.5MB). Below is a complete description of what you'll find inside. Have fun!

Read More...