Getting Started with Fireworks A few tips: –Before you begin an assignment, be sure to create a folder on your drive for it. –If your canvas is checkered,

Slides:



Advertisements
Similar presentations
Working with Tables for Page Design – Lesson 41 Working with Tables for Page Design Lesson 4.
Advertisements

Macromedia Fireworks MX 2004 – Design Professional Importing, Selecting, and Modifying Graphics.
1 USING FIREWORKS Cropping an Image Obtaining Information Changing Image Size Rotating an Image Adjusting the Color of an Image Drawing Tools Using the.
Creating Animations – Lesson 71 Creating Animations Lesson 7.
Fireworks MX. 2 Lesson 1a—Create Slices & Hotspots n Fireworks allows you to add animation (behaviors) already written in ___________. n However, users.
COMPREHENSIVE Windows Tutorial 3 Personalizing Your Windows Environment.
Bitmap Editing – Lesson 1
Click your mouse for next slide Dreamweaver – Colors and Page Properties So far things are going just dandy aren’t they? You’ve been following FST’s fun.
© UNT in partnership with TEA1 Digital and Interactive Media Photoshop Basics.
Using the Photo Album in PowerPoint 2003 Multimedia Services at The Citadel Updated 6/18/07.
FIRST COURSE PowerPoint. XP New Perspectives on Microsoft Office 2007: Windows XP Edition2 What Is PowerPoint? PowerPoint is a powerful presentation graphics.
Removing White Backgrounds Using Adobe Fireworks.
 Insert a picture from a file  Move and delete images  Use the Picture Tools tab  Add styles, effects, and captions to images  Resize photos  Use.
XP Tutorial 7 New Perspectives on Microsoft Windows XP 1 Microsoft Windows XP Working with Graphics Tutorial 7.
BFTAW BDPA Workshop Introduction to GIMP Chris
BFTAW BDPA Workshop Introduction to GIMP Chris
XP New Perspectives on Microsoft Office FrontPage 2003 Tutorial 4 1 Microsoft Office FrontPage 2003 Tutorial 4 – Using Shared Borders and Themes.
Color Correct and Remove Keystoning A minimalist approach to photographing your art By Paul Marley.
Concrete Coalition Toolkit.  Look up your assigned addresses in the spreadsheet CCSF_VirtualSurvey.xlsx in the shared dropbox folder. Step 1.
Chapter 6 Images in Dreamweaver & Fireworks Mrs. Johnson Web Design.
DREAMWEAVER Adding photos and other tips!. Making photo gallery  Gather ALL the photos you need into your images folder. (remember to copy the URL so.
Microsoft Office 2013 ®® PowerPoint Tutorial 1 Creating a Presentation.
Chapter 10 Fireworks: Part II The Web Warrior Guide to Web Design Technologies.
Photoshop & Fireworks Helps & Hints Visual Design for the Web March 2007.
Slide 1 of 24 1) Launch Fireworks 2) Under File, choose New 3) In the New Document dialog box, enter Width: 100, Height 160, Resolution 72, and choose.
Processing and Exporting Images Ivan Zhekov Telerik Web Design Course html5course.telerik.com Front-end Developer
CIS 205—Web Design & Development Fireworks Chapter 1.
Creating Buttons – Lesson 51 Creating Buttons Lesson 5.
Laboratory Exercise # 9 – Inserting Graphics to Documents Office Productivity Tools 1 Laboratory Exercise # 9 Inserting Graphics to Documents Objectives:
Chapter 9 Fireworks: Part I The Web Warrior Guide to Web Design Technologies.
Working with Graphics – Lesson 21 Working with Graphics Lesson 2.
Animating GIF. What is it? Think of how a flip book works. Each page is a different picture and when flipped through quickly, it looks as though objects.
IT: Web Technologies: Web Animation 1 Copyright © Texas Education Agency, All rights reserved. 1 Web Technologies Designing Web Site Layout Using.
Lesson #4 Magazine Cover Graphic ArtsHampton Middle School Mrs. Werger, Mr. Scott, & Mr. Berwick.
Adobe/Macromedia Fireworks JAOIT 8. Fireworks – what is it? Adobe Fireworks (formerly Macromedia Fireworks) is a bitmap and vector graphics editor. It.
Introduction to Photoshop Altering photos 1 pixel at a time.
PLACING AND LINKING GRAPHICS
CIS 205—Web Design & Development Fireworks Chapter 2.
1 Layer up to keep warm… A short tutorial on the usage of layers.
Objective: Students will know the screen parts, tools, and menus of the Fireworks program. Students will be able to create a new document, create basic.
Know your computer Make a Folder Copy from Word to Composer Format the Font Change the Alignment Format the Background Format the Colors Insert a Picture.
Copyright © Texas Education Agency, All rights reserved.1 Web Technologies Motion Graphics & Animation.
XP Tutorial 3 Creating Animations. XP New Perspectives on Macromedia Flash MX Elements of Animation Layers are used to organize the content of.
Adobe Photoshop T.Ahlam Algharasi. Adobe Photoshop Adobe Photoshop is a seriously powerful photo and image edit ( treating and manipulation, compositing,
Introduction to Layers GIMP User Manual. What is a Layer? Every image in GIMP is made by combining one or more images called Layers laid on top of each.
Adobe ® Photoshop ® CS6 Chapter 1 Editing a Photo.
COMPREHENSIVE PowerPoint Tutorial 5 Applying Advanced Special Effects in Presentations.
Windows Tutorial 3 Personalizing Your Windows Environment
“ – Attribution (Difficult) Animated snow scene
Flash Interface, Commands and Functions
How to use this SPARKlab Authoring Template (PowerPoint 2008 for Mac)
Project Objectives Open an image Save an image Resize an image
Gimp Guide Mr Hall.
Digital and Interactive Media
Enhancing a Document Part 1
Chapter 1 Editing a Photo
Exercise 63 Use a Flash movie clip symbol to store an animation that you need to use more than once in an application. This is very important for keeping.
“Placeholder for a quote to be animated here.”
Enhancing a Document Part 1
iLEAD Academy Snow Day Expectations
… a white peppermint world as far as the eye could see…
DIRECTIONS: 1. Click Enable Editing in the yellow bar above.
PLACE YOUR TITLE HERE **Poster Author(s) Go Here
Inserting Pictures and Symbols in Word documents
ALASKA How did the U.S. acquire Alaska?
Introduction to PowerPoint
The work of moving ice Chapter 8 Animated snow scene (Difficult)
Vectors and Paths, also File Export
Welcome To Microsoft Word 2016
Presentation transcript:

Getting Started with Fireworks A few tips: –Before you begin an assignment, be sure to create a folder on your drive for it. –If your canvas is checkered, Go to the Modify at the top menu, select ‘canvas’ and then ‘white’. –You can change canvas size when you open a new file but also in the properties window found at the bottom of your screen. –Save your file as a.png (fireworks file) and then as a jpg/gif file so that you can insert it into other program applications such as Microsoft Word and PowerPoint. –You can zoom the image to make tracing easier with the lasso tool, this won’t permanently affect the image size. –When you are using the lasso tool and you reach the top of the screen but there is more image to trace, just move your mouse in the direction you wish to go and you will be able to continue tracing.

Tutorials for Fireworks umentation/en/fireworks/fw8/fw8_getting_s tarted.pdfhttp://download.macromedia.com/pub/doc umentation/en/fireworks/fw8/fw8_getting_s tarted.pdf

To create a new file in Fireworks 8: 1.Select File > New. The New Document dialog box opens. 2.Enter the canvas width and height measurements in pixels, inches, or centimetres. 3.Enter a resolution in pixels per inch or pixels per centimetre. 4. Select white, transparent, or a custom color for the canvas. 5.Click OK to create the new document. 6.Fireworks creates a PNG file. Using a PNG file as your source file has the following advantages: ■ The source PNG file is always editable. You can go back and make additional changes even after you export the file for use on the web. ■ You can slice complex graphics into pieces in the PNG file and export them as multiple files with different file formats and various optimization settings.

To save an image as a jpg /gif file Make sure you have saved your image as a.PNG file first in case you wish to go back and make changes. To save as a picture file (.jpg or.gif) – Go to File -> Save As -> Under doc type select.jpeg/jpg or.gif. And then add doc name. These newly created.jpg/.gif files can now be imported back into fireworks to put on a collage, re-manipulate in other ways, add to PPT, Word, etc.

Change Image Color - BEFORE

Change Image Color - AFTER How is my tracing with the lasso tool? Tip – Make sure to pay close attention to the edge, zoom in if you have to. Small clicks as you move around an object with your lasso tool will make more clean cut edges. Make sure that when your end and beginning trace marks come together that a small black square shows up first – this will indicate that your line has met up.

Horizontal Line - BEFORE

Horizontal Line Effect - AFTER The horizontal line tool will be found in the properties window at the bottom of your screen in Fireworks 8. Under solid window in fill options.

Cool Photo Frames- BEFORE

Cool Photo Frames- AFTER

Feathering - BEFORE

Feathering – FINAL Tips for feathering -Remember you are outlining the area you want to delete! (the negative space) -When tracing with the lasso tool, be sure to be just a little bit inside the positive space (the inner edge of this baby for example) so that you don’t have any background left after you feather. -To feather: right click on the selection you wish to delete, select ‘modify marquee’ then ‘feather’. Change pixel size - The large the pixel the more feathered (soft) the edge. -Remember to then press delete, this will take the background away! Critique? What could I have done better?

Motion Trail Effect - Bitmaps In this exercise you will need to convert the text to a Bitmap. Bitmaps are graphics composed of small colored squares called pixels, which combine like the tiles of a mosaic to create an image. To create a Bitmap in Fireworks 8, select the image with the marquee tool or select (arrow) tool, go to Modify and click on ‘flatten selection’. This will convert it to a bitmap for you. Once you do this you can’t change it back.

Motion Trail - Before

Motion Trail - After