Objectives:

• Produce an HTML5 animation using Shape Tweens .

Student-Friendly Objectives:

• I can apply a Shape Tween to a drawn Shape.
• I can produce an HTML5 animation using multiple Shape Tweens.

Video Links:

Understanding Tweens:
https://tv.adobe.com/watch/learn-flash-professional-cs4/getting-started-11-understanding-tweens/

Creating Shape Tweens:
https://helpx.adobe.com/animate/using/shape-tweening.html/

Understanding Frames and Keyframes:
https://tv.adobe.com/watch/learn-flash-professional-cs5/gs02-understanding-frames-and-keyframes-/

Topics Discussed:

• Starting a new HTML5 document in Animate CC using the Welcome screen.
• Timeline
• Playhead
• Empty Frame
• Content Frame
• Keyframe
• Blank Keyframe
• Layer
• Shape Tools
• Shape Tween

Assignment:

1. Produce a new Animate HTML5 canvas. Name it “Your Name –  Shapes in Motion″
2. Use the Shape tools to draw a shape. You may use Merge Drawing or Object Drawing, but I highly recommend you use Object Drawing. (Note: Do not use the Oval or Rectangle Primitives!)
3. Use the process demonstrated in the video to create a Shape Tween that moves and transforms the shape. (i.e. change the shape, color or size and move the shape to a different part of the stage).
   
4. Create a new layer and repeat this process with a different shape. Do this two more times, using a different motion and transformation each time.
5. When you are finished, you should have four layers, each with a different Shape Tween transformation.
6. Turn in the completed “Your Name – Shapes in Motion” file to today’s Google Classroom post by the end of today.

Assigned: April 18th, 2019
Teacher Pacing Due Date: April 19th, 2019

Objectives:

• Identify and produce the three types of Symbols: Movie Clip, Button and Graphic.
• Identify the parts of the Timeline including the Playhead, Frames, Layers and Layer Controls.
• Identify the relevant timeline icons, including a Blank Frame, a Keyframe, an Empty Keyframe, and Content Frames.

Student-Friendly Objectives:

• I can create a Movie Clip, Button and a Graphic Symbol.
• I can identify the parts of the Timeline including the Playhead, Frames, Layers and Layer Controls.
• I can identify a Blank Frame, a Keyframe, an Empty Keyframe, and a Content Frame.

Video Links:

Using Symbols:
https://tv.adobe.com/watch/learn-flash-professional-cs5/gs04-using-symbols/

Understanding Frames and Keyframes:
https://tv.adobe.com/watch/learn-flash-professional-cs5/gs02-understanding-frames-and-keyframes-/

Topics Discussed:

• Starting a new HTML5 document in Animate CC using the Welcome screen.
• Library
• Symbols
• Movie Clip Symbol
• Button Symbol
• Graphic Symbol
• Timeline
• Playhead
• Empty Frame
• Content Frame
• Keyframe
• Blank Keyframe
• Layer

Assignment:

1. Produce a new Animate HTML5 canvas. Name it “Your Name – Symbols″
2. Use the Shape tools we worked with last week to draw a shape, then convert it to a Movie Clip Symbol using the technique demonstrated in class and in the video.
3. Make a new Layer in the Timeline.
4. Repeat the previous two steps to create a Button Symbol and a Graphic Symbol, each on its own Layer.
5. Turn in the completed “Your Name – Symbols” file to today’s Google Classroom post by the end of today.

Assigned: April 15th, 2019
Teacher Pacing Due Date: April 16th, 2019