BarsClubsCoffee/CafeContact UsDevonshire QuarterHomeHotelsLeopold SquareMenusPhotosPubsRestaurantsSportTheatres etc.TransportWeatherWest Street

Photoshop - Scan Lines

This ever-popular effect can be used as an overlay to give a "TV" effect on top of an image.

1. Begin by opening a new file 2px wide x 4 px high, transparent background. When it appears, zoom in to get a clear view.
2. Make sure Black is the Foreground Color and select the Pencil Tool Pencil Tool (it should be set to 1 px by default (check in the options bar), and carefully "paint" in the top half of the image: scan lines - 1
3. Now go to EDIT...Define Pattern. You will get a dialog box asking you to name this new pattern, it's up to you if you bother with this step.

4. Open a suitable image, create a new layer on top of this image and go to EDIT...Fill. The dialog box to the right will appear. Make sure you select "Pattern" and click on the pattern you've created (it will be the last pattern if this is the one you've created most recently).

girl with scan lines

Pattern dialog box
Variations: For vertical or diagonal scan lines, create an initial pattern as at the right: vertical scan lines
Vertical: 4 x 2px
diagonal scan lines
Diagonal: 4 x 4px

diagonal scan lines
Diagonal: 4 x 4px

Add a Layer Mask to the "scan line" layer, click on the second window in the layer as shown and drag with Black in the direction shown with the Gradient Tool .

scan lines with layer mask

scan lines - layers
Below is an image of a pistol where we isolated the "grip" by using the Pen Tool, created a new layer and filled the shape with scan lines. A touch of Bevel & Emboss, a slight lowering of the layers opacity and experimenting with various layer Blend modes can work wonders.
Pistol - no scan lines Pistol - scan lines
The color of the lines can be easily altered after applying them over an image by Ctrl + clicking the scan lines layer to get the marching ants going, changing the Foreground color and pressing Alt + backspace. Here, we've also applied a little "twirl" - FILTER...Distort...Twirl and a touch of Bevel and Emboss. scan lines - twirl
Text can be placed and then selected with the Magic Wand Tool and with Shift held down to add subsequent characters. When marching ants surround each item of text, create a new layer above the text layer and fill with scanlines. Here a 2 x 4px, red/transparent pattern was used. text with scanlines
Here, an imaginative use of blurs etc. in ImageReady creates this rollover navigation button. rollover button
Finally, a 2 x 4px image can be filled with two different colors. When it is set as the background image for a Web page it will "tile" or repeat seamlessly.