ET84C Special Topics - Flash: SYLLABUS
Summer 2005

ET 84c (section 4097) Special Topics - Flash for Interactive Media (1 unit); M - W 6:30 0 - 9:20 p, AET Room 106
(6 weeks, twice a week)


Santa Monica College - A.E.T.
Graphic Design Dept.
Instructor: James Reilly

Course Description


This course is an introduction to Macromedia "Flash". Even though this is an "introduction" to Flash, it is not a course for students unfamiliar with computer graphics applications**. Flash is a vector-based, interactive animation creation program designed to enable the addition of dynamic full-screen character, scene, interface and motion graphics animation to websites. And, with its ability to be easily integrated into HTML pages, Flash is now being used to completely design many interactive websites that deliver both visual and textual content, as browsers are including the Flash Player plugin with their newest versions.

Additionally, producers of animated "cartoons" have discovered that the unique drawing characteristics in Flash; and the relatively short learning curve for creating 2-D animation with the program make it an ideal tool for the development of new projects for on-line entertainment, as well as television show production.

The goal of this course is to allow students to gain a introductory knowledge of Macromedia Flash, and begin to create projects that will enhance their portfolios, and allow them the ability to integrate dynamic, interactive flash intros, interfaces and navigation into websites.

Pre-requisites

ET84C is open to all SMC students**. Students will be expected to exhibit proficiency in the creation of digital graphics, meaning that you must already be comfortable with Photoshop© and/or Illustrator© and the use of standard graphics applications tool pallets. It is also highly recommended that students understand and have had some experience with Interactive Media developement (such as HTML and/or Dreamweaver© or Director©).**

** Classes in the subjects/applications described in this section are available at AET to all SMC students; and the completion of such courses will allow you to achive the highest level of quality in your Flash work, and to create elements which will enhance your personal portfolio. The lack of experience in these subjects/applications will probably cause those students to fall behind or produce poor quality work and possibly risk failing the course.

Textbooks

  • Beginning Flash book: Flash MX 2004: Grphics, Animation & Interactivity; by James L. M.S.Ed. Mohler:
    Flash MX 2004: Graphics, Animation & Interactivity

Materials Needed

  • USB Jump Drive and/or 1 Zip Disk (PC formatted)
  • Mini headphones

Recommended

  • Sound effects CD;
    "A Zillion Sounds" available from: www.beachware.com ($24.95 or less) or the AET Bookstore ($17.95)

Free Trial version of Macromedia Flash (lasts 30 days, so time it carefully)

Schedule

Weeks

1 - 2

Get Flash 6 PlayerFlash: what can it do, and how does it do it?
What is vector based drawing?
The Flash interface.
Drawing with Flash: the tools that make lines, shapes, colors and text.
Creating "symbols": graphics, movie clips,and buttons. The "library".
Using the layers: locking, hiding, outlines.
Organization: naming symbols, layers, and instances before you get overwhelmed.
Naming your files and projects.
Using gradient fills to simulate 3-D in vector art.
Creating high-quality images with the Flash drawing tools.
Color and transparency effects.
Text and fonts: "breaking apart" text and file size issues. Cross browser capability.
Frames and animation: "keyframes", frame-by-frame animation, tweening.
Moving, scaling, and rotating "instances".
Copying and pasting visuals (frames) from scene to scene, or frame to frame.

This week's advice: Read your book, use the "online reference manual", lock layers that you are not working on, name items as you create them, do not animate (move, zoom in/out, fade in/out) anything bigger than quarter-screen.

Homework: Create an object using only the Flash Tool Pallet and Modifiers. This can be an object that could serve as an interface or navigational guide. It should be as realistic as possible. Examples: Vehicles, machinery, appliances, tools, bugs, animals or even characters (if you happen to be capable of doing so)

Cool site: David Gary Studios

 

Week

3

*CLICK HERE for "Rotating Spheres" Instructions & Demo

The elements of high quality Flash
production
Sound effects: using SoundForge to create loops and optimize effects sounds.
Importing sounds and adding them to symbols or timelines.
Using bitmapped images in Flash: size matters!

The "Trace Bitmap" fuction.

File size for web delivery: our goal is 100k for a short intro piece, web "page" or section.
Using multiple Scenes for interactivity
Adding, naming and organizing Scenes.
Creating Buttons for movie navigation and interactive selection.
Frame Actions for movie / scene control; and Button Instance Actions for navigation and interaction.
Duplicating Symbols in the Library, and other ways to create stages of Instances or Buttons.


Online resources available to Flash producers:

This week's advice: Keep reading your book, make your images or characters as good as they can possibly be: simple is O.K. if it has style, choose your "export movie" settings carefully, use the resources that are available on the web for inspiration and education. My favorite internet cartoon series is "Zombie College" at Icebox.com

Homework: Create a cool "logo animation", with sound, for an intro to your final project.

Cool site: Yellow Submarine

Week

4

*CLICK HERE for "Bomb Demo" Instructions & Demo

Laying out a Flash website / Introduction to "With" action (formerly "Tell Target")
Naming instances and the effect of keyframes on instance actions.
Preparing a Movie Clip to receive a "With" command.
Controlling the movie's Time-line with the With "_root" command.
Mouse Event options and "Go to... and Play/Stop"
"With" use as a Button Instance action or a Frame Action.

Communicating with multiple Targets; Targets 'Telling' Targets.
Making sophisticated Buttons, with sounds, motion and interactivity.
Creating Symbols specifically for use as Interactive Menus.
More Button Issues; sometimes you have to 'fake' it.

*JAMESREILLY.COM was made with many "With / Tell Target" actions:

This week's advice: Do not settle for low quality graphics. Unless you INTEND to include "stick figures" or childish artwork in your Flash pieces, take the time to create high-quality visual elements. Use books, photographs, ect. as reference material. Cartooning is great, and is a special skill that must be learned. Even with interface design, quality is paramount. Whether the look you want is "Tooney" or faux 3-D, do it as good as possible, or don't do it at all!

Homework Part 1: Create a simple "With" menu / scene which displays "sub-menus" on user interaction for information display (just the menu; it does not need to display information).

Homework Part 2: Make an outline, or "Storyboard" of the information you will present in your final project.

An extremely slick site: 2advanced.com

Week

5 - 6

"With": the foundation of interactivity using the built-in actions in Flash

Finalizing the mini Flash websites
Using "Mask" Layers

Masking multiple layers to create a cleanly 'cropped' SWF movie.
Creating a Loading Loop with the "If Frame is Loaded..." action.
Multiple Loading Loops, and 'Game' Loading Loops.
Outputting Flash movies for display in browsers.
"Make Movie" settings; bitmap quality;, sound compression.
Using the "Bandwidth Profiler" to assist in file size reduction.
Flash's "Publish" function: building a basic HTML page.
"Publish Settings"
Taking the next step with an HTML editing program such as 'Dreamweaver'.
Building an interlinked Flash driven website with the "Get URL" action.

*Check out this sample of a more complicated "With / Tell Target" scene:

This week's advice: As your projects get more sophisticated, and complicated, Pre-planning or Storyboarding becomes a neccessity. Designing on the computer screen will ultimately result in an inferior product. Don't be afraid to sketch out your ideas on paper. This will help you pre-inventory which Symbols you must create within Flash, and what must be created in other programs to be imported (bitmapps, sounds, ect.)

Homework: Complete your "mini" Flash website (using your logo animation as its intro),

An interesting "Hybrid" site: giger.com

Week 6
Last Class

Presentation of Final Projects

Load Movie technique will be covered afterwards, time permitting

LAB
TIME
Students are expected to perform lab time, on their own. It will be absolutely necessary to create the work that will allow you to pass this class!

*Course contents may be adjusted as determined by the progress of the class.
**Due to School Holidays , there will be no class on ...

There will be class every week!

Project List

The assignments:

  • Object drawn in Flash (20 points)
  • Motion graphics "Logo Animation" with sound (20 points)
  • "Tell Target "menu" and Outline / Storyboard for final project. (10 points each = 20 points)

  • Final Exam - A short, ten-question written (multiple choice & fill-in) exam covering simple terms and concepts relating to Flash. (10 points)

  • Final Project - "Mini" Flash website presenting information relating to yourself, your resume, portfolio, or a business interest you may have.This site will be introduced by your Motion graphics "Logo Animation" and contain interactive / expanding menus with sound effects to display information and / or images. (30 points)

Missing classes will cause you to fall behind. Therefore, please attend every class and be on time. Students who are absent twice will be dropped (or risk failing the class); and students on the official roster who do not attend the first class meeting will be dropped to make room for students on the waiting list. Attendance will be considered in the calculation of your final grade.

**This syllabus is subject to change

Total Points / Grade
100 - 90
A
Credit
89 - 80
B
Credit
79 - 70
C
Credit
69 - 60
D
No Credit
< 60
F
No Credit

Contact James Reilly reilly@jamesreilly.com

Link to JAMESREILLY.COM | Return to James Reilly's SMC Info Page

Santa Monica College | AET

Link to
                          Postcard AMERICA.com