csuci home button art home button Blackboard button
art 205 header csuci logo
divider
divider
art 205 home
divider
syllabus
divider
art 205 list of projects
divider
art 205 student work
divider
art 205 cool websites
divider
art 205 flash resources
divider
art 205 events
divider
art 205 media arts festival
divider
p
spacer


header symbols


1 Sites of the Day:

Renegade Animation

Adobe Cards

2 Lecture: Symbols and the Library

3 Demo: Apple symbols

4 Homework:
Suggested reading: ch. 3, Creating and Editing Symbols in the Adobe® Flash Professional CC Classroom in a Book

Due date: Thurs. Feb. 16
*you will have time to work in-class on the project on Tues. 2/14

name: lastname_proj3.fla

Create an image of a robot that utilizes a minimum of 6 different symbols.The symbols will utilize graphic or movie clip symbols. An example (not a robot but a good example of the process) might be if you choose a tree like the example by Rob Matzat below, each part of your object (tree) will be a symbol, i.e the trunk, the branches, the fruit(your choice), clouds in the sky, grass, hills, small animals.

Each type of symbol must be on it's own separate "named" layer. Use create symbol (Cmd + F8) to make a new symbol or convert symbol (F8) to make your hand drawn shapes into symbols. You simply select the shape on the stage first then click: F8, then name your symbol, choose graphic symbol and click OK. The shape has now been converted into a symbol and it has now been added to your Library (Ctrl+L). Please name all symbols that you create.

Once you have created a symbol, an instance can be dragged out from the library many times. This is called making an instance(copy) of the symbol. Now that it is a symbol it will only have to be downloaded once, which is the beauty of symbols.

If you need to "edit" that symbol, double click it on the stage or double click on the picture or name in the library.

You also MUST use "color styles" in the Properties panel to change the brightness, tint, alpha or a combination of all 3-just remember to select the symbol first and go the Properties panel to do this. Also use free transform to alter the size, skew and rotation of "instances" of the symbol.


apple
2



apple tree


Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

 

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

 

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


William Beck-Askenaizer


Manny Canez

 


Sian Harrelson


Angel Quinteros


Eileen Comstock

 

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player


Thomas VonDohlen

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Bailey Durkin

 

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Caitlin Hurst


3 Lecture: Symbols and the Library

Intro. to creating and using Symbols in Animate CC

 I. Using symbols, instances, and library assets overview  
 
A symbol is a graphic, button, or movie clip that you create in Flash. You create the symbol only once; you can then reuse it throughout your document or in other documents. A symbol can include artwork that you import from another software application. Any symbol that you create automatically becomes part of the library for the current document. 

Each symbol has its own Timeline. You can add frames, keyframes, and layers to a symbol Timeline, just as you can to the main Timeline. If the symbol is a movie clip or a button, you can control the symbol with ActionScript. An instance is a copy of a symbol located on the Stage or nested inside another symbol. An instance can be very different from its symbol in color, size, and function. Editing the symbol updates all of its instances, but applying effects to an instance of a symbol updates only that instance. 

Using symbols in your documents dramatically reduces file size; saving several instances of a symbol requires less storage space than saving multiple copies of the contents of the symbol. For example, you can reduce the file size of your documents by converting static graphics, such as background images, into symbols and then reusing them. Using symbols can also speed SWF file playback, because a symbol needs to be downloaded to Flash Player only once. 

Here are 2 student examples made by Quinn Bouma, one is made with symbols and one is not. Note the file size difference.

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

Content on this page requires a newer version of Adobe Flash Player.

Get Adobe Flash player

 



I. Symbols
 
 
You can create a symbol from selected objects on the Stage, or you can create an empty symbol and make or import the content in symbol-editing mode. You can also create font symbols in Animate CC. Symbols can have all the functionality that you can create with Animate CC, including animation.
 
By using symbols that contain animation, you can create Flash applications with a lot of movement while minimizing file size. Consider creating animation in a symbol when there is a repetitive or cyclic action—the up-and-down motion of a bird's wings, for example. 


II. To create a new empty symbol:

Read below on how to: 1a.-create a new empty symbol or 1b. to convert something to a symbol:

4 ways you can create a new symbol "from scratch"

• Select Insert > New Symbol. 
• Click the New Symbol button at the lower left of the Library panel. 
• Select New Symbol from the Library options menu in the upper right corner of the Library panel or
• click: Cmd + F8

Converting artwork to a symbol:

• Select the object on the stage and:
• Select Modify > convert to symbol
• Select object and then click the New Symbol button at the lower left of the Library panel. 
• click: F8

 2. Then, in the Create New Symbol dialog box, type the name of the symbol and select the behavior—Graphic, Button, or Movie Clip.
 
 3. Click OK. 

 • Flash adds the symbol to the library and switches to symbol-editing mode. In symbol-editing mode, the name of the symbol appears above the upper left corner of the Stage, and a cross hair indicates the symbol's registration point.

 4. To create the symbol content, use the Timeline, draw with the drawing tools, import media, or create instances of other symbols.

 5. When you have finished creating the symbol content, do one of the following to return to document-editing mode:

 • Click the Back button at the left of the Edit bar above the Stage.
 
 • Select Edit > Edit Document

 • Click the scene name in the Edit bar above the Stage.
 
 • When you create a new symbol, the registration point is placed at the center of the window in symbol-editing mode. You can place the symbol contents in the window in relation to the registration point. You can also move the symbol contents in relation to the registration point when you edit a symbol, in order to change the registration point. 
 
 
III. Types of symbols

Each symbol has a unique Timeline and Stage, complete with layers. When you create a symbol you choose the symbol type, depending on how you want to use the symbol in your document.

 •  Use graphic symbols for static images and to create reusable pieces of animation that are tied to the main Timeline. Graphic symbols operate in sync with the main Timeline. Interactive controls and sounds won't work in a graphic symbol's animation sequence.

 • Use button symbols to create interactive buttons that respond to mouse clicks, rollovers, or other actions. You define the graphics associated with various button states, and then assign actions to a button instance. For more information, see Handling Events.

 • Use movie clip symbols to create reusable pieces of animation. Movie clips have their own multiframe Timeline that is independent from the main Timeline—think of them as nested inside a main Timeline that can contain interactive controls, sounds, and even other movie clip instances. You can also place movie clip instances inside the Timeline of a button symbol to create animated buttons. MovieClips become very powerful for use with ActionScript.

   
 
link to lizking.tv website