Banner Tutorial Module 4: Working with Images LESSONS 11 & 12.

Banner TutorialBanner Tutorial

Module 4: Working with Images

LESSONS 11 & 12LESSONS 11 & 12LESSONS 11 & 12LESSONS 11 & 12



In this lesson, we will: Complete a tutorial using Microsoft Expression Design.

Explore graphic tools while creating a banner for a beach trip.



Guiding Questions How does Expression Design work?

What tools will you need to create a beach banner?



Web sites Learn Expression: http://www.learnexpression.com/?ad=ms

Expression Design Fills Video: http://preview.microsoft.com/video/videoDetails.aspx?video=f513aa65-843f-418b-8bf5-df80a8688535&vp_evt=eref&vp_video=Image+Fills+in+Expression+Design

Expression Design Text-on-Paths Video: http://preview.microsoft.com/video/videoDetails.aspx?video=c296d988-ba82-492f-9028-85dc29cac0a8&vp_evt=eref&vp_video=Expression+Design%3a+Text-on-Path



Banners Review Banners:

What is the purpose of a banner on a Web site?

How do banners influence the audience? Can you recall a specific banner that influenced you? How?

Open Banner Tutorial

Open Expression Design. On the File menu, click Open.

As you are working, save your banner in your folder.



ScenarioBy the end of these exercises using Microsoft Expression Design, you will

be able to:

Create and edit design files.

Export graphics.

Use Expression Design’s vector-based drawing tools.

Create graphical effects.

Change settings for optimization and export.



Banner Tutorial

1. Common Toolbar2. File Tabs3. Toolbox4. Artboard5. Properties Panel6. Layers Panel7. Action Bar



Review Layer: A transparent virtual page on which an object or objects are

placed in a drawing.

Grouping: Selecting and designating objects so that they will be treated as one object for the purposes of scaling, manipulating, and even changing attributes.

Path: A vector line or object (straight or curved) defined by a series of anchor points and segments.

Transform: Manipulate or change an object by rotating, reflecting, scaling, stretching, or skew it



Review Resolution: The pixel count (in dots per inch) of an image.

Distribute: Arrange the placement of three or more objects within a given space (vertically or horizontally) so that the distances between them are equal.

B-Spline: A tool that enables the designer to create Bezier paths (segments controlled by anchor points) by placing a series of anchor points in the direction the designer wants the path to follow.

Appearance Menu: A menu that contains tools such as color picker, quick swatches, fills, and effects.



Review Clipping Mask: A function in which one shape can mask areas in

another object. Path and shapes can be clipping masks.

Text: Editable typographical characters that are created to be read.

Canvas: The background area in which the image is set or created upon.

Exporting: Saving the image as a different graphic file type such as GIF or JPEG.



Exercises

EXERCISE 1 - Creating the Layers and Simple Background Elements for the Header Design

EXERCISE 2 - Adding the Text and Effects

EXERCISE 3 - Drawing the Sun Design

EXERCISE 4 - Drawing the Header Reflection

EXERCISE 5 - Exporting the Graphic



Assessment

In Expression Design, what is the importance of the Appearance Menu? How did you use it?

What did you do to get this banner ready for Web use?

Banner Tutorial Module 4: Working with Images LESSONS 11 & 12.

Documents