Objective:

• Produce a complete HTML5 animation in Adobe Animate CC using all the techniques studied over the past two weeks.

Student-Friendly Objective:

• I can produce a complete HTML5 animation using all the techniques we studied in class.

Video Link:

See video links attached to the previous lessons for review.

Topics Discussed:

• For a complete list of Topics Discussed, please see the previous lessons starting with April 11th, 2019.

Assignment:

1. Open the “Pac-Man” animation produced in the “Animating with Keyframes – Eat Some Dots!” lesson. Your Pac-Man symbol should now cross the Stage once, “eating” all six dots along the way. If you still need to complete this animation, review the previous lessons for instructions on how to do this.
   
2. Today, your objective is to complete this animation by adding a Red Ghost chasing Pac-Man across the stage to the right, then having Pac-Man chase a Blue Ghost to the left. You will need to utilize Symbols, Layers, Keyframes and Motion Tweens to achieve this. You may use any resources you have available to you to determine the best way to do this. Examples of resources include: This website and the previous lessons, The Learn Flash Professional video series linked from the previous lesson pages, The Learn Animate CC video series on the Adobe website, Google Search, and your neighbors.
3. The animation should not be more than 128 frames of animation.
   
4. Press Command + Return (Ctrl + Enter on the PC) to test your movie.
   • Pac-Man should move across the stage (with the embedded mouth “chomping” animation)
   • Pac-Man should “eat” all six of the dots
   • Pac-Man should be chased by a Red Ghost monster to the right side of the stage. Both Pac-Man and the Red Ghost should exit the stage on the right hand side.
   • Pac-Man should chase a Blue Ghost monster onto the stage, cross the stage, and exit the stage on the left hand side.
   • The entire animation should be completed in no more than 128 frames.
     
5. Save your work. Turn in the completed “Pac Man Quiz.fla” file to today’s Google Classroom post “Pac Man Quiz” by Wednesday, May 1st.

Extension Activity

1. If you complete the quiz objectives early, then you are issued the following challenge:
   • Can you make Pac-Man eat a flashing Power Pellet and turn the Red Ghost into a Blue Ghost before chasing him off the stage?
     • Hint: The flashing Power Pellet can be achieved with keyframes or Motion Presets.

Good Luck! Assigned: April 25th, 2019
Due Date: May 1st, 2019

Objective:

• Produce an animation in Animate CC using Embedded Animation, Motion Tweens and Keyframes.

Student-Friendly Objective:

• I can produce a complete HTML5 animation using Embedded Animation, Motion Tweens and Keyframes.

Video Link:

Topics Discussed:

• For a complete list of Topics Discussed, please see the previous lessons.

Assignment:

1. Open the “Pac-Man” animation produced in Lesson 38 – “Animating Within a Symbol”. Your Pac-Man symbol should now cross the Stage once, opening and closing his mouth (using the embedded animation technique we learned yesterday).
2. Today, your objective is to make Pac-Man eat some dots as he moves. We will do this using a “keyframe animation” technique.
3. Double-click your “Layer 1” and rename it “Pacman”. This should be the layer that your Pac-man symbol Motion Tween is on.
4. Create a new layer, and name it “Dots”.
5. On the “Dots” layer, draw six evenly spaced dots using the Oval tool (hold shift to make a perfect circle!) along the straight motion path that Pac-man crosses (make sure that Pac-man touches each dot at least once).
6. Scrub the playhead to the first frame that Pac-man completely crosses a dot (the dot will be over Pac-man, because the “Pacman” layer is above the “Dots” layer).
7. Press F6 on the keyboard to copy all the dots on the first keyframe to the current frame.
8. Delete the dot that is currently over Pac-man.
9. Repeat this process for each of the remaining five dots (F6, move Pac-man under the dot, delete the dot).
10. Once you have deleted all six dots, move the “Dots” layer below the “Pac-man” layer.
11. Scrub the playhead, and Pac-man should appear to “eat” the dots as he moves across the stage.
12. Press Command + Return (Ctrl + Enter on the PC) to test your movie.
    • Pac-Man should move across the stage (with the embedded mouth “chomping” animation)
    • Pac-Man should “eat” each of the six dots as he crosses the stage.
13. Save your work as “Your Name –  Pac Dots.fla” and upload a copy to today’s Google Classroom assignment post by tomorrow, April 25th.

Finished Movie Example:
PacDots.mp4

Good Luck! Assigned: April 24th, 2019
Teacher Pacing Due Date: April 25th, 2019