You will be "competing" against all other classes in room 230 (yes, middle school and Yearbook included!).

Take this simple design and make it AWESOME!
Winning class gets... Something!

Vintage Car-Show Poster

 

ALL pertinent files are attached to this posting. They are also accessible through he Student "U-Drive" on the school network.

 

You may select to use different images/brushes for your backgrounds (newspaper, clouds, texture though a "grunge" brush should be used where called for) however, you WILL NOT be allowed more time nor will it be acceptable to change the font. Your project WILL USE the Birth of a Hero font that is supplied.

 

This assignment is a MAY-DO, it is not required, it will NOT count against your grade, and I do not want to see this turned in before your Flash Final. This is merely an assignment to reteach and help retain your Photoshop skills.

 

It is due the 9th of May and no late files will be graded.

You will create a Typographic Portrait using the following steps. This is the first in a series from which you will choose an image to be displayed during Humanities Week.

 

Work will be turned in to this box.

 

Work is DUE May 7th.

YOUR FLASH FINALS ARE NOW LATE!

 

You will use a single word, some Photoshop skills, and your eye for design to create a dynamic Typographic "poster" in Photoshop.

 

Turn your work in to this folder when you get finished.

 

It is DUE May 2nd.

 

Your Flash Final.

 

Here are the things you will need to show me on your Final. A rubric will be attached to show you how your work will be scored. Keep in mind that listed below is what will likely constitute a barely passing grade.Extra-effort pays off with higher grades. Barely trying usually = barley passing.

- 4 Complete Characters (Left, Right, Front, Back)

- ALL 4 Characters will have working legs (walk cycles that look "realistic". I should easily be able to tell if the legs are moving in a given direction).

- NO LESS than 4 "scenes." REMEMBER: shot changes are NOT scene changes.

- NO PHOTOGRAPHS AS BACKGROUNDS! You can use a photograph as the basis of your background but you will have to "trace" or "animate"your background in Flash or Illustrator.

- Using a "cartoon" background from the Internet DOES NOT count as creating your own. It does not need to look like a broadcast quality cartoon, but it must be more than just one color ground, and one color sky.

- You will use at a minimum (least amount of "passing" points possible) 3 SHOTS and 3 Camera moves. This should be a no-brainer as 4 scenes =  at least 4 "shots."

- SHOTS and CAMERA MOVES were discussed in class, drawn on the board, video examples shown, and links to my source material provided previously (and below). You know what they are and what is expected.

- minimal effort will likely NOT result in a passing grade.

 

BASIC CINEMATIC TERMS/ACTIONS

 

Simple Guide to Basic Cinematics in Adobe Flash

 

Once you have defined your “space,” that is your stage, you need to know where your “safe” areas are.

 

Title Safe and Action Safe Areas

 

YOur computer screen will show you every pixel that is within the displayed image. Your tv screen, however, will not. This is due to overscan. You will lose approximately 10% of the image, all the way around, due to overscan. There will be variations due to varied makes and models, but you get the idea.

 

To make up for this loss, producers came up with the Title Safe and the Actions Safe areas. Title Safe is approximately 20%in from the edges of the screen thereby allowing titles to be displayed without loosing them.

 

The Action Safe area is much larger and represents, in a general way, the areas where the average tv screen will crop the image.

 

You will be provided with a template that, when opened in you Flash document, you can use to ensure that your Titles and Action are well within the areas generally regarded as “safe.”

 

When it comes time to it, we can discuss adapting your animation for a HDTV.

 

Three Cinematic Terms You Probably Already Know But Let’s Make Sure

 

Frame. Shot. Scene.

 

Frame. A single still image, also, 1/24th of a second of “film.”

 

Shot. Whatever the camera is looking at, at a particular point in time. It is an uninterrupted view filmed by one camera (or from one perspective). Once the viewpoint changes, the “shot” changes.

 

Scene. A scene can be made up of a long continuous shot or multiple shots. A scene defines the place or setting where the action takes place.

 

Camera Shots

 

The three most common camera shots are: the Long Shot, the Medium Shot and the Close-Up.

 

Long Shots and Close-ups can have extremes, such as the Extreme Long Shot and the Extreme Close Up.

 

EXTREME LONG SHOTS (ELS): shows the vastness of an area or a setting. Think of a movie that takes place in a specific city, say Batman, and how there will be am establishing shot of the city skyline. ELS isn’t about distance from the camera to the subject but the relative SIZE of the subject in the viewfinder (or on your stage).

 

LONG SHOT (LS): is used to frame the action. It usually shows the character, the place, and the action. The actions could take place on a street, with the character taking up about 1/3 of the height of the frame and seen from head to toe.

 

MEDIUM SHOT (MS): frames the character from the waist or knees up - NOT full bodied, but NOT real close either. You get just enough of the overall background to help establish setting (where the scene is taking place).

 

CLOSE UP (CU): a characters head and shoulders dominate. This lets viewers see and hopefully feel any emotions your character shares. It visually invites the audience to become part of the story.

 

EXTREME CLOSE UP (ECU): this is used to focus attention on whatever is significant in the shot or in a characters facial reaction.

 

Sometimes another character is used as framing as in an OVER THE SHOULDER SHOT (OSS). This kind of shot uses a second character to show them reacting with another, usually during dialogue.

 

So, to help you remember it:

 

LONG SHOT: Frame the setting.

MEDIUM SHOT: frame the action.

CLOSE UP: Frame the emotion.

 

One of the last things we will concern ourselves with - for now - is camera movements.

 

Camera Movements

 

Shots can also be defined by movements of the camera. Camera movements are used to focus the audiences attention and involve them in the scene they are watching.

 

Pan (P): A pan shot rotates the camera horizontally from left to right or right to left. Just like moving your head from right to left or vice versa.

Pans are used for establishing shots when a camera moves across a desert landscape or across the horizon.

A pan can also give the feeling of searching for something within a shot.

Pans are used minimally.

 

Ch 6 (01_HorizontalPan)

 

Tilt (T): is a vertical pan (up-down or down-up), It is used to reveal a tall building or person.

A Tracking Shot (TS): when the camera travels from one place to another within a single shot it is called a tracking shot. In this kind of shot both the camera and the character, or subject, move. The camera literally TRACKS, or follows, the subject.

A tracking shot can also be when the subject stays in one place and the camera moves either TOWARDS it (called a truck in) or AWAY from it (called a truck out). This kind of tracking adds depth to the shot.

 

DO NOT confuse tracking with zooming!!

Walk Cycle Alt #1.2

 

You will add four scenes to your walk cycle. Each scene will have an environment that "Clyde" will interact with.

 

That means: if Clyde is walking along a sidewalk and cars are parked on the street, Clyde will need to walk BETWEEN the cars and the storefront. Remember: cars have windows.

If there are trees, Clyde will walk behind the trees and still be in front of the buildings.

Get it? You are going to have to open your image in Photoshop and cut out the parts that should be in front of Clyde, save them ONLY as a separate document and then IMPORT the images into your library in Flash just like you have been shown.

 

Now, that we have been completely overwhelmed by an advanced Walk Cycle walk-through by our favorite foreign animator, let's look at a slightly more simple version...

 

LINK:

http://www.devilsgarage.com/tutorials/easy-walk-cycle/

 

(notice: Images do not show up, click the WORD document attached for the images)

Walk Cycle

A walk cycle is a series of illustrations drawn in sequence that loop to create an animation of a walking character.

This tutorial covers the basics on how to construct a 4-frame walk cycle using Flash. A walk cycle can be broken into four key poses. These key poses are the defining points of a walk cycle:

1. Forward Contact Point
2. Back Contact Point
3. Passing Pose 1
4. Passing Pose 2

Since the leg of the character changes shape, we’ll employ guides to help maintain the volume of the leg. To help us maintain a steady size ratio, we need a reference point. Just to make sure we’re all on the same page, listed below are the publishing settings I used.

Dimensions: 585×400 pixels (width x height); Frame Rate: 6 FPS.

 

To start off, the first thing we’re going to do is get the leg animation nailed down correctly so that the four key frames look something like this:

 

The leg is defined by the highest point (pelvis) and the lowest point (indicated by the guide line).

There are many ways of going about animating a walk cycle. This method is one of the better methods I use since it’s easy and has the quickest turnaround time. I’ve broken up this tutorial into three steps:

• Step A: Understanding walk cycle and animating the two legs
• Step B: Rigging the character
• Step C: Animating the character

 

When I create a walk cycle, I make it a point to have the registration point at the lowest center of gravity (CG). Therefore, I set the registration point to coincide with the pivot point of the character. This isn’t a rule, but from all my experience as an animator I know this works best because you never know when you’ll need to skew or rotate the symbol.

Our first step is to create a graphic symbol which has its registration point set at the lowest CG of the character. Then we’ll go ahead and animate one of the legs using a copy-paste method, and animate the second leg too.

Step A: Animating the Legs

1. Draw a line on the work area
2. Select the line and convert it to a graphic symbol. Make sure to change the registration to the the lower-center-bottom spot (as indicated in the image below).
   The registration point acts as the pivot to that symbol. For easy animation, we reposition the registration points so that we can pivot or skew that symbol in our favor when animating the character.

 

3. Enter the symbol, delete the line and drag a guide line to that registration point. The guide now serves as reference for the ground.

 

4. Create two layers, namely “pelvis” and “leg” and stretch the timeline from one frame to four frames so it looks something like below.

 

5. Draw the pelvis on the first frame of the “pelvis” layer. Drag two guide lines to the top and center of the pelvis. Lock the pelvis layer and convert all frames on the “leg” layer to blank keyframes.

 

 

6. With the pelvis and guide line as reference, draw the Forward Contact Point on Frame 1 in the “leg” layer. Switch on the Onion Skin feature to help you draw the rest of the frames.
7. Draw the Back Contact Point on Frame 3
8. Draw the Passing Pose 1 on Frame 2
9. Draw the Passing Pose 2 on Frame 2
   
   Now that we have one leg of the walk cycle nailed down properly, the other leg is more or less a copy-paste job.
   
   
10. Create a new layer between “leg” and “pelvis.” Rename the layer “leg2″
11. Convert all frames on “leg2″ to blank keyframes. Looking at the “Breakdown of Walk Cycle” image at the beginning of the tutorial we can observe a pattern the legs follow. When the first leg (black) is at the Forward Contact Point, the second leg (blue) is at the Backward Contact Point; or when the first leg (black) is at the Passing Point 1, the second leg (blue) is at passing point 2. Thus, it can be said that the second leg (blue) is two frames ahead of the first leg (black).
12. Armed with the above knowledge, we can copy:
    Frame 1 of “leg” ——paste to——> Frame 3 of “leg2″
    Frame 2 of “leg” ——paste to——> Frame 4 of “leg2″
    Frame 3 of “leg” ——paste to——> Frame 1 of “leg2″
    Frame 4 of “leg” ——paste to——> Frame 2 of “leg2″

 

Now that we have our foundation walk cycle, the next set of steps is rigging the graphic symbols so that we can start animating the remaining body parts.

Step B: Rigging the Character

Now that we have our foundation walkcycle by animating the two legs, the next set of steps is Rigging the Graphic Symbols so that we can start animating the remaining body parts.

1. Let us first download the character in profile view since we shall be rigging this setup considered here.

Download the CharacterProfile.fla file from the “U-Drive” or the write-up on the class website. RESAVE the file with YOUR NAME in YOUR FOLDER or YOUR FLASH DRIVE.

We are going to select each group in the fla file and convert it to a graphic symbol and reposition its registration point.

2. Open the FLA file
3. Select the head and convert it to a Graphic Symbol called ‘head’. Make sure the registration point is at the lower-center-bottom spot (as indicated in the image below).
   
4. Select the hand and convert it to a Graphic Symbol called ‘hand’. Make sure the registration point is at the upper-center-bottom spot (as indicated in the image below).
   
   

 

5. Select the collar and convert it to a Graphic Symbol called ‘collar’. Make sure the registration point is at the center spot (as indicated in the image below).
   
   
   
6. Select the body and convert it to a Graphic Symbol called ‘body’. Make sure the registration point is at the lower-center-bottom spot (as indicated in the image below). Let us ignore the ‘leg’ as we are going to replace it with our animated leg. At this stage, the Graphic Symbol ‘Body’ will overlap the Graphic Symbol ‘hand’.
   
   
   
   
7. Now select all the symbols and convert it to a graphic symbol called ‘charTotal’ Which stands for Character Total. Make sure the registration point is at the lower-center-bottom-spot.
   
   
   
8. Go into the symbol ‘charTotal’, select all the content in the symbol and ‘Distribute to Layers’  (Modify/timeline/Distribute to Layers). Rearrange the layers like shown in the image below.
   
   
   
   
9. Drag layer 1 below layer 6. Layer 6 will contain the drawing of the ‘leg’ that has not been symbolized. Layer 6 is going to be used as our reference leg, which we shall delete later.
10. Open the 4-frame-walk-cycle-source-2legs.FLA file and copy  ’leg01′ Graphic Symbol. Go back to character-profile.fla,  select layer 1 and paste the ‘leg01′ Graphic Symbol.
    
    
    
    
11. The next step is to make sure all the registration points are moved to the pivot point. To do this select the ‘Free Transform Tool’, Select the ‘head’ Graphic Symbol and double click on the registration point. The registration point will jump to the pivot point of that symbol. Repeat this process for all the other Graphic Symbols.Do remember that on double clicking on the registration point for the ‘collar’ Graphic Symbol, there will be no jump of the registration point as the pivot and registration point are both at the center of the symbol.
    Watch the video below to see a demonstration of the same.[flashvideo file=wp-content/uploads/2010/06/change-reg-point.flv width=480 height=559 controlbar=over image=wp-content/uploads/2010/05/change-registration-point-in-flash.jpg /]
    
    
12. Delete the reference ‘layer 6′ which contains the leg in standing position.
    
    
13. Extend the timeline for all the layers to frame 4.
    
    
14. Select the Graphic Symbol ‘leg1′ and ‘Distribute to Layers’  (Modify/timeline/Distribute to Layers). Delete the now empty ‘layer 1′.
    
    
15. Select all the Symbols on the work-area and in the properties bar, Change the Graphic Symbol from ‘Loop’ to ‘Play Once’ from Frame ’1′
    
    
    
    
16. Scrub the time line to see only the legs animated.
    
    
17. Get back to the main timeline. Using the ‘Free Transform Tool’ select the Graphic Symbol ‘charTotal’. Double click on the registration point so that it jumps to the pivot point of the symbol.
    
    
18. Extend the time line on the main timeline to 4 frames.

The assets are ready to be animated. Let’s move on to the last set of steps.

Step C: Animating the Character

1. Select all the frames in all the layers and convert them to keyframes (right click/Convert to Keyframes)
   In Frame 1 and Frame 3 ( Front Contact Point and Back Contact Point, respectively) the Pivot is at its lowest point, this means that the character will dipdown a bit. In Frame 2 and Frame 4 ( Passing Pose 1 and Passing Pose 2) the Pivot is at its highest point, this means that the character will rise up a bit.
   
   
2. Select all the layer in Frame 1, Using the ‘Free Transform Tool’, squash the character approximately 5 pixels downwards.
3. Select all the layer in Frame 3, Using the ‘Free Transform Tool’, squash the character approximately 5 pixels downwards .
   
   
   
   
4. Go into the ‘leg01′ symbol. We are now going to change the pivot color from red to black and fill the legs with white color.
   
   From Walk-Cycle studies, it is observed that when the left legs goes forwards and reaches its Front Contact Point, a Frame later the Right hand will reach its Front Contact Point, thus the swaying of the hands always has a one frame delay as compared to the legs. Thus using this principle lets animated the right hand. We really dont have to animated the left hand because its hidden behind the big body of the character.
   
   
5. In the ‘charTotal’ Symbol, at Frame 2 on layer ‘hand’, select the hand and using the ‘Free Transform Tool’, incline the hand slightly forward. At Frame 4 on layer ‘hand’, select the hand and using the ‘Free Transform Tool’, incline the hand slightly backwards.
   
   
6. Test the movie (Ctrl + Enter) to see the character’s walk cycle

 

 

We return to our friend The Angry Animator for four videos of instruction on Creating A Walk Cycle. This is a compliment to the article on The Angy Animator website. Information from that article will be used for the "Walk Cycle Quiz" on the 13th/14th of March.

 

This video details the importance of your keyframes, especially the Contact, Recoil,  Passing and High Point frames for a fluid walk, articulation of the extremities and goes into (seemingly) minute detail .

 

Again, there will be a QUIZ on matter covered in the article NEXT WEEK (03-13/14-2014). Don't count on me going over it with you like I did the Bounce Cycle article. Take matters into your own hands and read it for yourself. It is a great, and necessary, companion to the videos.

 

Video 1: http://vimeo.com/1146187

Video 2: http://vimeo.com/1146716

Video 3: http://vimeo.com/1146799

Video 4: http://vimeo.com/1146862

 

Article: http://www.angryanimator.com/word/2010/11/26/tutorial-2-walk-cycle/

Ball Bouncing Pt 1

 

You will follow this simple set of instructions to create a "bouncing" ball in Flash CC.

 

Once you are finished with this part, move on to part 2.

Bouncing Ball Pt. 2

 

Read the following information from The Angry Animator. While it deals mostly with "traditional" animation, the ideals are directly applicable to Flash, which is good because in order to complete this assignment correctly, you will apply his "bouncing" theories to your bouncing ball.

 

QUIZ The Angry Animator Article

 

Today you will have a quiz covering topics discussed in the posted article from The Angry Animator.

 

The Article:

 

The Page:

PONG 1

 

We are going to begin another foray into the world of video games.

Prepare yourself for.... PONG!

once upon a time, this game was AWESOME! And, believe it or not, it can still be somewhat challenging...

PONG 2 - The Return of Pong

 

This is the second part of PONG!!

 

A swf and fla file is located on the U-drive.

PONG 3 - Pongs Revenge

 

Yup... Part 3...

 

swf and fla on U-drive.

PONG 4 - The Next Pong

 

You saw this one coming, didn't you... PONG 4! The Pong reborn!!

 

swf and fla on U-drive.

PONG 5 - The Final Chapter

 

This is the PONG
Beautiful PONG
This is the PONG
My only PONG, the PONG
Of our elaborate PONGS, the PONG
Of everything that PONGS, the PONG
No safety or PONG, the PONG
I'll never look into your PONGS...again
Can you picture what will PONG
So limitless and PONG
Desperately in need...of some...stranger's PONG
In a...desperate PONG
Lost in a Roman...wilderness of PONG
And all the children are inPONG
All the children are inPONG
Waiting for the summer rain, PONG
There's danger on the edge of PONG
Ride the King's PONG, baby
Weird PONGS inside the gold mine
Ride the PONG west, baby
Ride the PONG, ride the PONG
To the PONG, the ancient PONG, baby
The PONG is long, seven miles
Ride the PONG...he's old, and his skin is cold
The PONG is the best
The PONG is the best
Get here, and we'll do the PONG
The blue bus is PONGIN' us
The blue bus is PONGIN' us
Driver, where you PONGIN' us
The PONG awoke before dawn, he put his boots on
He took a PONG from the ancient gallery
And he PONGED on down the hall
He went into the room where his PONG lived, and...then he
Paid a visit to his PONG, and then he
He walked on down the PONG, and
And he came to a PONG...and he looked inside
PONG, yes son, I want to PONG you
Mother...I want to...WAAAAAA
C'mon baby,--------- No "take a chance with us"
C'mon baby, take a chance with us
C'mon baby, take a chance with us
And meet me at the back of the blue bus
Doin' a blue rock
On a blue PONG
Doin' a blue PONG
C'mon, PONG
PONG, PONG, PONG, PONG, PONG, PONG
This is the PONG
Beautiful PONG
This is the PONG
My only PONG , the PONG
It hurts to set PONG free
But you'll never PONG me
The end of PONG and soft lies
The end of PONG we tried to PONG
This is the PONG

PLATFORM GAME FINAL CODE and ACTIONSCRIPT files.

 

(the codes are here as well as saved to the "U" drive).

 

Due to the unusual amount of wackiness that has prolonged the logical conclusion of this particular assignment I am supplying you with the final source code and actionscript files.

Don't get excited, there's a catch.

You wll need to go through the code and make changes to the variables such as speed, jump height, etc. as well as the environment like ladders positions, blocks (size and number and location, etc).

The changes must be obvious and visible and the game will still need to function. You will also HAVE TO make the follow additions:

* Type SCORE in the upper left hand corner. You may get a Output message about embedding font when you test it, this is okay.

* You will need to change the SCORE text to a DYNAMIC TEXT with an instance name of txtScore

* You need EVERY .as file saved in the same location as your .fla file.

* Copy the .as code from the attached ACTIONSCRIPT CODE file, but watch out, ALL four are on the same file. You want to be sure to copy only ONE AT A TIME.

 

Test it.

 

Let me know when you are done.

 

With the second partof our AIRPLANE project we are going to explore the wide, wonderful world of...

 

The MOTION EDITOR!!!! And how to modify our animation using it!

We're also going to look at different ways to NAVIGATE THE TIMELINE!!!

Throw in some TWEENING ROTATION and a little bit of SHAPE TWEENING and MOTION GUIDES and we have a recipe for FUN!

 

To top it off, we are going look at CLASSIC TWEENING!

 

TOO much excitement? I think not!

Play your timeline in reverse.

 

This is NOT a required assignment, merely an enrichment assignment that gives you a glimpse at some other aspects of Flash.

Should you choose to do it, it will be do NO LATER THAN the end of the second meeting of class (Tuesday for 1st and 3rd periods, Wednesday for 6th period).

 

Enjoy!

AIRPLANE: Part 1

No, it's not a slapstick comedy from the '80's, it's a Flash animated Airplane that you get to create!

 

We are going to cover the following concepts (some will be "review"):
- Keyframes and the Timeline

 

There will be periodic "Check-ins" that will be scored 10 pts = correctly done, 5 pts = in progress (and will be completed), 0 = not attempted.

 

Your FINAL AIRPLANE (after Part 3) will be a SUMMATIVE score.

All of your "check-ins" are Formative scores.

A Short FISH quiz.

Finish this completely and to the best of your ability and turn it in to the drop box.

Thanks.

Time for MORE FISHY!!!!!!!

 

In this installment of "Something Smells FISHY Around Here!" we will be looking at

- Working with Threaded and Mutli-Column text

- Adding Filters and working with Color

- Gradients

- working with Layers and Layer Folders

- Transforming Graphics and Gradients

 

HAVE FUN!

 

I will check your fish AT YOUR SEAT on Thursday (1st and 3rd periods) and Friday (6th period).

Buttons.

 

 

Here is the latest installment in our on-going FISH saga!

 

When you have reached the end of this lesson, raise your and and I WILL CHECK IT AT YOUR DESK!

This is a MAY DO assignment.

You may do it, but you should only do it AFTER your FISH is done as we will use Fishy for the bulk of what we do in the next few days.

 

This assignment introduces, very simply, Actionscript 3.0.

 

There will be more complex uses of it, but don't get too excited/paranoid, you're still in an intro class.

 

THIS WILL BE CHECKED AT YOUR COMPUTER WHEN YOU FINISH IT!
When completed, let me know an I will grade it at your desk, you DO NOT need to turn this in as we are still try to conserve space.

On the flip-side, if you don't tell me it's done and show me, I can't grade it...

 

Today we are going to return to our friend, the Fish.

No worry if your other fishy swam away, you are going to further explore the drawing tools in Flash and create a brand new fish, smarter, faster, stronger.

Dare I say, an uber Fish?

 

You will open the attached pdf document and work diligently.

Remember: Fish are friends, and made in Flash!

TIPS FROM THE TRENCHES

 

Read and, going point-by-point summarize and explain how you can use these tips in your final project, which will be an animation of several minutes.

PAINTING WITH TOOLS

 

Open the file: Drawing and Painting with Tools.

You will begin the creation of a stick figure which we will use over the course of the next few exercises.

There will be points discussed that you will summarize and turn in to a separate folder. I will let you know what and when.

Part I - The Drawing and Selection Tools

You will start by creating and modifying shapes and things you draw “freehand” and get some selection tool work in as well.

 

1.  Go FILE > Open and open the fl0102.fla file that is locate in the FLASH FILES folder on the “U” drive.

2.  Go FILE > Save As; in the dialogue Save As dialogue box type YourName_workfile.fla, then save it to your flash drive.

3.  Select the Selection Tool.

4.  On the stage, click once on the fin above the fish’s body and drag it downward until it joins the body.

5.  You will make a copy of this fin to use on the bottom of the fish. The easiest way is to clone it, or drag a copy from the original.

    To do this, click the top fin once to select it, then, while holding Alt, click and drag a copy away from the original. 

6.  Because this new copy will be a bottom fin, you will need to flip it around so it’s pointed in the proper direction. Click once to select the new fin copy, and then go
Modify > Transform Flip Vertical to get it pointed in the right direction.

7.  Still using the selection tool, click and drag the fin copy to the bottom of the fish’s body and leave it selected.

8.  You need to resize the fin. Go Window > Transform.

9.  With the new fin selected, type 60 in the Horizontal and Vertical Scale at the top of the panel and hit Enter or Return.

    This will reduce the size of the fin to 60% of its original size. You may need to reposition the fin. Do so with the Selection Tool.

    (Selecting the Constrain button in the Transform panel allows you to apply one
    number, the other will fill in automatically).

10. Give your fish the gift of sight: to create the eyeball, select the Oval tool (it may be nested under the rectangle tool).

    Select black for the fill color.

11. You can further manipulate your shape in the Oval Tool Properties panel. In the Property Inspector you will want to add a 50 for the Inner Radius. Hit Enter or Return.

12. Select Layer 1 in the Timeline, activating the layer then click and drag in the front of the fish (by the “nose”) and draw a small oval, the “eye”, then deselect.

Part II - Gradient and Color Tools

Now we are going to add some depth and vibrant color to your little “Nemo.”

1.  Grab the Select tool, click inside the fish, you should see the dots (“chicken pox”) that would indicate that the shape is selected.

2.  Click on the Fill color swatch at the bottom of the Tools panel. In the Swatches panel, choose the yellow-orange gradient at the bottom of the panel to apply it to the selected area.

    Deselect the fish.

3.  You will use the Eyedropper tool to select color from the body and apply it to the fins. Hold the Shift key and click each fin once to select both and then click once on the body to sample the color.

4.  Use Edit > Deselect All.

    Click and hold on the Paint Bucket icon and select the Ink Bottle. The Ink
    Bottle will allow you to change the stroke color of an object. You will use the
     Property Inspector to set the stroke color and style.

5.  In the Property Inspector, click the Stroke color swatch type #FF6600 (orange) in the hexadecimal field in the top left corner of the of the panel and then hit Enter or Return.

6.  Click on the Style menu that appears below the color swatches. Choose the ragged style from the drop-down menu. Click on the edge of the fish body to apply the new stroke and style.

7.  Click on the edge of the remaining fins and the gill line to apply the same color and stroke to all three. Choose Edit > Deselect All.

8.  Using the Selection tool, place it just to the right of the gill line without touching it. You will see a small curve appear below the pointer.

    Click and drag slightly to the right.

    This will curve the gill.

9.  Click the Oval tool in the Tools panel and select the Oval Primitive tool. Click the Fill color swatch at the bottom of the Tools panel and choose a light Blue color #6699FF.

    Click the Stroke color swatch and select No Color.

    Set the Inner Radius to 50 in the Property Inspector.

10.While holding down the Shift key, draw several ovals in front of the fish to create bubbles.

11.  Choose File > Save, and save your work.

DRAWING MODES

 

Open the file: Drawing Modes.

Read the file then submit a summary of the two Modes of Drawing that are discussed.

This is due by the end of class Tuesday (1st and 3rd period) and Wednesday (6th period).

Basic Flash Animation demonstration.

 

When asked in class, you will be able to demonstrate the follow Flash skills:

- Create and OBJECT

- Create a CLASSIC MOTION TWEEN

- Apply EASING to a Motion Tween

- Apply ROTATION to a Motion Tween

- Animate an object ALONG A PATH

 

Key points are in BOLD CAPS.

Demonstrate MASTERY of the skill, get 100%.

Miss one skill = 80%

Miss two skills or more = RETEST

Additionally, you will be required to define, explain in your own terms, and correctly submit (via WORD DOCUMENT and THIS Assignment DROP BOX) certain key-terms to help your understanding of FLASH.

 

You will be "TESTED" every TWO WEEKS. Terms are ADDED every week.

There will not always be 10 each week.

 

Terms for this week are:

KEYFRAME

ONION SKIN

PLAYHEAD

PROPERTY INSPECTOR

TIMELINE

STAGE

SWF

TWEEN

MOTION TWEEN

WORKSPACE

 

Flash Shape Tween to Text

Step 1
Take text Tool and type your first name on stage. To do the shape tween we need to convert this text into a shape.

Step 2
Right click on text and select break apart once and break apart again. Now text is converted to shape.

Step 3
Now delete your first shape. And lets type your last name and convert it to shape by using break apart twice.

Step 4
Right Click any where between your starting and ending frame

Step 5
From properties pannel select use Tween Drop down and select Shape

Step 6
If you see an arrow line on your time line, You are done.... Good Job

Step 7
Now test your movie by click on Control Menu and Test Movie
You can also test your movie By using Key board keys Ctrl with Enter

Flash Fade In Fade Out Tutorial

Step1: Create an object by using an oval tool
Step2: Righ Click on your object and select Convert To Symbol
Step3: Select Movie Clip and press ok
Step4: Right click on any empty frame from time line and select insert KeyFrame
Step5: Click on your last keyframe and then click on your object, from properties pannel Select Color and from Dropdown select Alpha change the Alpha to 10%
Step6: Right Click any where between your starting and ending frame and select Create Motion Tween
Step7: If you see an arrow line on your time line, You are done
Step8: Now test your movie by click on Control Menu and Test Movie
Step9: Now lets make Fade out Effect, Right click on any empty frame after your last frame  and select insert KeyFrame on time line
Step10: Click on your new last keyframe and then click on your object, from properties pannel Select Color and from Dropdown select Alpha change the Alpha back to 100%
Step11: Right Click any where between your starting and ending frame and select Create Motion Tween
Step12: If you see an arrow line on your time line, You are done
Step13: Now test your movie by click on Control Menu and Test Movie
Step14: Yahaaaa, Good job. Now you can see your fade in and fade out effect using Flash
We can use the same effect on an image or text

This little ditty is all about finding the right image and then "cutting" it up!

 

Follow the tutorial presented bellow.

Save it as YOUR NAMECUT-UP.

 

1. Open the image in Photoshop, change the Image Size to an even number (if you want to make the Math easier for yourself). Go Image > Image Size, deselect the Constrain Proportions box, round the size up (from 11.3 to 12 inches for example). You don’t have to do this, it will just make it a little easier when you create your guides.
2. Select white as the background color in the tool box, and under the Menu Bar choose Image > Canvas Size and increase both the width and height by one inch. Click on the centre box to ensure our white border is placed evenly around the image.
3. Now map out the areas that you are going to copy in order to keep the image looking balanced. From the menu bar select View > Rulers which will put a ruler around the image on two sides. Units of measure are irrelevant. Click on the side of the ruler and drag the lines out to mark our cutting grids. Your Grid (Guides) will be no smaller than 3x3 – that is three rows and three columns of boxes.
4. Select the Rectangular Marquee tool (short cut M on the keyboard), and from the top corner of the image you will drag the marquee downwards until it just overlaps the first grid.
5. To copy the selection use the Edit > Copy or press Ctrl C command then paste our selection Edit > Paste or Ctrl V. Try using the short cuts as they are much quicker. You will find that Photoshop has pasted in the selection as a new layer. Repeat this process until we have copied all the sections in the grid - but make sure when copying a selection you are working on the background layer.
6. With the background layer ‘active’ click on the Create New Layer icon, this will put a new empty layer above the background layer. Fill the new layer with white using the Edit >Fill command. The new white layer will hide any of the original background image.
7. Select one of the new layers and from the menu bar Layers > Effect > Drop Shadow set the distance to around 15, but try experimenting with the settings as the effect is added to all the layers. Why not try changing the order of the layers to give an 'overlapping' effect? In the layers palette click on the layer you want to move and drag it on top of the other layers.
8. We can also alter the angle of our new layer by calling up our Transform command Edit > Free Transform or Ctrl T. This puts a frame around a section of the image and by using the grab handles enables us to alter the angle.

EXTRA WORK SUBMISSION FOLDER!!!!!!!

 

Any of the OPTIONAL work that you chose to do can be submitted here.

 

- Cut-up

- Deepest Hole

- Deep Blue Sea

 

You CAN submit in this folder more than once,.

ILLAPORTRAIT

 

For this assignment you will use the picture that I took of you in class (located in the "U" Drive on your computer).

 

Use the image as a guide in the same way that you did with the Political Poster, outlining the various areas or features with the Pen Tool.

For "fill" you will use a suitable color. What is suitable? Not purple. Not green. The chances of you accurately matching your skin tone and its variations will be slim, however, we are still going for a "realistic" look.

 

You can choose to have a monochromatic color palette with the addition of some color accents or you may try to go for a color more representational coloring.

 

I will be looking at or for:

- your shading: is it realistic, does it look faked, was there obvious signs of attempting to lay in the shadows

- your "realism": no one has half-dollar sized eyes, did you add creases or lines where appropriate, are your eyes almond shaped or pie-shaped, is there an unusual or un-realistic color to the skin/hair

- your hair/clothing: was there an attempt made to show depth or layers or creases where appropriate, "block hair is not "wrong" (unless you look like Max Headroom), Don't worry about complicated patterns in clothing, you can go with a single color

- did you save it as a JPG and turn in the JPG file

- was his assignment done on time (12-13-2013 DUE date)

Turkeystrator

Today you will create a digital "hand-turkey" in Illustrator using the ellipse tool and pen tool.

 

YOU WILL HAVE:

1 ellipse for the body (the "palm")

1 ellipse for the neck (thumb)

4 ellipses for the feathers (fingers)

two feet created by the pen tool

a triangle head

a circle eye

pen tool created Wattle under the neck (three loops)

 

You will color the body, neck and feathers some hue (shade) of brown.

The head will be black.
The wattle will be red.

The eye is up to you.

 

For your background  you will find a suitable image on the internet and then "color" or illustrate, it in Illustrator.
Once complete, save your file, open it in Photoshop, crop as needed and then SAVE IT AS A JPEG.

 

TURN IN THE JPEG FILE!

 

Non-JPEG files will not be opened.
Files NOT labeled correctly (TURKEYSTRATOR) will NOT be opened.

Turkeys on images NOT illustrated will be considered INCOMPLETE.

Turkeys WITHOUT backgrounds will be considered INCOMPLETE.

 

I am not looking for Disney or Pixar level work. This is an exercise in learning Illustrator tools, have fun, but take it serious.

MOVIE POSTERS

Place your Final movie posters (teasers, minimal, posters) in this folder.

If you have already turned them in you DO NOT need t re-submit them.