Wednesday, July 28, 2010

Adding a Watermark to your Images

Surf the web and you’ll probably find several sites that use water- marks. This is especially true for sites dedicated to white-collar type businesses such as the one that belongs to our attorney Mr. Bing.
Watermarks are translucent designs. You’ve probably seen them mostly on fancy letterhead. We can reproduce watermark effects within Photoshop to give your website an air of professionalism.
  1. Click on the Bing_webheader.psd image. Then, create a new layer within this image. Call this new layer watermark.

  2. A great way to make watermarks in Photoshop is through the Wingdings font. If it’s not open already, access the Character palette by selecting WindowCharacter.

  3. In the Character palette, define the following settings:

    • Font Family: Wingdings 2

    • Font Size: 72 pt

    • Color: RGB = 13, 31, 1244.

  4. Select the Text tool. Click the watermark layer and then type the characters ab in lowercase. You should see two curly leaf characters display, as shown in figure below.

  5. With the watermark layer still selected, change the Blending Mode drop-down field from Normal to Overlay, as shown in figure below.
    Notice the watermark now appears transparent.
  6. With the watermark layer still selected, press Ctrl+T to transform your image. Hold down the Shift key and stretch your watermark so it fills most of the page.
  7. Rotate your watermark by placing your cursor near one of the corners of the Transform box that surrounds your image. Your cursor turns into a curved arrow. Click and drag your mouse to the right or left to rotate your image, as shown in figure below. Press Enter to complete the transformation.
  8. To remove the areas of watermark that are not overlaid, you’ll first need to rasterize your text. Right-click in the watermark layer. Then select Rasterize Layer.
  9. Select the web header layer. Then, select the Magic Wand tool.
  10. In the options bar, change the Tolerance to 100. Tolerance defines the areas Photoshop will select depending on the difference shades of color. A low tolerance means Photoshop is picky. A high tolerance (like 100) means Photoshop is not picky in its selections.
  11. Select the web header layer. Click somewhere within the web header area of your image, as shown in figure below.

  12. Click on the watermark layer. Then, select SelectInverse from the menu bar, as shown in figure below.



    Caution 
    In Photoshop CS2, users can no longer select an image within a layer by holding down the Control key and clicking. You’ll now need to use the Magic Wand tool to perform this action. If you’re familiar with older versions of Photoshop, this new method may seem a little foreign. Don’t worry, though. You’ll get used to it.
  13. Once you’ve selected Inverse, hit the Delete key on your keyboard. Notice the unwanted portion of your watermark is now gone, as shown in figure below.
  14. Save your web header. Then, combine all layers together by pressing Shift+Ctrl+E (or selecting LayerMerge Visible from the menu bar).


    In this tutorial:
    1. Pulling a Web Page Together
    2. Defining the Web Page
    3. Adding a Water to your Images
    4. Adding a Duotone Tinting to Images
    5. Pulling your images together onto one web page
    6. Slicing your web images

No comments:

Post a Comment