Working With Animation: Introduction to Flash

Size: px
Start display at page:

Download "Working With Animation: Introduction to Flash"

Transcription

1 Working With Animation: Introduction to Flash With Adobe Flash, you can create artwork and animations that add motion and visual interest to your Web pages. Flash movies can be interactive users can click buttons or rollover images to stop, start, or move to another segment of the movie. You can create vector artwork using Flash or you can import graphics, music, and sounds into your Flash movie. You animations are exported as Flash Player movies. These movies are compact, which allows for faster downloads on the WWW. The Process Creating animation with Flash is similar to directing a movie. You first assemble your actors [images, artwork, sound] on the Stage. You then block the scene and have your actors move to their new position. When you are through filming the scene, you can edit it, you can play it back, slow it down or speed it up, or move that scene to another part of the movie. Your final product is a series of frames synchronized to a Timeline. The Flash Interface The Stage You use the Stage to assemble your cast members for each frame in a movie. You can draw objects using Flash s Toolbox, or you can import artwork from other applications. Information Technology Services, UIS 1

2 The Timeline The Timeline determines the timing of the movie, controlling how fast or slow frames are displayed over time. It is also where you create layers, which help you organize the various elements on the Stage. Note the Playhead. The red rectangle will move across the Timeline to show you the current frame on the Stage. The Panels Panels let you view information on selected elements in your movie. You can then make adjustments and change options for those selected items. For example, if you have selected text on your Stage, you can go to the Character, Paragraph, or Text options on the Properties panel to make changes to the text. To view all the available panels, choose the Window menu item. To hide all the Panels, choose Window > Hide Panels. Information Technology Services, UIS 2

3 The Controller To play, rewind, or step through a movie, you can use the Flash Controller. To access the Controller, choose Window > Toolbars > Controller. The Tools Panel With Flash s Tools panel, you can create artwork and text, as well as change views. The Tools panel is divided into four sections: Tools, Views, Colors, and Options. Tools for creating shapes, paths, and lines. Page views [Zoom] and navigation. Colors for lines and fills. Tool modifiers for selected tools. Information Technology Services, UIS 3

4 Creating a Flash Movie 1. To create a new movie, choose File > New. 2. The New Document dialog box is displayed. Click OK. Setting the Movie Properties 1. To set the movie properties, choose Modify > Document. The Document Properties dialog box is displayed. Dimensions: These options determine the stage size in pixels. Match: You can match the size to the printing dimensions or to the content of the movie. Background color: This sets the background color for the movie. Frame rate: This sets the number of frames played per second. Most WWW movies use a frame rate between 8 and 12. Ruler units: This sets the unit for the rulers along the top and side of the application window. 2. When you have competed the settings, click on OK. Information Technology Services UIS 4

5 Saving a Flash File 1. To save the movie you are working on, choose File > Save. Select the folder you wish to save the file and name the file. Flash will automatically add the.fla file extension. 2. Click on Save. NOTE: When you use the Save command, you can open up the Flash file and edit it. If you Export the file as a Flash Player Movie for use on the WWW, the file is compressed and you can no longer edit the file. Information Technology Services UIS 5

6 Drawing Rectangles and Squares 1. Select the Rectangle Tool from the Tools panel. 2. Set the Fill and Stroke color by clicking on the icon and selecting a color. 3. To set the transparency for a fill, choose Window > Color if the Color panel is not already open. Set the Alpha value for transparency. Notice you can set fill and color from the Color panel, and access the Web-safe color swatches from the Swatches panel. 4. Set the thickness and style of the stroke from the Properties panel. You may also set the color and characteristics of the fill from this panel. 5. Bring your cursor to the Stage. You will notice that the cursor icon becomes a crosshair. 6. For the Rectangle tool, specify rounded corners by clicking the Round Rectangle modifier and entering a corner radius value. A value of zero (0) creates square corners. 7. Position the cursor where you want one corner of the shape to be and holding down the mouse button, drag open the shape. To constrain the rectangle to a square, hold down the shift key as you drag opens the shape. Selecting Shapes Unlike many drawing programs, Flash creates shapes that have the fills separate from the strokes. Select the Selection Tool from the Tools panel. If you click on the middle of the rectangle, you will notice that only the fill is selected. You can tell this by the dotted pattern that is now on the fill but not on the stroke. If you double-click inside the rectangle, you will notice that both the fill and the stroke are selected. If you click on any segment of the stoke, only that segment is selected. This only applies to rectangles. When you click on any part of an oval s stroke, the entire stroke is selected. Information Technology Services, UIS 6

7 If you double-click on any stroke segment, the entire stroke around the object is selected. Once you have selected the fill or the stroke segments, you can then change the color by using the Fill and Stroke tools on the Tools panel. Altering and Selecting If you move the Arrow tool toward a shape or path, you will notice that the cursor icon becomes an arrow and a curved line. This indicates that you can now drag the path to change the size or shape of the curve on the path. If you click directly on the line, your cursor becomes an arrow with a four-headed arrow. This indicates that you can move the path without changing its shape. If you position your cursor on a corner or on the end of the line, the cursor becomes an arrow with a square corner. Overlapping Shapes When you draw or move one shape on top of the other, the portion underneath is deleted. If two shapes are the same color, then they are merged into one shape. Drawing Ovals and Circles 1. Select the Oval Tool. 2. Set the fill and stroke attributes by clicking the icon and selecting a color. 3. Position the cursor on the Stage. Your cursor icon will be displayed as a cross. 4. Holding down the mouse button, drag and open the shape. To constrain the oval to a circle, hold down the shift key as you drag open the shape. Information Technology Services, UIS 7

8 Drawing with the Line Tool 1. Select the Line Tool. 2. Drag the cursor across the Stage. Hold down the shift key to constrain the line to 45 degrees. Drawing with the Pencil Tool 1. Select the Pencil Tool. 2. Drag the cursor across the Stage to create the path. 3. There are three pencil Options that you can select: Straighten draws a straight line. If you draw a freehand triangle, oval, circle, rectangle, or square, this mode will convert your approximations into the actual shape. Smooth draws curved lines. Ink draws freehand lines with no alternation. Drawing with the Pen Tool With the Pen tool, you can create straight lines and Bezier curves that are defined by their endpoints. You choose where the curve begins and ends, and Flash fills in the curve. This tool is used to make smooth curves as well as straight lines. This is the precision drawing tool. Creating a Straight Line 1. Position the cursor where you want the beginning of the line. Click once and let go of the mouse button. 2. Move your cursor where you want the end of the line or line segment. Double-click. Information Technology Services, UIS 8

9 Creating Multi-Segment Lines and Polygons 1. Position the cursor where you want the beginning of the line. Click once and let go of the mouse button. 2. Move your cursor where you want to end of the first segment and the start of the second, and click. 3. To end a line, double-click. 4. To close a polygon, position on the beginning point. You will notice a circle next to the Pen icon. When you see the circle, click once. Creating Curves 1. Position your cursor at the start of the curve. Hold down the mouse button. 2. With the mouse button still held down, drag the mouse in the direction you want the curve. You will see two tangent handles, which show you the height and angle of the curve you are drawing. 3. When the tangent handle defines the curve you want, let go of the mouse. 4. Move the cursor where the curved segment will end and hold down the mouse button. Drag the mouse so that the control points are properly defining the next curve segment you will be drawing. Let go of the mouse. 5. To end the path, double-click. Painting with the Brush Tool 1. Select the Brush Tool and choose a fill color. 2. Select a Brush Mode from Options. These options apply when all objects are on the same layer. Paint Normal paints on top of other fills and lines. Paint Fills paint only fills and not strokes. Paint Behind covers only blank areas on the Stage. Paint Selection applies a new color to the selected area. Paint Inside paints fills and does not allow you to go outside the lines. 3. Select a Brush size and shape. 4. Position the cursor on the stage and drag the Brush to paint. Information Technology Services, UIS 9

10 Using the Eraser Tool 1. Click on the Eraser Tool and simply drag it across the objects to delete. To erase everything on the Stage, double-click the Eraser tool. To erase only strokes or only fills, click on the Faucet modifier from Options, then click on the stroke or fill. Use the Mode modifiers to erase only fills, only lines, both, or only those fills that are selected. Layers The layering feature in Flash gives you flexibility in designing your artwork and animations. With layering, you can lock parts of your image into place, hide portions of your artwork, and specify layers to animate. Show/Hide Lock/Unlock Show as Outlines Layer Name Insert Layer Delete Layer Adding and Naming Layers To show the layer features, we will create two layers, for a total of three layers. We will add a shape to each layer. 1. We will start by drawing a red circle on the first layer. 2. Select both the fill and stroke. Choose Modify > Group. Information Technology Services, UIS 10

11 3. To rename the layer, double-click on Layer 1 and type in the new name. We will call this layer red. 4. To add the next layer, click on the Insert Layer icon. 5. Name this layer blue and draw a blue circle on the Stage. Group the fill and stroke. 6. Add a third layer and call the layer white and draw a white circle on the Stage. Group the fill and stroke. Showing and Hiding Layers 1. To hide a layer, go to the layer on the layer listing and click on the black dot that is under the eye icon. Note the red X that appears when you click. 2. To show the layer again, click on the red X. Locking and Unlocking Layers 1. To protect your artwork from being accidentally altered as you are working on other shapes or paths around it, you can place the art on its own layer, and then lock it. For example, in our example, we will lock the red layer by clicking on the black dot under the lock icon. A lock appears. Also, note that the Layer Name pencil is crossed out. 2. To unlock the layer, click on the lock icon. Reordering Layers 1. The order of the layers in the layer information box determines the stacking order of the artwork on the Stage. For example, we could move the blue circle over the red circle, and because the blue circle layer is on top of the red, the blue circle will always be on top of the red circle. 2. If we want the red circle to appear on the top, we must reorder the layers in the layer information box. Information Technology Services, UIS 11

12 Animation Although there are several ways of creating animation in Flash, all animation is based on the concept of changing content over time. In this workshop, we will look at Tweening, which is the simplest way of animating graphics of any type. Timeline The Timeline determines the timing of the movie, controlling how fast or slow frames are displayed over time. It is also where you create layers, which help you organize the various elements on stage. Keyframe A keyframe is a frame in which you define a change to an object s properties for an animation or include ActionScript code to control some aspect of your document. Within the Timeline, there are numbered frames. When you want to change the content, you insert a keyframe. The keyframe indicates a change. Frame Types in Flash Term Empty/Blank Keyframe F7 Definition An empty keyframe has no visual representation. It means that there is no artwork on the stage on that frame. By placing artwork on the stage, you will fill an empty keyframe. The Flash Timeline, by default, opens with an empty keyframe. As soon as you put content on the stage, the empty keyframe will change to a keyframe. Information Technology Services, UIS 12

13 Keyframe F6 Frame F5 A solid circle represents a keyframe that contains content. A keyframe can also contain actions or sounds and is represented by a hollow circle. By default, adding a keyframe in Flash copies the content from the previous keyframe. The timeline in Flash looks like it has many frames in each layer, which can be a bit deceiving. While it has the slots for frames, you have to specifically define them as frames. Frame Rate The frame rate indicates the speed of the movie. It is shown in frames per second [fps] at the bottom of the Timeline. For WWW movies, 12 fps usually gives the best results. Animating with Tweening With tweening, you create your artwork in the first and last frames of your animation. Flash fills in the intermediate steps [or the steps between]. Tweening creates a minimal file size, since Flash only stores the changes between the frames and not the complete frames. There are two types of tweening: motion tweening and shape tweening. Motion tweening means changing the position of an object along the Timeline. Shape tweening means changing the properties of the objects along the Timeline. Motion Tweening 1. Begin by creating a graphic of type to use in the animation. 2. Go to the Timeline and select the frame where you want the animation to end. 3. Choose Insert > Timeline > Keyframe. 4. With the keyframe selected, move the text or graphic on the Stage. Use the shift key to limit the movement in a straight line. 5. Click and select the first and last frames. 6. Choose Insert > Timeline > Create Motion Tween. 7. To test the animation, open the Controller and click on the Play button. Information Technology Services, UIS 13

14 Motion Tweening with a Motion Path 1. Begin by creating a motion tween. 2. Position the cursor on the first frame. 3. From the Properties panel, select Orient to Path. 4. Choose Insert > Timeline > Motion Guide. This inserts a new guide layer. Guide layers are not published with the Flash movie. 5. Make the Guide Layer active by clicking on it. Use a drawing tool to draw a motion path. 6. In the first frame, drag the shape by its registration point and snap it to the beginning of the line. 7. In the last frame, drag the shape by it registration point and snap it to the end of the line. 8. To test the animation, open the Controller. 9. Click on the Play button. Shape Tweening With shape tweening, you will change an object s shape over time. Shape tweening can also include changing the object s location on the stage, as well as color and size. With shape tweening, you can create morphing effect, with one shape transforming into another. 1. Using the Oval tool, draw a circle on Frame 1 Layer 1. This will be the starting frame of this shape tween animation. 2. Select Frame 12 on Layer 1 and press F7 to add a blank keyframe. The circle on your screen will disappear so you have a place to draw the ending frame of this animation. 3. Using the Rectangle tool, draw a square along the right side of the stage. This will be the ending frame of your animation. 4. Double-click anywhere in the Timeline between the two keyframes to select the range of frames. You want to make sure you have this selected before you apply the shape tween. Information Technology Services, UIS 14

15 5. On the Properties panel, select Shape from the Tween drop-down menu. This will create a shape tween between the two keyframes in Layer 1. Green tinting and solid arrow on the timeline indicate an active shape tween. 6. Press return [Macintosh] or Enter [Windows] on your keyboard to preview your animation. The circle will gradually turn into a square. Multiple Shape Tweens So far, we have learned how to create a single shape tween. There will likely come a time when you will want to create more than one shape tween in your project. In the following example, you will learn how to create multiple shape tweens by placing them on separate layers. Working with multiple layers is the best way to choreograph animations with multiple tweens. 1. Open the file named mutplshptwn.fla file located inside the Flash folder on the desktop. You will notice four layers: one layer named background with the hula girl s body parts that will remain stationary and three more layers where you will apply motion tweens to make her skirts and arms move. 2. Double-click on each of the layer names to give them new, more descriptive names. Name layer 1 Left Arm, Layer 2 Right Arm, and layer 3 Skirt. It is important to name the layers so that it is easy to recognize what content is on that layer. 3. Click the Lock icon at the top of the Layers panel to lock all the layers at once. Click the Skirt layer s Lock icon to unlock the layer. 4. On the Skirt layer, press F6 on Frame 20 and again on Frame 40 of the Skirt to add keyframes to those frames. This process duplicates the artwork on those specific frames. You should now see artwork from Frame 1 of the Skirt layer, representing the beginning of the animation, artwork on Frame 20, which will represent the middle of the animation, and then artwork on Frame 40, which will represent the end of the animation. 5. Next, make sure that your Playhead is over Frame 20. Since this is where you want the animation to change, you are going to slightly alter the artwork on Frame 20. Move you pointer over the right side of the skirt and notice how the cursor icon changes to a curved line. Move the right side of the skirt outward and the left side inward. 6. To animate the hula girl s skirt, all you have left to do is to add a shape tween. Click on the right side of the Skirt layer name to select all the frames on that layer. From the Properties panel, choose Tween > Shape. This will generate a shape tween between each of the two keyframes. 7. Press the return [Macintosh] or Enter [Windows] key to see the shape tween in action. Information Technology Services, UIS 15

16 8. Lock the Skirt layer and unlock the Right Arm layer. You are going to create the shape tween for the right arm. 9. On the Right Arm layer, press F6 on Frame 20 and again on Frame 40 to add keyframes to those frames. This process duplicates the artwork on those specific frames. You should now see artwork from Frame 1 of the Right Arm layer, representing the beginning of the animation, artwork on Frame 20, which will represent the middle of the animation, and then artwork on Frame 40, which will represent the end of the animation. 10. Click on Frame 20 to select all the artwork in that frame. Move the arm slightly towards the center, just to the middle of the skirt. Click anywhere on the stage to deselect the artwork and modify the shape by dragging out the left side. 11. To animate the hula girl s right arm, all you have left to do is to add a shape tween. Click on the right side of the Right Arm layer name to select all the frames on that layer. From the Properties panel, choose Tween > Shape. This will generate a shape tween between each of the two keyframes. 12. Press the return key to see the shape tween in action. 13. Lock the Right Arm layer and unlock the Left Arm layer. You are going to create the shape tween for the left arm. 14. Repeat steps 9 through 12 on the Left Arm layer to create the shape tween for the left arm. Be sure to move it slightly left of the existing arm so that you can see them both in the final animation. 15. On Frame 40 of the Background layer, press F5 to add frames so that you can see the hula girl s stationary parts throughout the animation. 16. Press the return [Macintosh] or Enter [Windows] key to test your animation! Acknowledgements Flash Hands-On Training, Lynda Weinman Introduction to Flash, Karen Rohne Information Technology Services, UIS 16

Overview of the Adobe Flash Professional CS6 workspace

Overview of the Adobe Flash Professional CS6 workspace Overview of the Adobe Flash Professional CS6 workspace In this guide, you learn how to do the following: Identify the elements of the Adobe Flash Professional CS6 workspace Customize the layout of the

More information

Working With Animation: Intermediate Flash

Working With Animation: Intermediate Flash Working With Animation: Intermediate Flash Creating a Frame-by-Frame Animation To create a frame-by-frame animation, you define each frame as a keyframe and create a different image for each frame. Each

More information

Lesson 7 - Creating Animation II

Lesson 7 - Creating Animation II Lesson 7 - Creating Animation II A. Motion-Tweened Animation With motion tweening, you can easily create motion effects for the objects in your Flash movies. Kites flying, balls bouncing, rocks rolling

More information

Adobe Illustrator CS5 Part 1: Introduction to Illustrator

Adobe Illustrator CS5 Part 1: Introduction to Illustrator CALIFORNIA STATE UNIVERSITY, LOS ANGELES INFORMATION TECHNOLOGY SERVICES Adobe Illustrator CS5 Part 1: Introduction to Illustrator Summer 2011, Version 1.0 Table of Contents Introduction...2 Downloading

More information

Flash MX 2004 Animation Lesson

Flash MX 2004 Animation Lesson Flash MX 2004 Animation Lesson By Tonia Malone Technology & Learning Services 14-102 Lesson Opening a document To open an existing document: 1. Select File > Open. 2. In the Open dialog box, navigate to

More information

Macromedia Flash MX Key Concepts Tutorial Learn the basics of Flash animation

Macromedia Flash MX Key Concepts Tutorial Learn the basics of Flash animation Macromedia Flash MX Key Concepts Tutorial Learn the basics of Flash animation 1 Macromedia Flash MX Key Concepts Tutorial Overview Flash is a powerful piece of software, with applications ranging from

More information

Lava Lamp. Step 2. Click Window Menu > Other Panels > Common Libraries > Stuff to Trace.

Lava Lamp. Step 2. Click Window Menu > Other Panels > Common Libraries > Stuff to Trace. Flash Chapter 16 A. Setup to Trace Bitmap. Step 1. Click File Menu > New and OK. Lava Lamp Click Window Menu > Other Panels > Common Libraries > Stuff to Trace. Find lavalamp.png in the list of symbols

More information

MACROMEDIA FLASH MX ~A Step-by-Step Guide~

MACROMEDIA FLASH MX ~A Step-by-Step Guide~ MACROMEDIA FLASH MX ~A Step-by-Step Guide~ 1 LESSON 1 1.1 INTRODUCTION TO FLASH You will need to know: Movie or animation Frames Layers Timeline Stage Toolbox and Modifiers Layers Timeline Menu Toolbox

More information

Macromedia Flash MX 2004

Macromedia Flash MX 2004 Arrow tool Line tool Pen Tool Oval tool Pencil tool Subselect tool Lasso tool Text tool Rectangle tool Brush tool Free Form Transform Ink Bottle tool Dropper tool Fill Transform tool Paint Bucket tool

More information

Flash MX Image Animation

Flash MX Image Animation Flash MX Image Animation Introduction (Preparing the Stage) Movie Property Definitions: Go to the Properties panel at the bottom of the window to choose the frame rate, width, height, and background color

More information

m ac romed ia Fl a s h Curriculum Guide

m ac romed ia Fl a s h Curriculum Guide m ac romed ia Fl a s h Curriculum Guide 1997 1998 Macromedia, Inc. All rights reserved. Macromedia, the Macromedia logo, Dreamweaver, Director, Fireworks, Flash, Fontographer, FreeHand, and Xtra are trademarks

More information

Flash 5 Notes. Contents: Starting Flash

Flash 5 Notes. Contents: Starting Flash Flash 5 Notes Contents: Starting Flash... 1 Starting a new movie... 2 Drawing with flash... 3 The timeline... 3 Animation... 4 Motion Tweens... 4 Grouping Objects... 6 Layers... 7 Inserting Layers... 7

More information

Adobe Photoshop CS6 Tutorial

Adobe Photoshop CS6 Tutorial Adobe Photoshop CS6 Tutorial GETTING STARTED Adobe Photoshop CS6 is a popular image editing software that provides a work environment consistent with Adobe Illustrator, Adobe InDesign, Adobe Photoshop

More information

Introduction to Macromedia Flash 8

Introduction to Macromedia Flash 8 Introduction to Macromedia Flash 8 Flash Workspace Current scene Tools panel Timeline Panels Layers Workspace Stage Property inspector 2 Stage You compose movie content on the Stage. Set Stage size to

More information

Adobe Flash CS 6. Level 2. Topics: Vectors,Shapes and Graphics Layers Gradient Text

Adobe Flash CS 6. Level 2. Topics: Vectors,Shapes and Graphics Layers Gradient Text Adobe Flash CS 6 Level 2 Topics: Vectors,Shapes and Graphics Layers Gradient Text Note: Like most things in Flash, animation does not require any ActionScript. However, you can create animation with Action-

More information

MovieClip, Button, Graphic, Motion Tween, Classic Motion Tween, Shape Tween, Motion Guide, Masking, Bone Tool, 3D Tool

MovieClip, Button, Graphic, Motion Tween, Classic Motion Tween, Shape Tween, Motion Guide, Masking, Bone Tool, 3D Tool 1 CEIT 323 Lab Worksheet 1 MovieClip, Button, Graphic, Motion Tween, Classic Motion Tween, Shape Tween, Motion Guide, Masking, Bone Tool, 3D Tool Classic Motion Tween Classic tweens are an older way of

More information

QUICK REFERENCE: ADOBE ILLUSTRATOR CS2 AND CS3 SECTION 1: CS3 TOOL BOX: PAGE 2 SECTION 2: CS2 TOOL BOX: PAGE 11

QUICK REFERENCE: ADOBE ILLUSTRATOR CS2 AND CS3 SECTION 1: CS3 TOOL BOX: PAGE 2 SECTION 2: CS2 TOOL BOX: PAGE 11 QUICK REFERENCE, ADOBE ILLUSTRATOR, PAGE 1 QUICK REFERENCE: ADOBE ILLUSTRATOR CS2 AND CS3 CS2 SECTION 1: CS3 TOOL BOX: PAGE 2 SECTION 2: CS2 TOOL BOX: PAGE 11 SECTION 3: GENERAL CONCEPTS: PAGE 14 SELECTING

More information

Creating Hyperlinks & Buttons InDesign CS6

Creating Hyperlinks & Buttons InDesign CS6 Creating Hyperlinks & Buttons Adobe DPS, InDesign CS6 1 Creating Hyperlinks & Buttons InDesign CS6 Hyperlinks panel overview You can create hyperlinks so that when you export to Adobe PDF or SWF in InDesign,

More information

Lynda.com > InDesign CS5 Tutorials Interactive Documents & Presentations

Lynda.com > InDesign CS5 Tutorials Interactive Documents & Presentations Creating Interactive Documents with PDFs and SWFs Adapted from Chris Converse, http://www.codifydesign.com/ Laurie Burruss laurie@lynda.com Pasadena City College Dec 9 3 pm Lynda.com > InDesign CS5 Tutorials

More information

Chapter 3: Animation. Creating Frames and Keyframes. After completing this module, you ll be able to:

Chapter 3: Animation. Creating Frames and Keyframes. After completing this module, you ll be able to: AIM Your Project with Flash: Chapter 3 - Animation 47 Chapter 3: Animation After completing this module, you ll be able to: create, comment, and use frames and keyframes. distinguish types of Flash animation.

More information

Logo Design Studio Pro Guide

Logo Design Studio Pro Guide Logo Design Studio Pro Guide This guide is distributed with software that includes an end-user agreement, this guide, as well as the software described in it, is furnished under license and may be used

More information

Adobe Illustrator CS6 Tutorial

Adobe Illustrator CS6 Tutorial Adobe Illustrator CS6 Tutorial GETTING STARTED Adobe Illustrator CS6 is an illustration program that can be used for print, multimedia and online graphics. Whether you plan to design or illustrate multimedia

More information

SMART BOARD Essentials

SMART BOARD Essentials SMART BOARD Essentials Date: October, 2013 Version: 1.0 Version Control Information Version Date Description 1.0 21/10/2013 Course release File Path S:\ADM-HR\L-and-OD\Staff Development\Enterprise System

More information

2. How to Use SMART Board as a Projector and Whiteboard

2. How to Use SMART Board as a Projector and Whiteboard Page 1 Smart Board Getting Started Smart Board is an interactive whiteboard developed by SMART Technologies that combines the capabilities of a data projector and a white board. Use the SMART Board to

More information

Introduction to Macromedia Flash MX

Introduction to Macromedia Flash MX Introduction to Macromedia Flash MX Digital Media Workshop Series Jason anavan Media Specialist 400 Taunton Rd. East Whitby, ON L1R 2K6 Table of ontents Foreward...3 Why use Flash?...4 Setup...5 Layout

More information

Motion tween is nothing but tweening a Symbol's movement from one position to another.

Motion tween is nothing but tweening a Symbol's movement from one position to another. Multi lt3f Simple Animation using Adobe Flash CS5 Required : 1. Satisfy all the examples and exercises given.provide your own graphic files.2. Apply the appropriate animation for the facial expressions

More information

Fireworks 3 Animation and Rollovers

Fireworks 3 Animation and Rollovers Fireworks 3 Animation and Rollovers What is Fireworks Fireworks is Web graphics program designed by Macromedia. It enables users to create any sort of graphics as well as to import GIF, JPEG, PNG photos

More information

POWER BASICS. Creating a slide from scratch. Adding text to a slide. Adding another slide. Saving Your Presentation.

POWER BASICS. Creating a slide from scratch. Adding text to a slide. Adding another slide. Saving Your Presentation. Creating a slide from scratch POWER BASICS 1. Open the PowerPoint program. The PowerPoint dialog box appears. 2. In the PowerPoint dialog box, click the Blank Presentation option button. The New Slide

More information

Graphic Design Basics Tutorial

Graphic Design Basics Tutorial Graphic Design Basics Tutorial This tutorial will guide you through the basic tasks of designing graphics with Macromedia Fireworks MX 2004. You ll get hands-on experience using the industry s leading

More information

m ac romed ia Fi r e wo r k s Curriculum Guide

m ac romed ia Fi r e wo r k s Curriculum Guide m ac romed ia Fi r e wo r k s Curriculum Guide 1997 1998 Macromedia, Inc. All rights reserved. Macromedia, the Macromedia logo, Dreamweaver, Director, Fireworks, Flash, Fontographer, FreeHand, and Xtra

More information

Welcome to CorelDRAW, a comprehensive vector-based drawing and graphic-design program for the graphics professional.

Welcome to CorelDRAW, a comprehensive vector-based drawing and graphic-design program for the graphics professional. Workspace tour Welcome to CorelDRAW, a comprehensive vector-based drawing and graphic-design program for the graphics professional. In this tutorial, you will become familiar with the terminology and workspace

More information

SMART Notebook 10 User s Guide. Linux Operating Systems

SMART Notebook 10 User s Guide. Linux Operating Systems SMART Notebook 10 User s Guide Linux Operating Systems Product Registration If you register your SMART product, we ll notify you of new features and software upgrades. Register online at www.smarttech.com/registration.

More information

ImageJ Quick Reference

ImageJ Quick Reference The ImageJ user interface ImageJ Quick Reference The ImageJ user interface is nearly identical for Windows and Macintosh operating systems, except for the location of the menu bar. Windows Under Windows,

More information

Recipes4Success. Animate a Rocket Ship. Frames 6 - Drawing Tools

Recipes4Success. Animate a Rocket Ship. Frames 6 - Drawing Tools Recipes4Success You can use the drawing tools and path animation tools in Frames to create illustrated cartoons. In this Recipe, you will draw and animate a rocket ship. 2014. All Rights Reserved. This

More information

Figure 3.5: Exporting SWF Files

Figure 3.5: Exporting SWF Files Li kewhatyou see? Buyt hebookat t hefocalbookst or e Fl ash + Af t eref f ect s Chr i sjackson ISBN 9780240810317 Flash Video (FLV) contains only rasterized images, not vector art. FLV files can be output

More information

Lession: 2 Animation Tool: Synfig Card or Page based Icon and Event based Time based Pencil: Synfig Studio: Getting Started: Toolbox Canvas Panels

Lession: 2 Animation Tool: Synfig Card or Page based Icon and Event based Time based Pencil: Synfig Studio: Getting Started: Toolbox Canvas Panels Lession: 2 Animation Tool: Synfig In previous chapter we learn Multimedia and basic building block of multimedia. To create a multimedia presentation using these building blocks we need application programs

More information

SMART Board Interactive Whiteboard Setup with USB Cable

SMART Board Interactive Whiteboard Setup with USB Cable SMART Board Interactive Whiteboard Setup with USB Cable The instructions below are for the SMART Board interactive whiteboard 500 series and apply to both desktop and laptop computers. Ready Light USB

More information

Smart Board Notebook Software A guide for new Smart Board users

Smart Board Notebook Software A guide for new Smart Board users Smart Board Notebook Software A guide for new Smart Board users This guide will address the following tasks in Notebook: 1. Adding shapes, text, and pictures. 2. Searching the Gallery. 3. Arranging objects

More information

How to build text and objects in the Titler

How to build text and objects in the Titler How to build text and objects in the Titler You can use the Titler in Adobe Premiere Pro to create text and geometric objects. There are three methods for creating text, each capable of producing either

More information

FLASH. Mac versus PC. Pixels versus Vectors Two kinds of images are in the digital world: bitmaps and vectors:

FLASH. Mac versus PC. Pixels versus Vectors Two kinds of images are in the digital world: bitmaps and vectors: FLASH Macromedia Flash is a multimedia graphics program especially for creating moving images for use on the Web. Flash has opened up a whole new world for digital animators. You can rotoscope with it,

More information

How to create a Flash banner advert in DrawPlus X2

How to create a Flash banner advert in DrawPlus X2 How to create a Flash banner advert in DrawPlus X2 Open DrawPlus X2 and choose Start New: Keyframe Animation Select WebPlus 10 Flash Banner and click on Open The work area should look like the screenshot.

More information

Understand the Sketcher workbench of CATIA V5.

Understand the Sketcher workbench of CATIA V5. Chapter 1 Drawing Sketches in Learning Objectives the Sketcher Workbench-I After completing this chapter you will be able to: Understand the Sketcher workbench of CATIA V5. Start a new file in the Part

More information

Designing and animating characters in Flash Part 1: Drawing tools and symbols Adobe Developer Connection

Designing and animating characters in Flash Part 1: Drawing tools and symbols Adobe Developer Connection Designing and animating characters in Flash Part 1: Drawing tools and symbols Chris Georgenes Adobe Certified Expert mudbubble.com (www.adobe.comhttp://www.mudbubble.com/) keyframer.com (www.adobe.comhttp://www.keyframer.com/)

More information

Impress Guide. Chapter 5 Creating Graphic Objects

Impress Guide. Chapter 5 Creating Graphic Objects Impress Guide Chapter 5 Creating Graphic Objects Copyright This document is Copyright 2007 2009 by its contributors as listed in the section titled Authors. You may distribute it and/or modify it under

More information

PowerPoint 2007: Basics Learning Guide

PowerPoint 2007: Basics Learning Guide PowerPoint 2007: Basics Learning Guide What s a PowerPoint Slide? PowerPoint presentations are composed of slides, just like conventional presentations. Like a 35mm film-based slide, each PowerPoint slide

More information

Graphic Design Studio Guide

Graphic Design Studio Guide Graphic Design Studio Guide This guide is distributed with software that includes an end-user agreement, this guide, as well as the software described in it, is furnished under license and may be used

More information

FLASH PART 1. First we are going to look at basic shape drawing and animation tools and the workspace.

FLASH PART 1. First we are going to look at basic shape drawing and animation tools and the workspace. FLASH PART 1 Introduction Flash is Macromedia's powerful vector-based animation tool. Flash is the defacto standard for Internet multimedia because it allows authors to create online multimedia presentations

More information

mimio and mimio Studio are trademarks or registered trademarks of Sanford, L.P. All other trademarks are the property of their respective holders.

mimio and mimio Studio are trademarks or registered trademarks of Sanford, L.P. All other trademarks are the property of their respective holders. User Guide Copyright 2008 Sanford, L.P. All rights reserved. No part of this document or the software may be reproduced or transmitted in any form or by any means or translated into another language without

More information

SMART Board Training Packet. Notebook Software 10.0

SMART Board Training Packet. Notebook Software 10.0 SMART Board Training Packet Notebook Software 10.0 Chris de Treville Chris.deTreville@avispl.com 6301 Benjamin Road Suite 101 Tampa, FL 33634 p: 813.884.7168 f: 813.882.9508 SMART Board Welcome Center

More information

In this lesson, you ll learn to:

In this lesson, you ll learn to: LESSON 3: INTERACTIVITY BASICS OBJECTIVES In this lesson, you ll learn to: make your Flash movie interactive apply actions to specific frames create interactive buttons create and edit symbols in the Library

More information

Dear Candidate, Thank you, Adobe Education

Dear Candidate, Thank you, Adobe Education Dear Candidate, In preparation for the Graphic Design and Illustration certification exam, we ve put together a set of practice materials and example exam items for you to review. What you ll find in this

More information

Fireworks CS4 Tutorial Part 1: Intro

Fireworks CS4 Tutorial Part 1: Intro Fireworks CS4 Tutorial Part 1: Intro This Adobe Fireworks CS4 Tutorial will help you familiarize yourself with this image editing software and help you create a layout for a website. Fireworks CS4 is the

More information

ClarisWorks 5.0. Graphics

ClarisWorks 5.0. Graphics ClarisWorks 5.0 Graphics Level 1 Training Guide DRAFT Instructional Technology Page 1 Table of Contents Objectives... Page 3 Course Description and Organization... Page 4 Technology Requirements... Page

More information

PowerPoint 2007 Basics Website: http://etc.usf.edu/te/

PowerPoint 2007 Basics Website: http://etc.usf.edu/te/ Website: http://etc.usf.edu/te/ PowerPoint is the presentation program included in the Microsoft Office suite. With PowerPoint, you can create engaging presentations that can be presented in person, online,

More information

Creating and Editing Graphic Information In Adobe Illustrator

Creating and Editing Graphic Information In Adobe Illustrator Creating and Editing Graphic Information In Adobe Illustrator Tutorial Updated August 2006 CP-208 Plan Preparation Studio - Prof. Elizabeth Macdonald 2 In this tutorial we will learn two things: First,

More information

Flash MX: 3D Text Rotation Animation

Flash MX: 3D Text Rotation Animation Flash MX: 3D Text Rotation Animation Objectives: To create and animate text around an object or image in Flash MX Tools & Techniques: Masking, Animation, Fireworks MX, Text Around Path, Exporting From

More information

SMART Notebook Software Learner Resource

SMART Notebook Software Learner Resource SMART Notebook Software Learner Resource SMART Notebook Software Version 10 For Windows Operating System SMART Technologies ULC 3636 Research Road NW Calgary, AB T2L 1Y1 CANADA Phone 1.888.42.SMART or

More information

Flash Tutorial Part I

Flash Tutorial Part I Flash Tutorial Part I This tutorial is intended to give you a basic overview of how you can use Flash for web-based projects; it doesn t contain extensive step-by-step instructions and is therefore not

More information

Smart Technologies SMART Training 1 Rev. 01/03/2007

Smart Technologies SMART Training 1 Rev. 01/03/2007 Smart Technologies SMART Training 1 Rev. 01/03/2007 Table of Contents Rev. 01/03/2007 Overview...3 Sympodium and SMART Board Basics...4 SMART Tools...7 Notebook Software...12 Ink Aware and Microsoft Word...15

More information

Paint Brush. Paint Object Creator. Crop. Wand. Marquee. Lasso. Remote Move. Pencil. Eraser. Marker. Airbrush. Neon. Bucket. Blend. Blur.

Paint Brush. Paint Object Creator. Crop. Wand. Marquee. Lasso. Remote Move. Pencil. Eraser. Marker. Airbrush. Neon. Bucket. Blend. Blur. Canvas Draw Tools Canvas Draw Tools Selection tools Painting Line Selection Paint Brush Line Lasso selection Paint Object Creator Kinked Direct edit lasso selection Crop Smooth Kinked Direct group selection

More information

Florence School District #1

Florence School District #1 Florence School District #1 Module 1: SMART Board Basics SMART Board Basics Revised Jan 2015 1 SMART Board Interactive Whiteboard Basics The SMART Board interactive whiteboard 600 and 800 series is touch

More information

Sharing a Screen, Documents or Whiteboard in Cisco Unified MeetingPlace

Sharing a Screen, Documents or Whiteboard in Cisco Unified MeetingPlace Sharing a Screen, Documents or Whiteboard in Cisco Unified MeetingPlace Release: 7.0 Revision Date: December 9, 2009 1:29 pm This section describes how to use the features in the Cisco Unified MeetingPlace

More information

Adding Animation With Cinema 4D XL

Adding Animation With Cinema 4D XL Step-by-Step Adding Animation With Cinema 4D XL This Step-by-Step Card covers the basics of using the animation features of Cinema 4D XL. Note: Before you start this Step-by-Step Card, you need to have

More information

Does cropping actually cut the picture s edges? (PPT 409) No. Although you cannot see the cropped edges, they exist until you save the file.

Does cropping actually cut the picture s edges? (PPT 409) No. Although you cannot see the cropped edges, they exist until you save the file. Microsoft Office 2010: Advanced Q&As PowerPoint Chapter 7 How does PowerPoint determine the area to display within the marquee? (PPT 405) Microsoft Research software engineers developed the algorithms

More information

Maya 2014 Basic Animation & The Graph Editor

Maya 2014 Basic Animation & The Graph Editor Maya 2014 Basic Animation & The Graph Editor When you set a Keyframe (or Key), you assign a value to an object s attribute (for example, translate, rotate, scale, color) at a specific time. Most animation

More information

Creating a Flash.swf animation

Creating a Flash.swf animation GRC 119 Assignment 5 Creating a Flash.swf animation 1. How to get started in Flash 2. Creating layers and adding content 3. Tweening or animating between two keyframes 4. How to import multiple images

More information

Create A Collage Of Warped Photos

Create A Collage Of Warped Photos Create A Collage Of Warped Photos In this Adobe Photoshop tutorial, we re going to learn how to create a collage of warped photos. Now, don t go letting your imagination run wild here. When I say warped,

More information

Chapter 9 Slide Shows

Chapter 9 Slide Shows Impress Guide Chapter 9 Slide Shows Transitions, animations, and more Copyright This document is Copyright 2007 2013 by its contributors as listed below. You may distribute it and/or modify it under the

More information

SMART Board Training Outline Trainer: Basel Badran

SMART Board Training Outline Trainer: Basel Badran Sharjah Higher Colleges of Technology SMART Board Training Outline Trainer: Basel Badran What is a SMART Board? o Concept & Technology SMART Board Components: o Smart Tools Start Center Recorder Keyboard

More information

Creating a poem using Flash

Creating a poem using Flash Creating a poem using Flash These instructions show you how to turn a poem into an animated presentation. Use this to get started but then try to be confident to adapt your own work in your own special

More information

PageMaker I. Getting Started. 1. Window Parts. Minimize, Maximize/Restore, Close. Title Bar Menu. Ruler (Horizontal) Ruler (Vertical)

PageMaker I. Getting Started. 1. Window Parts. Minimize, Maximize/Restore, Close. Title Bar Menu. Ruler (Horizontal) Ruler (Vertical) Getting Started 1. Window Parts Minimize, Maximize/Restore, Close Title Bar Menu Ruler (Horizontal) Ruler (Vertical) Tool Box Vertical Scroll Bar Paper Edge Guides (a) Size Corner (b) Page Icons (c) Page

More information

Chapter 1 : A Quick Tour of Adobe ImageReady

Chapter 1 : A Quick Tour of Adobe ImageReady 1 Chapter 1 : A Quick Tour of Adobe ImageReady This tour provides an overview of the key features of Adobe ImageReady and also describes some of the integrated Web preparation features of the Adobe Photoshop

More information

Exploring Macromedia Flash MX

Exploring Macromedia Flash MX September 27, 2002 Julie Albertson, ECC Exploring Macromedia Flash MX What is Flash? Flash is a stand-alone piece of software for producing and delivering high-impact multimedia and web experiences. Developers

More information

Simple Flash Animation

Simple Flash Animation Simple Flash Animation Flash is a powerful graphics-oriented animation and programming environment. Flash has many uses, from simple movie animations to interactive games. This example contains no user

More information

Acrobat PDF Forms - Part 2

Acrobat PDF Forms - Part 2 Acrobat PDF Forms - Part 2 PDF Form Fields In this lesson, you will be given a file named Information Request Form that can be used in either Word 2003 or Word 2007. This lesson will guide you through

More information

User s Guide. Or at Vimeo Channel: https://www.vimeo.com > Locus Picker

User s Guide. Or at Vimeo Channel: https://www.vimeo.com > Locus Picker User s Guide Tutorial movie files are also available at LOCUS Youtube channel: https://www.youtube.com/user/locusstudio/playlists > R&D Center: LOCUS Picker Or at Vimeo Channel: https://www.vimeo.com >

More information

Using PowerPoint vocabulary

Using PowerPoint vocabulary Using PowerPoint vocabulary Slide: An individual screen in a presentation. Presentation: The file you save to disk that contains all the slides, speaker's notes, handouts, etc. that make up your presentation.

More information

Linkage 3.2. User s Guide

Linkage 3.2. User s Guide Linkage 3.2 User s Guide David Rector Wednesday, April 06, 2016 Table of Contents Table of Contents... 2 Installation... 3 Running the Linkage Program... 3 Simple Mechanism Tutorial... 5 Mouse Operations...

More information

Faculty and Staff Development Program. Welcome. Microsoft PowerPoint 2013 Fundamentals Workshop

Faculty and Staff Development Program. Welcome. Microsoft PowerPoint 2013 Fundamentals Workshop Faculty and Staff Development Program Welcome Microsoft PowerPoint 2013 Fundamentals Workshop File: Microsoft PowerPoint 2010 Fundamentals Page 1 of 43 October 10, 2013 Microsoft PowerPoint 2013 Fundamentals

More information

PowerPoint 2013: Basic Skills

PowerPoint 2013: Basic Skills PowerPoint 2013: Basic Skills Information Technology September 1, 2014 1 P a g e Getting Started There are a variety of ways to start using PowerPoint software. You can click on a shortcut on your desktop

More information

Brian Hogan s. Overview

Brian Hogan s. Overview Overview Adobe Illustrator is a vector-based graphic design tool. It was primarily designed for creating materials for print publications but has since been modified to support content and web graphics

More information

User Guide. idraw for Mac OS X v2.5.1

User Guide. idraw for Mac OS X v2.5.1 User Guide idraw for Mac OS X v2.5.1 1 Welcome to idraw 6 Vector Illustration 6 Getting Started 8 Creating a New Document 8 Interface Overview 10 Document Tabs 11 Switching Between Documents 11 Closing

More information

Introduction to Smart Board. Table of Contents. Connection Basics 3. Using the Board (Basics) 4. The Floating Tools Toolbar 5-6

Introduction to Smart Board. Table of Contents. Connection Basics 3. Using the Board (Basics) 4. The Floating Tools Toolbar 5-6 Introduction to Smart Board Table of Contents Overview 2 Connection Basics 3 Using the Board (Basics) 4 The Floating Tools Toolbar 5-6 The Smartboard Smart Tool Buttons Collecting and Sharing Content with

More information

The Rocket Steam Locomotive - Animation

The Rocket Steam Locomotive - Animation Course: 3D Design Title: Rocket Steam Locomotive - Animation Blender: Version 2.6X Level: Beginning Author; Neal Hirsig (nhirsig@tufts.edu) (May 2012) The Rocket Steam Locomotive - Animation In this tutorial

More information

ROTOSCOPING AND MATTE PAINTING In Blender v2.48a

ROTOSCOPING AND MATTE PAINTING In Blender v2.48a In the world of Visual Effects, Rotoscoping, Matte Painting and Garbage Painting are necessary and complementary functions. They are used each time a cut-out in the image is necessary, to remove a background

More information

How to create pop-up menus

How to create pop-up menus How to create pop-up menus Pop-up menus are menus that are displayed in a browser when a site visitor moves the pointer over or clicks a trigger image. Items in a pop-up menu can have URL links attached

More information

Adobe InDesign Creative Cloud

Adobe InDesign Creative Cloud Adobe InDesign Creative Cloud Beginning Layout and Design November, 2013 1 General guidelines InDesign creates links to media rather than copies so -Keep all text and graphics in one folder -Save the InDesign

More information

Chapter 1: A Brief Introduction To Flash

Chapter 1: A Brief Introduction To Flash Chapter 1: A Brief Introduction To Flash Flash is not the focus of this book, but it is essential to know some basics of Flash since it is the environment in which ActionScript is embedded. Most of us

More information

Adobe Illustrator CS2 Tutorial University of Texas at Austin School of Information IT Lab Jin Wu Fall, 2006

Adobe Illustrator CS2 Tutorial University of Texas at Austin School of Information IT Lab Jin Wu Fall, 2006 Introduction: Adobe Illustrator CS2 Tutorial University of Texas at Austin School of Information IT Lab Jin Wu Fall, 2006 Illustrator is a vector-based imaging program. Unlike PhotoShop, which deals in

More information

AIM Your Project with Flash

AIM Your Project with Flash Animation Interaction Multimedia AIM Your Project with Flash Flash in a Flash - QuickStart Workshop Annette Lamb & Larry Johnson http://eduscapes.com/flash/ 2 AIM Your Project with Flash: Flash QuickStart

More information

Photoshop 5.5 & 6.0 Tips & Tricks

Photoshop 5.5 & 6.0 Tips & Tricks Introduction To s In ImageReady In this example, you will be using Photoshop layers to create individual image layers for a simple animation. Once you have created the image layers, you will open the file

More information

Let s make game art with Photoshop!

Let s make game art with Photoshop! Let s make game art with Photoshop! Prepare to flex your artistic muscles. What is Photoshop? A program that can be used to create various types of artwork. Usable for digital and print work. Brush Art

More information

TOPIC. Page No. Introduction 1. Features 1. Hands on Exercise Fitting Text along a path 4. Hands-on Exercise - Creating Envelope Effect 5

TOPIC. Page No. Introduction 1. Features 1. Hands on Exercise Fitting Text along a path 4. Hands-on Exercise - Creating Envelope Effect 5 CONTENTS TOPIC Page No. Introduction 1 Features 1 Hands on Exercise Fitting Text along a path 4 Hands-on Exercise - Creating Envelope Effect 5 Hands-on Exercise - Creating Shapes using Blend 7 Hands-on

More information

After this lesson you will be able to:

After this lesson you will be able to: LESSON 4: ANIMATION OBJECTIVES After this lesson you will be able to: use layers with frames create symbols and instances create motion by tweening create transformations by tweening set the timing of

More information

Recipes4Success. Create an Animated Idiom. Frames 6 - Clay Animation

Recipes4Success. Create an Animated Idiom. Frames 6 - Clay Animation Recipes4Success You will learn how to create an animated movie using Frames. You will import a folder of images, add a title, credits, text effects, music, shapes, and transitions, and then export the

More information

Graphic Design. Background: The part of an artwork that appears to be farthest from the viewer, or in the distance of the scene.

Graphic Design. Background: The part of an artwork that appears to be farthest from the viewer, or in the distance of the scene. Graphic Design Active Layer- When you create multi layers for your images the active layer, or the only one that will be affected by your actions, is the one with a blue background in your layers palette.

More information

Creating Your Own Shapes

Creating Your Own Shapes 1 Creating Your Own Shapes in Visio You can create your own custom shapes in Visio if you need a shape that is not in one of the standard templates. This example shows how to create the recycling symbol

More information

SMART Ink 1.5. Windows operating systems. Scan the following QR code to view the SMART Ink Help on your smart phone or other mobile device.

SMART Ink 1.5. Windows operating systems. Scan the following QR code to view the SMART Ink Help on your smart phone or other mobile device. SMART Ink 1.5 Windows operating systems User s guide Scan the following QR code to view the SMART Ink Help on your smart phone or other mobile device. Trademark notice SMART Ink, SMART Notebook, SMART

More information

WORKSPACE PC FOR NEW USERS

WORKSPACE PC FOR NEW USERS WorkSpace PC for New Users 1 WORKSPACE PC FOR NEW USERS Before Class Charging the MobiView The MobiView should arrive partially charged and ready for installation. Turning Technologies recommends that

More information