RESOURCES  UNSW EDUCATIONAL DEVELOPMENT & TECHNOLOGY WEBSITE
Flexible EducationWeb & Media ProductionWebCT @ UNSWLearning Resource Catalogue
Web & Media Production
UNSW Educational Development & Technology Centre RESOURCES home RESOURCES home
 
    

 

Producing Content for the WebWeb Design & ConstructionAccessibility in Web Design

Visual content

Issues for visual content
Image production
Image acquisition
Image manipulation
bullet Image creation

Creating simple graphics in Photoshop

What is Photoshop?

Photoshop is basically a 'bitmap' editor, that is, it manipulates images that are composed of a series of coloured pixels. This is different from many drawing and painting programs which create 'vector' images, which are composed of a set of data which describes the image (eg a circle coloured red). Vector images can be infinitely enlarged without reduction in image quality ­ the data description simply changes to reflect the new size parameters. Bitmap images begin to deteriorate as soon as they are enlarged ­ the image editor will 'interpolate' new pixels to fill the gaps created by the enlargement, but it cannot generate new data.

Photoshop is a bitmap editor, which has some vector and web export tools.

Fireworks, on the other hand, is basically a vector drawing program for the web, with some bitmap editing tools.

Almost all web graphics (all GIFs and JPGs) are bitmaps, and should be created at the exact pixel size that they will be used.

The tools and functions that are explored here are, or have become, standard tools in most professional-level image editing programs. The Photoshop toolbox is illustrated here.

The default format of a Photoshop file is PSD (Photoshop document). This allows you to save all layers, including effects and vector paths, intact for further editing. Some other applications such as Fireworks and Flash will open PSD files with layers intact.

The default format of a Fireworks file is PNG (Portable Network Graphics). When reopened in Fireworks it will retain layer information, but in other applications opens as a flat PNG file.

Photoshop will open files in a range of formats, even vector graphics (Illustrator, Freehand or EPS), which will open as bitmaps (to open as editable paths, copy and paste into Photoshop, it will allow you to paste as path, pixels or shape). Vector graphics opened in Fireworks will retain editable path and layer information.

Both Photoshop and Fireworks will save as or export to a variety of formats, including GIF, JPG, PNG, TIF, BMP or 'native' (PSD or editable PNG).

EXAMPLES
Bitmap and vector graphics

ACTIVITY
Create a banner in Photoshop

EXPLORE
Transparency & layers
Photoshop tutorials

 
 
 
 

 

UNSW Educational Development & Technology Centre RESOURCES home RESOURCES home