adobe flash cs4 – illustrated unit b: creating graphics and text
TRANSCRIPT
![Page 1: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/1.jpg)
Adobe Flash CS4 – Illustrated
Unit B: Creating Graphics and Text
![Page 2: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/2.jpg)
Adobe Flash CS4 – Illustrated
Objectives
Understand vector and bitmap graphics
Create a new document
Set tool options and create a shape
Reshape an object
Select and modify a shape
Copy and transform an object
Use design panels
Create text
Modify text
![Page 3: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/3.jpg)
Adobe Flash CS4 – Illustrated
Understanding Vector andBitmap Graphics
Bitmap images For static design elements or limited
animation
Vector graphics Often used in Flash Create with drawing tools on Tools panel
![Page 4: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/4.jpg)
Adobe Flash CS4 – Illustrated
Understanding Vector andBitmap Graphics
Bitmap graphics Vector graphics
Display image as a matrix of dots (pixels) on a grid
Consist of a finite number of pixels
Resolution-dependentResizing affects image
quality
Mathematically calculated
Composed of anchor points and straight or curved line segments (collectively form a path)
Appear smooth; appropriate for illustrations
Resolution-independentOffer more flexibility than
bitmap images
![Page 5: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/5.jpg)
Adobe Flash CS4 – Illustrated
Understanding Vector andBitmap Graphics
Comparing vector and bitmap images
![Page 6: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/6.jpg)
Adobe Flash CS4 – Illustrated
Understanding Vector andBitmap Graphics
Resolution Degree of clarity, detail, and sharpness
of displayed or printed image Expressed by number of pixels per
square inch; (the higher the better)
Flash drawing modes Merge Drawing mode
• Assumes that objects’ paths combine
Object Drawing mode• Treats object as a whole
![Page 7: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/7.jpg)
Adobe Flash CS4 – Illustrated
Understanding Vector andBitmap Graphics
Comparing objects in Merge Drawing and Object Drawing modes
![Page 8: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/8.jpg)
Adobe Flash CS4 – Illustrated
Creating a New Document
Several methods to precisely measure and position objects on the Stage Display rulers Create guides Display a grid
![Page 9: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/9.jpg)
Adobe Flash CS4 – Illustrated
Creating a New Document
Document Properties dialog box
![Page 10: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/10.jpg)
Adobe Flash CS4 – Illustrated
Creating a New Document
Viewing the grid turned on in a document
![Page 11: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/11.jpg)
Adobe Flash CS4 – Illustrated
Creating a New Document
Grid dialog box
![Page 12: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/12.jpg)
Adobe Flash CS4 – Illustrated
Setting Tool Options and Creating a Shape
Tools panel is separated into sections, each containing related tools(e.g., drawing, view, and selection)
Many tools have tool options at the bottom of the Tools panel
![Page 13: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/13.jpg)
Adobe Flash CS4 – Illustrated
Setting Tool Options and Creating a Shape
Drawing and painting tools
![Page 14: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/14.jpg)
Adobe Flash CS4 – Illustrated
Aligning Objects on the Stage
Snap Align
Snap to Grid
Snap to Guides
Snap to Objects
Snap to Pixels
Viewing rulers, guides, and alignment lines
![Page 15: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/15.jpg)
Adobe Flash CS4 – Illustrated
Setting Tool Options and Creating a Shape
Select colors for strokes and fills using color pop-up window
Setting stroke color by clicking a color swatch
![Page 16: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/16.jpg)
Adobe Flash CS4 – Illustrated
Setting Tool Options and Creating a Shape
Creating a shape
![Page 17: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/17.jpg)
Adobe Flash CS4 – Illustrated
Reshaping an Object
Selection Tool Manipulates shape directly by dragging
object’s border into a different contour
Zoom Tool Adjusts the view
Guide layer Contains a shape you can use to
• Trace or align objects• Create a motion path for animated objects
![Page 18: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/18.jpg)
Adobe Flash CS4 – Illustrated
Reshaping an Object
Modifying a shape
![Page 19: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/19.jpg)
Adobe Flash CS4 – Illustrated
Reshaping an Object
Creating a curve
![Page 20: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/20.jpg)
Adobe Flash CS4 – Illustrated
Selecting and Modifying a Shape
Selection tools
![Page 21: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/21.jpg)
Adobe Flash CS4 – Illustrated
Selecting and Modifying a Shape
Selecting a fill
![Page 22: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/22.jpg)
Adobe Flash CS4 – Illustrated
Selecting and Modifying a Shape
Selecting part of a stroke
![Page 23: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/23.jpg)
Adobe Flash CS4 – Illustrated
Copying and Transformingan Object
Transform an object by Scaling Rotating Skewing Distorting
Different ways to copy an object from outside or within the program
Reconfigure objects using options for the Free Transform Tool
![Page 24: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/24.jpg)
Adobe Flash CS4 – Illustrated
Copying and Transformingan Object
Options for the Free Transform Tool
![Page 25: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/25.jpg)
Adobe Flash CS4 – Illustrated
Copying and Transformingan Object
Copying and pasting a selection
![Page 26: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/26.jpg)
Adobe Flash CS4 – Illustrated
Copying and Transformingan Object
Positioning the rotate pointer
![Page 27: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/27.jpg)
Adobe Flash CS4 – Illustrated
Copying and Transformingan Object
Paste and drag options from Edit menu Paste in Center Paste in Place Paste Special Duplicate
![Page 28: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/28.jpg)
Adobe Flash CS4 – Illustrated
Using Design Panels
Perform specific design functions
Click a command on Window menu to open panels
Frequently used panels Dock in an existing panel group Create a new panel group
![Page 29: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/29.jpg)
Adobe Flash CS4 – Illustrated
Using Design Panels
Info panel Shows information based on where pointer is on the Stage
Align panel Sizes, aligns, or distributes multiple objects to Stage or each other
Transform panel Performs functions of the Free Transform Tool
Color panel Contains features for adjusting object’s stroke and fill colors
Swatches panel Contains colors from active color palette, or set, of available colors
![Page 30: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/30.jpg)
Adobe Flash CS4 – Illustrated
Using Design Panels
Viewing the Info and Align panels
![Page 31: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/31.jpg)
Adobe Flash CS4 – Illustrated
Using Design Panels
Skewing an object using the Transform panel
![Page 32: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/32.jpg)
Adobe Flash CS4 – Illustrated
Using Design Panels
Viewing the Color panel and Swatches panel
![Page 33: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/33.jpg)
Adobe Flash CS4 – Illustrated
Creating Text Using the Text Tool
Text block Object containing text that can be moved
and modified• Modifiable text attributes: font, size, style,
color, alignment, orientation, and spacing
Variable-width text Text block expands as you type
Fixed-width text Width is limited by size of text block
![Page 34: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/34.jpg)
Adobe Flash CS4 – Illustrated
Creating Text
Creating a fixed-width text box
![Page 35: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/35.jpg)
Adobe Flash CS4 – Illustrated
Creating Text
Viewing fixed-width text
![Page 36: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/36.jpg)
Adobe Flash CS4 – Illustrated
Creating Text
Creating variable-width text
![Page 37: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/37.jpg)
Adobe Flash CS4 – Illustrated
Modifying Text
Use features on Properties panel Character and Paragraphs sections
(font attributes, indent, margins, text orientation)
Options section (link to a Web site) Filters section (drop shadow, bevel,
glow)
![Page 38: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/38.jpg)
Adobe Flash CS4 – Illustrated
Modifying Text
Editing text attributes
![Page 39: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/39.jpg)
Adobe Flash CS4 – Illustrated
Modifying Text
Sampling a color
![Page 40: Adobe Flash CS4 – Illustrated Unit B: Creating Graphics and Text](https://reader036.vdocuments.site/reader036/viewer/2022062407/56649e205503460f94b0c8be/html5/thumbnails/40.jpg)
Adobe Flash CS4 – Illustrated
Modifying Text
Aligning text