Storyboarding and Program Design

1. Storyboarding and Program Design Alice

2. Step 1: Design • Decide on the problem to be solved • Design a solution • We will use a storyboard design technique, commonly used in the film industry

3. Example • The scenario (description of the story/game) is: First Encounter After traveling through space, a robot-manned craft has just made a landing on a moon. The robot is on the moon and has set up a camera so earthbound scientists in Houston can view this historic event. The camera view shows the robot, the lunar Lander and some nearby rock formations. Suddenly an alien peeks out from behind a rock, surprising the robot. The robot looks around, spots the alien, and walks over to take a closer look. The alien is frightened and hides behind the rocks. • The problem is: How can we create this animation?

4. Create Initial World

5. StoryboardOption 1: Sketches

6. StoryboardOption 2: Screen Shots Initial scene The spiderRobot walks toward the alien

7. StoryboardOption 3: Text Form • A textual storyboard is like a "to-do" list. • The Learning to Program in Alice textbook puts a textual storyboard in a box: • Below is an algorithm in psuedocode (half English-half code) Do the following steps in order alien moves up alien says "Slithy toves?" robot's head turns around robot turns to look at alien Do together robot moves toward the alien robot legs walk alien moves down

8. Demo • FirstEncounter

9. Step 2: Implementation • Toimplement the storyboard, translate the actions in the storyboard to a program. • Program (a.k.a. script) • a list of instructions to have the objects perform certain actions in the animation

10. Break it down! • Creating a list of instructions is also known as creating a methods • Often a program has many method (even thousands!) • Often a method uses a variable • A variable is just like in Math—a name a different object. Example: name = “Alice” Alice is now stored in a variable called name.

11. Action Blocks in Alice Sequential Action Block – actions occur one after another Simultaneous Action Block -- actions occur at the same time

12. Concepts in this first program • Program instructions may have arguments • Example: for the move instruction, the arguments we used in this example were • direction • distance • DoTogether and DoInOrder blocks can be nested one inside the other

13. Testing • An important step in creating a program is to run it – to be sure it does what you expect it to do. • Read, design, implement, test • We recommend that you use an incremental development process: • write a few lines of code and then run it • write a few more lines and run it • write a few more lines and run it… • This process allows you to find any problems (bugs) and fix them as you go along. • Getting rid of bugs is called degugging

14. Comments • While Alice instructions are easy to understand, a particular combination of the instructions may perform an action that is not immediately obvious. • Comments are used to document the code – explain the purpose of a particular segment of the program to the human reader. • //This slide is to show comments

15. Assignment #1: Snow People • Create a snow world. Place three snow people in the Snow World. Two snowwoman should be facing one another and a snowman is behind them. • A snowman is trying to get a snowwoman’s attention. The snowwoman should be talking to a friend. • The snowman should say “Ahem”. The snowwoman should turn toward the snowman. The snowman should then blink his eyes. (Make sure you store the word “Ahem” in a String variable.) • The snowwoman should blush (face turns red). Then she shows she is not interested by turning and walking away. • The snowman then hangs his head in dissapointment.

16. Assignment #2 • Open the Island Application from the previous lesson • Make the fish swim in a circle around the island. • At some point in time when it is swimming the fish should jump out of the water and then under the water. • Eventually the fish should return to it’s original position