260 likes | 450 Views
OVERVIEW. Unit Lessons. Create a new document and import files Learn about the Macromedia Fireworks window Work with bitmap and vector images Create and modify text. INTRODUCTION. Understanding Fireworks. Fireworks MX is a graphics program for the Web
E N D
OVERVIEW Unit Lessons • Create a new document and import files • Learn about the Macromedia Fireworks window • Work with bitmap and vector images • Create and modify text
INTRODUCTION Understanding Fireworks • Fireworks MX is a graphics program for the Web • Fireworks MX integrates seamlessly with other Macromedia programs • Dreamweaver • Flash • FreeHand • Director
INTRODUCTION Understanding Fireworks • What can you do in Fireworks MX? • Work with vector objects and bitmap images • Add JavaScript-enabled interactivity and animation • Optimize files for the Web
LESSON 1 Working with Files • Fireworks files are called documents • Fireworks files are saved as PNG files • Portable Network Graphics • have .png extension
LESSON 1 File Formats • Many file formats can be imported into Fireworks • Fireworks documents can be exported to many file formats • You can copy and paste images into Fireworks
LESSON 1 File Formats Available options for Fireworks
LESSON 2 The Fireworks Window • The Fireworks workspace is the area where you work with documents, tools, and panels • Panels help perform specific functions • Tools panel houses tools • Layers panel organizes objects
LESSON 2 The Fireworks Window • Property inspector • used to modify selected object • shows properties specific to a tool or command • docked at bottom of workspace
LESSON 2 The Fireworks Window • The document window has four tabs • Original • Preview • 2-Up • 4-Up • 2-Up and 4-Up are used to evaluate different optimization settings side by side
LESSON 2 The Layers Panel • Layers are used to manipulate objects • Objects are the individual elements in your document, such as text or images • Layers function like folders, divided into sections that contain objects
LESSON 2 The Layers Panel • Layers can be • hidden or shown • locked or unlocked • rearranged • duplicated • deleted • collapsed or expanded • renamed
LESSON 2 The Layers Panel • Objects can be moved to new layers Great Crusts object being moved to Background layer
LESSON 3 Bitmap Images • A bitmap graphic represents a picture image as a matrix of dots, or pixels, on a grid • Resolution refers to the number of pixels in an image • onscreen resolution is 72 or 96 pixels per inch
LESSON 3 Bitmap Images • Bitmap images should not be scaled in order to preserve quality • Bitmap file formats • BMP • PICT • GIF • JPEG • PNG • TIFF • PSD (Adobe Photoshop)
LESSON 3 Bitmap Images • Bitmap tools in Fireworks are used to modify pixels • Blur tool • Sharpen tool • Burn tool • Dodge tool • Smudge tool • Rubber Stamp tool
LESSON 3 Vector Objects • Vector objects are mathematically calculated objects composed of • anchor points • straight or curved line segments
LESSON 3 Vector Objects • Vector objects are created in Fireworks with • Shape tools • Pen tool • Text tool • Line tool • Vector objects can be manipulated using the Subselection tool
LESSON 3 Bitmap and Vector Objects Bitmap graphic imported into Fireworks Vector object created with Rectangle tool
LESSON 3 Positioning Objects • You can align and position bitmap and vector objects using • Rulers • Guides • Grid • Objects can snap to guides • Guides can be hidden or shown using the View menu
LESSON 4 Working with Text • Text can be created and modified in Fireworks • Text properties include font, size, color,style, kerning, leading, alignment, text flow, offset, and anti-aliasing
LESSON 4 Working with Text • Kerning adjusts the space between adjacent letters or a range of letters • Leading adjusts the amount of space between lines of text • Anti-aliasing blends the edges of type to the color behind them • You can choose Crisp, Strong, Smooth or No anti-aliasing
LESSON 4 Working with Text • Fixed-width text blocks are created by dragging the Text tool on the canvas to a fixed size • Clicking the Text tool on the canvas and typing creates an auto-sized text block
LESSON 4 Attaching Text to a Path • Text can be attached to a path to create an interesting design • Create text • Create path using Pen tool • Use Attach to Path command on Text menu
LESSON 4 Attaching Text to a Path • You can edit text on a path • To edit a path, you must detach the text first using the Detach from Path command Text on a path
SUMMARY Unit Summary • Fireworks creates graphics for Web • You can import and export many file formats • The workspace includes canvas, tools, and panels • Objects are organized in the Layers panel • The Property inspector helps you modify a selected object and shows options for tools
SUMMARY Unit Summary • You can manipulate bitmap images and create vector objects • You can align and position objects using guides, grid and the ruler • You can create and modify text with many formatting features found in word processors • Text can be attached to a path and detached if necessary