The Work Area
|
|
Creating Web Graphics Using Photoshop The Work Area |
The following pages are intended as a basic introduction to creating and manipulating existing web graphics using Photoshop.
Photshop is a powerful graphics tool that allows you to create and edit graphic images.
According to Adobe, Photoshop enables "designers and photographers to create original artwork, correct color, retouch and composite scanned images, and prepare professional-quality separations and output with more flexibility than ever before. With a wealth of powerful painting and selection tools, plus multiple layers, special effects filters, and lighting effects, Adobe Photoshop is a camera for your mind."
This tutorial will familiarize you with of the basic features and functions of Photoshop.
The Photoshop work area includes the image window, the Toolbox, and the numerous moveable palettes.
here are 20 icons visible on the Toolbox, but several options are hidden. To use a tool currently visible in the Toolbox, click on its icon.
Hidden options are indicated by a small black triangle in the lower right corner of an icon. If you click and hold your mouse over an icon with hidden options, you can find and choose from those hidden tools.
Here are the tools available from Toolbox:
And here is a short description of what each tool does:
is used to create shaped
selections. The crop 
tool is also
available in the Marquee's hidden options.
is used to create freehand selections. 
is a painting tool which
allows you to spray paint like a real airbrush. 
clones patterns--and the Pattern Stamp (a hidden
option on this icon) can be used to apply patterns. 
allows you to erase pixels. 
tool allows you to blur edges. Hidden options on this icon allow you to sharpen
smudge pixels. 
allows you to draw
paths and to add, delete, and select points on a
path (more information onpaths is given below). 
works like a ruler, measuring distances. 
will fill a selected
area with the foreground color. 
tool will allow you to grab and move the image around the work area. 
is applied when
you use a painting tool or add type to your image. is applied when
you use the eraser to erase pixels.
allow you to switch between standard view, full view, and
full view with no menu bar. 
tool allows you to move a layer or a
selection.
selects similar colored pixels adjacent to the current
pixel. 
allows you to paint freehand. You can choose different size
brushes from the Brushes Palette. 
restores pixels you have edited to their prior state. 
allows you to draw freehand lines. 
tool allows you to lighten pixels. The hidden options on this tool also allow you
darken or saturate and desaturate pixels. 
tool allows you to add text to
your images.
tool creates linear color blends. 
allows you to select
olors from the current image. 
acts like a magnifying glass, allowing
you to enlarge and reduce the image view size.
Palettes are floating windows that control the different aspects of Photoshop. Photoshop offers 12 palettes for editing images. The palettes are grouped into the following categories to save screen space:
You can view and use any of the palettes by selecting Show [Palette you want to use] from the Window menu.
To display a palette at the front of the palette group, click on its tab.
The colors Palette is used for mixing and choosing colors.
The Swatches Palette is used for choosing already mixed colors.
The Brush Palette is used to choose the size of the brushes. You can select from hard-edged tips, soft-edged tips, and large brush tips.
The Navigator Palette can be used for changing the image's view size or moving an image in its window.
The Info Palette displays the color breakdown for the pixel currently under the mouse pointer as well as the x/y coordinate position of the pointer on the image.
The Options Palette defines the attributes for a tool, such as its opacity.
The History Palette allows you to undo one or more of the previous steps you made in the image-editing process.
The Actions Palette works much like a Macro, allowing you to record and play back a series of commands on one or more images.
More information on the Layers/Channels/paths Palettes are provided in the section below.
Using layers is like drawing on acetate transparencies which you stack on top of one another to make one image.
Layers are transparent where there are no images and opaque where there are images.
You work on each layer individually without affecting the other layers.
You can only work on the layer that is currently highlighted on the Layers Palette.
The Layers palette is used to create, copy, merge and delete layers; to create layer masks and to hide or show layers.
The layers palette will show all the current layers in the image you are working on.
Here is an example of what the Layers Palette looks like for an image that has two layers:
If the Layers/Channels/Paths Palette is not visible when you open an image in Photoshop, from the Window menu, select Show Layers.
Channels contain information about the color elements in an image. Channels are semi-transparent, colored-light overlays.
Photoshop automatically creates color information channels when you open a new image.
The color mode determines the number of default color channels in an image. An image can have up to 24 channels.
You can create additional channels (called alpha channels) to create and store masks.
You can use masks to protect an area of your image from editing or to alter a particular area of your image.
The Channels Palette displays all channels that make up an image.
Below is an example of what the Channels Palette looks like for an image in RGB mode:
A path is a line or shape you create using the pen tools. Paths are used to create selections or fill areas.
Paths are determined by anchor points, which may anchor a line, curve, or corner. Paths must have at least two anchor points.
The Paths Palette contains all the tools needed to create and/or edit paths.
There are two types of paths.
Once you've created a path you can make a selection, fill a path (with the current foreground color), or stroke a path (fill the path outline with color).
Now that we've reviewed the Photoshop work area, we're ready to start with some basic image editing.
|
the work area | basic image editing | preparing images for the web |
| techniques | links | ||