Adobe ImageReady 3
Foundation Level Course
What is ImageReady?
ImageReady is a graphics program that offers several tools
tailored to efficiently prepare your graphics for the Web
Opening and Importing Files
• To open a file in
ImageReady:
• From the main menu,
choose File > Open
OR press the Ctrl + O key
combination.
• Importing a file lets you
open files that have been
saved in formats that use
plug-in Import modules.
General Preferences
• The General Preferences
panel provides access to
the most important
environmental preference
settings.
ImageReady Workspace
• The workspace displays
the Toolbox, Canvas, Tool
Options bar, Menu bar,
Palettes and Status bar.
Marquee Tools
• There are four options for
the Marquee tool.
• Right-click on the Marquee
tool to view the pop-up
option and select another
Marquee tool.
Move Tool
• The Move tool (The same
tool as in Photoshop)
allows you to click and
drag a selection or layer of
your image. This is the
only way to move an
image.
Lasso Tools
• Lasso tools allow you to
click and drag to select a
free-form portion of pixels
within your image.
Magic Wand Tool
• The Magic Wand tool
enables you to select the
adjacent area of the samecolored pixels.
• To select discontinuous
areas, click in one area,
then Ctrl + Click in
another.
Image Map Tools
• Image Map tools allow you
to create a selection of
shaped areas around your
image.
Slice Tools
• Slice tools are used when
creating web graphics.
• With these tools, you can
cut images into
rectangular sections in
order for you to apply web
effects, links, rollovers and
animations to different
areas of the same image.
Eraser Tools
• Eraser tools allow you to
paint in the background
color or erase areas in a
layer to reveal layers
below.
Airbrush Tools
• The Airbrush tool enables
you to spray diffused
strokes of color, with
various levels of brush
thickness.
• The Airbrush also has a
sub-menu that holds two
other tools: Paintbrush
tool and Pencil tool.
Clone Stamp Tools
• Clone Stamp tool also
known as the Rubber
Stamp tool the copies one
portion of an image onto
another.
• The Clone Stamp tool also
has a sub-menu that holds
six other tools: Blur tool,
Sharpen tool, Smudge
tool, Dodge tool, Burn tool
and Sponge tool.
Rectangle Tools
• The Rectangle tool creates
rectangles filled with the
foreground color.
• The Rectangle tool also
has a sub-menu holds
three other tools: Rounded
Rectangle tool, Ellipse tool
and Line tool.
Paint Bucket Tool
• The Paint Bucket tool
allows you to fill a
contiguous area of
similarly colored pixels in
the picture with the
foreground color, or a
selected pattern.
Type Tool
• The Type tool enables you
to add text to an image or
just the Canvas.
Crop Tool
• The Crop tool allows you
to enclose a portion of the
image that you want
retained in a rectangular
boundary.
Eyedropper Tool
• The Eyedropper tool
chooses a color in the
image window as the
Foreground color.
Hand Tool
• The Hand tool allows you
to drag within the image
window, and scroll the
window to view a different
portion of the image.
Zoom Tool
• The Zoom tool allows you
to magnify an image to see
the individual pixels more
clearly.
Foreground and Background
Color Chip
• The Foreground and
Background Color Chip
allows you to change the
foreground color of your
image and/or image
window.
Toggle Image Maps Visibility
• Using the Toggle Image
Maps Visibility switches
between revealing and
hiding image maps.
Toggle Slices Visibility
• Using the Toggle Slice
Visibility switches between
revealing and hiding sliced
images.
Rollover Preview
• Using the Rollover preview
reveals rollover effects.
Preview in Default Browser
• Using Preview in Default
Browser gives you a
preview of your animation
in a browser.
Screen Modes
• Using Standard Screen
Mode allows different
views of your workspace.
Jump to Photoshop
• The Jump to Photoshop
button allows you to
automatically open the
Photoshop application.
Layers Palette
• The Layers Palette allows
you to make changes to an
image without altering
your original image data.
History Palette
• The History Palette
records every significant
operation (not including
preferences and settings)
and stores them in a list.
Actions Palette
• The Actions Palette allows
you to record, play, edit,
and delete individual
actions.
Info Palette
• The Info palette displays
information about the
color values beneath the
pointer and, depending on
the tool in use, other
useful measurements.
Color Palette
• The Color Palette is a very
useful and easy tool to use
for selecting colors.
• There are multiple
elements and options
contained in the palette to
select from.
Swatches Palette
• The Swatches Palette
allows you to collect
colors for future use.
• The foreground and
background colors can
also be set with this
palette.
Styles Palette
• With the Styles Palette you
can save layer effects and
blending options by
creating layer styles.
Character Palette
• The Character Palette
provides options for
formatting characters.
Paragraph Palette
• There are multiple options
to use within the
Paragraph Palette, and all
affect text created inside a
bounding box.
Optimize Palette
• Using the Optimize Palette
allows you to set and view
your optimization settings.
Layer Options Palette
• Using the Layer options
Palette allows you to
rename or name your
layers.
Create Slices
• For each slice created, a slice
number will appear in the
upper-left corner of the slice.
• You can turn the numbers off
by deselecting the Show Slice
Numbers check box on the
Options bar.
Edit Slices
• If overlapping slices were
created, access the top
one with the Slice Select
tool.
• Use the four stacking
order buttons near the left
end of the Options bar, to
change the stacking order.
Slice Options
• After a slice is created, you
can give the slice a
specific name, create a link
to a Web page, etc.
Save Slices
• To save your original
image with all slice
information intact:
• From the main menu,
choose File > Save As and
select either the
Photoshop or TIFF format.
Image Mapping
• Creating Image Slices will
divide a document into
multiple independent
graphics.
• Each slice can be made
into a button that a viewer
clicks on to jump to a
linked page or frame.
Styles
• Using the Styles Palette
allows you develop
buttons with a simple
mouse click.
JavaScript Rollovers
• When creating JavaScript
Rollovers, ImageReady
slicing functions make it
faster to create and
assemble HTML buttons.
• A rollover is a collection of
JavaScript functions that
will make a button change
according to the actions of
the mouse cursor.
Navigate Frames
• ImageReady can read all
frames in an animated GIF
file and automatically
separate each one to an
independent layer.
Animated Gif’s
• Creating Animated gifs
within ImageReady are
quite simple. ImageReady
has stream lined the
process so that the
development of Animated
gifs are created with ease.
Add and Organize Frames
• The Animation palette in
ImageReady works like an
expanded version of the
Rollover palette.
• Each frame in the palette
will show one or more
layers and hide all others.
Save and Optimize an Animation
• Saving an Animation is not
tricky, but it is a detailoriented process.
ImageReady GIF functions
are based on the slicing
metaphor, saving an
animation becomes a matter
of four Optimize features.
Web Settings for Optimization
• From the main menu,
choose File > Save
Optimized OR press the
Ctrl + Alt + S key
combination to open the
Save Optimized dialog
box:
GIF Settings for Optimization
• When GIF is selected from
the Format pop-up menu,
most of the options are
similar to the Indexed
Color and GIF Options
dialog boxes, but there are
a couple of additional
options.
JPEG Settings for Optimization
• The JPEG tab allows you
to change the image size
and resolution, just like
working with GIF images.
Optimization Menu
• The Optimize Menu has
some new options
allowing you to optimize
your image to it’s best
possible final look.
Saving PNG Images
• The Portable Network
Graphics format, or PNG
format, was designed to
outperform and ultimately
replace the GIF format.
Output Settings
• The Output Settings dialog
box, can control how
ImageReady saves slices
as individual graphic files,
generates code related to
links and HTML text that is
added to slices, and other
options.