lecture 6 lecture 6: bitmap and raster images adjustment layers in image manipulation software and...

24
Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Upload: hugo-webb

Post on 18-Jan-2016

216 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Lecture 6

Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation SoftwareAnd Visual Design Principles

Page 2: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Adjustment Layers

Layers are an important concept in image manipulation.

If you wish to work with images non-destructively then you will need to understand adjustment layers concept.

Adjustment layers can be used whenever possible, as they are non-destructive.

Digital Media Production: Lecture 5 2

Page 3: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Adjustment Layers

In addition to ordinary layers, Photoshop offers Adjustment Layers, which contain no image content but allow certain types of changes to the image, such as adjustments to contrast or colour and the changes can be made without altering the pixels of the image itself.

Adjustment layers work in a different way from ordinary layers, and cannot be created through the menu on the Layers panel.

Digital Media Production: Lecture 5 3

Page 4: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Adjustment Layers cont.

Photoshop provides many ways of making adjustments to brightness and colour in an image.

Adjustment layers are an extension of the layer concept; you can think of adjustment layers as being layers that you look through and see an adjusted version of what lies beneath.

The dialogue boxes used to apply the adjustment are the same in Photoshop, but there are important differences between the two methods of application.

Digital Media Production: Lecture 5 4

Page 5: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Difference between adjustment layers and layers in general

When you add an adjustment layer, you are offered the option of setting a blending mode and opacity setting for it, as you are with a normal layer, which affects how the adjustment is applied to the pixels on underlying layers.

The adjustments associated with an adjustment layer affect any layers beneath it.

By moving the adjustment layer up or down in the Layers panel, you can affect different layers.

The adjustment is attached to the layer and is not actually applied to any pixels in the image (unlike the Image>Adjustments commands).

Digital Media Production: Lecture 5 5

Page 6: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 6

Adjustment Layers and Layers

When you use adjustment layers, you are free to experiment with adjustments.

You can always go back to an adjustment layer to change the parameter values.

If you decide not to apply the changes, you can just delete the adjustment layer, or you can hide it and add another to try a different set of alterations.

Page 7: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Tonal adjustments

Most of Photoshop’s tonal adjustment commands fall into one of two categories: “powerful and difficult or simple and useless”.

For example, the Levels and Curves adjustments, allow you considerable control over the tonal balance of an image, but getting the right result requires patience, experience and attention to detail.

Digital Media Production: Lecture 5 7

Page 8: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 8

Tonal Adjustments cont.

The Brightness/Contrast, Auto Levels and Auto Contrast adjustments can be made by selecting the command or dragging a couple of sliders, but the results are usually poor, and can often be worse than the original.

As a general rule, the best results are achieved in Photoshop by avoiding automatic features, and relying on your skill and judgement.

There is one tonal adjustment that is easier to master than Levels and Curves, and which can still produce good results.

Page 9: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Important adjustments

Shadow/Highlight is an important adjustment for exposure problems.

It often corrects the exposure problems and is simple to use, but the adjustment is destructive, so remember to keep a copy of the original layer.

Level adjustments allow you to adjust the brightness distribution and dynamic range of an image or a selected area of it.

Curves adjustments give you maximum control over the distribution, but can be difficult to use well and require some experience to master.

Digital Media Production: Lecture 5 9

Page 10: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Important adjustments cont.

The most basic adjustments you can make alter the distribution of light and dark tones in selected areas of an image.

The crudest adjustments of all are made with the brightness and contrast sliders, which are displayed when you add a Brightness/Contrast adjustment layer.

Digital Media Production: Lecture 5 10

Brightness and Contrast sliders

Page 11: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Web links

http://www.youtube.com/watch?v=hS8MJIWAhh0- (watch this video-5.5 minutes)

http://www.youtube.com/watch?v=zk4gpNVwPd8

(This video is 4 minutes in length)

Digital Media Production: Lecture 5 11

Page 12: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 12

Visual Communication Theories

In this part of the session, we will look at the important concepts used when we are working in media production.

Visual communication depends upon a range of psychological, cultural and physical factors that are in the environment.

Images and colours convey impressions which can be difficult to express.

Page 13: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 13

Visual Communication Theories cont.

The visual design principles include; clear layout, structured visual organization, careful use of contrast, tone, colour, a well-informed but practical approach to typography, presentation of images and well-designed video and animation.

All these factors must work together to make a multimedia application both easy and pleasant to use.

It is important to understand the importance of visual design principles.

The visual design principles makes impact on the successful implementation multimedia projects.

Page 14: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 14

Visual Communication Theories cont.

The basic principles of visual design have been developed through hundreds of years’ accumulated experience in traditional media.

Digital multimedia presents both new opportunities and new problems, especially where it is interactive.

With the exception of people who cannot see at all, every multimedia user will benefit from good visual design.

Page 15: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 15

Use graphics in media applications

Graphic symbols remove language barriers, within an established system of signs.

Graphic symbols can be understood more widely than written text.

Page 16: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 16

Visual Communication Theories cont.

Semiotics (or semiology, as it is known in Europe) was originally concerned with the way in which natural language is built up out of meaningless phonemes – that is, the distinguishable units of speech – into whole words that have meaning.

In semiotics, we distinguish between the signifier, which is the form which the sign takes (a word, when we are considering natural language), and the signified, which is the meaning or concept which the sign refers to.

Page 17: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 17

Signifier and Signified Relationship

It is essential to grasp the relationship between the signifier and the signified.

The signifier is a sign’s form – for example, a word or a graphic symbol and the signified is the specific meaning or concept which a sign refers to.

The relationship between the signifier and the signified is arbitrary and can only be understood within a particular system of signs.

Context and users’ experience will determine whether a user will understand a sign correctly.

Page 18: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 18

Signifier and Signified Relationship cont.

The designer of the interface or Web page relies upon a combination of convention, context and users’ experience to convey signification accurately to the user.

All three of these factors require that the user has some pre-existing knowledge to draw on, which might not always be the case.

It is important to remember that the connection between visual symbols (signifiers) and what they signify is arbitrary.

Page 19: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 19

Signifier and Signified Relationship cont.

We cannot expect a users to guess what is being signified, except on the basis of experience.

An arrow may signify many objects that are around us, and at any time it could come to be associated with a new meaning.

Page 20: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 20

Signifier and Signified relationship cont.

An Example:

A weather forecasting site which offers a set of predictions for temperature, precipitation, wind speed, using graphic symbols to indicate the different weather types.

What do you think the important issues are to consider in this example?

Page 21: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 21

Example of Signifier and signified relationship

Important issues to consider include:

Symbols must be used in a consistent way – so that the same graphic (signifier) is always used for bright sunshine (signified), for instance – and organized on the page in a way that is visually coherent.

This may be so intuitively obvious that few people will stop to think about it, but imagine how confusing it would be if the symbol for bright sunshine was a different size, a different colour, or even of a different.

The user would probably be confused with different symbols used and would try to work out what the meaning of each symbol is.

Page 22: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 22

Using text and tables as signifier

A weather forecasting site offers a set of predictions for temperature, precipitation, wind speed, using text to indicate the different weather types.

Identify the visual communications issues in the table below:

Monday Heavy Rain

Tuesday Heavy Rain

Wednesday Heavy Rain

Thursday Heavy Rain

Friday Heavy Rain

Saturday Heavy Rain

Sunday Heavy Rain

Page 23: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 23

Example cont.

Visual communications issues in the example in previous slide include:

The font used for the forecast “Heavy Rain” is different almost every time it appeared in the table.

Many users would assume that there was a reason for the font to change in the table.

We will look at concept of using “graphics and text” in media industry more in depth when we are working with Illustrator in a few weeks time.

Page 24: Lecture 6 Lecture 6: Bitmap and Raster Images Adjustment Layers in Image Manipulation Software And Visual Design Principles

Digital Media Production: Lecture 5 24

THANK YOU!