Skater World: Part Two

1
Skater World Part Two

• By Deborah Nelson
• Duke University
• Under the direction of
• Professor Susan Rodger
• June 1, 2009

2
Overview

• The story continues After the conversation, we
  want skaterGirl to get on the skateboard, make
  the jump, and then skate around one of the cones
• What we will do
• Create new methods
• Animating parts of an object
• Using As Seen By
• Camera Control
• Using Buttons
• Using Dummy Objects
• Changing Point of View

3
Step Two Methods

• A method is a sequence of instructions that will
  be carried out when requested. Built in methods
  are used to create new methods so that the
  characters can learn to do more.
• The two types of methods are class-level and
  world-level. A class-level (or object-level)
  method defines the behavior for a single object.
  A world-level method has objects that interact
  with each other.

4
To Create your method

• Since our methods involve several objects, we
  will create world-level methods.
• Click on world in the object tree. Click on the
  methods tab in the details areas.
• Click create new method. Name it getOnBoard.
• Click OK. A new tab appears in the method editor

5
Introducing Another Tool

• The Events Pane
• This is where you control when certain methods
  are called and the user interactions within your
  animation.

6
When the world starts . . .

• As we write this new method, we dont want to
  watch the entire conversation we wrote from part
  one every time we play the world.
• In the Events pane, click on the arrow and select
  getOnBoard from the drop down menu.

7
Writing getOnBoard method

• In our story, we want the girl to go forward to
  the skateboard and hop up onto it.
• Click on the getOnBoard tab in the method editor
• On top of the Do Nothing drag in skaterGirl move
  to, select skateboard, the entire skateboard
• Play your world.
• See the next slide for screenshot

8

• The girls moves into the skateboard because the
  move to method uses the center of each object.
• We would have to manually measure how far the
  skaterGirl needs to move to the skateboard

9

• To realistically make the
• skaterGirl move to the
• skateboard, we will put an
• invisible object next to the
• skateboard and have
• skaterGirl move to that
• object.
• Click on Add objects. Go
• to the Shapes folder. Drag
• a box into your world.

10
Positioning the Box

• First, we want the skateboard and box oriented
  correctly.
• Right-click on the skateboard in the object tree.
  Select methods, turn to face, jump.
• Right-click on the box, select methods
• orient to,

skateboard, the entire skateboard
11
Using Quad View

• Now, click on quad view. Use the move arrow to
  position the box next to the skateboard. Remember
  to hold down shift as you drag in order to move
  up or down

12
Step Four Properties

• Attaching objects together
• Now that weve positioned our box, we want it to
  stay next to the skateboard, wherever the
  skateboard moves.

• In the properties tab, set the boxs vehicle
  property to skateboard the entire skateboard
• The vehicle property attaches an object to
  another object. They always move together

13
Understanding vehicle property

• Click Done to exit the gallery.
• Drag Do together into the getOnBoard.
• Drag the following into the Do together
• Play your world.
• See the next slide to see what went wrong

14

• You can see the box move past the skateboard. We
  only need to move the object that is the vehicle,
  in this case the skateboard

• Right click on the box instruction and select
  disable
• Play your world to see the box move
• with the skateboard since the skateboard is
• The boxs vehicle

• Now that you see how vehicle property works,
  delete everything in this Do together by dragging
  it up to the trashcan

15
Properties continued Making an object invisible

• Now that the box is positioned and attached, we
  need to make it invisible.
• Click on the box in the object tree.
• Click on the properties tab in the details area
• Set isShowing to false

16

• Finally, we can change the color of objects.
• Click on the cone in the object
• tree. In the properties tab, change
• the color to orange. Do this to every
• cone

• You can even change the color of default Alice
  objects. For example, click on ground in the
  object tree and change it's color to green.

17
Finish writing getOnBoard

• In the move to instruction, click on the arrow
  beside the skateboard. Change it to box because
  we want skaterGirl to move to the box, not the
  skateboard.

18

• Drag in skaterGirl turn, right, 0.3
• Drag in skaterGirl move, up, 0.16
• Drag in skaterGirl move, forward 0.4
• Set the duration of each instruction to 0.4
• You will learn how to position and move objects
  with greater position. For now, you may have to
  increase the move up amount.

19
skaterGirl Vehicle

• While skaterGirl is on the board, we want her to
  move with it, so we must change her vehicle
  property to skateboard
• Click on skaterGirl in the object tree. Click on
  the properties tab.
• Since we want her vehicle property to be changed
  during the animation, drag her vehicle property
  into the getOnBoard method. Set it to skateboard,
  the entire skateboard.

20
Calling your method

• Now lets call getOnBoard from
  world.myFirstMethod
• Click on the world.my first method tab

• Then drag in world.getOnBoard from the world
  methods under the conversation instructions from
  Part One

21
Play Your World

• Play Your Entire World
• Remember to change the
• event from getOnBoard to
• world.my first method

22
Creating makeJump method

• Click on world in the object tree. In the methods
  tab, create new method, name it makeJump
• In this method, the skateboard will turn to face
  the jump object. Then it will turn up slightly,
  go over the jump, move forward, and then go back
  down to the ground

23
Call MakeJump

• Now we need to call our new method. Click on
  world.my first method.
• Drag in a Do together. Drag world.makeJump into
  the Do together
• Drag skaterGuy turn to face, select jump

24
Writing Make Jump

• Click on the makeJump tab to add code to that
  method
• When the skateboard turns to face the jump
  object, skaterGirls head will turn right.
• Since we want this to happen at the same time,
  first, drag in the control statement, Do together
• Drag in skateboard turn to face, select jump.

25
Animating Parts Of Objects

• To animate part of an object, expand the object
  in the object tree by the

• Expand skaterGirl, upperBody, neck,
• Drag head into the Do together. Select turn
  ,right, ¼ revolution. Set duration to 0.5

• Result

26

• Next, (underneath the do together), drag in
  skateboard from the object tree.
• Select move toward, 1 meter, jump.
• Change the 1 meter so that the girl
• moves close to the board when you play your
  world

• I changed the amount to 7 meters.
• Then, click on more in the instruction and change
  the style to abruptly

27
Finish writing makeJump

• We change the style to abruptly so that there
  will not be a pause between each instruction
• Drag in the rest of the instructions underneath
  the Do together. The complete method is on the
  next slide.
• Notice the change in style and duration of each
  instruction. Play your world

28
The complete method
29
Animating parts of skaterGirl

• We can make this jump look more realistic by
  making the skaterGirl bend her knees
• Click on skaterGirl in the object tree. Click
  create new method. Name it bendDown. Click OK.
• Drag in a Do together and the following
  instructions

30

• SkaterGirl legs will bend when the board moves.
  To do this, click on the makeJump tab. Drag a Do
  together above the move forward 4 meter
  instruction. Then drag that instruction into
  the Do together.
• Click on skaterGirl in the object tree and drag
  the bendDown method into the Do together.

Play your world
31

• Now that shes bent, we need a method for her to
  stand up. Thats the opposite of what we just
  did. Click on bendDown tab.
• Drag the whole Do together to the clipboard to
  make a copy of it.

32

• Click on the skaterGirl in the object tree.
  Create a new method named standUp.
• Drag from the clipboard into standUp to paste
  what we copied.

33
Change move down to move up. Change the Leg
instructions from backward to forward. And change
the lowerLeg instructions from forward to
backward.

• Now we want skaterGirl to stand up and skate
  around one of the cones. So lets write one more
  new method

34
Writing SkateCircle

• Click on world in the object tree. Click create
  new method, name it skateCircle, click OK
• Drag in the following code. except turn to face
  whichever cone is closest to the jump

35
As Seen By

• To make the skateboard turn around the cone, for
  the final instruction in skateCircle
• Drag in the skateboard turn left, 1 revolution.
• Click on more, select asSeenBy, cone.

• Drag skateCircle underneath the instructions in
  world.my first method
• Play your world
• You may have to change the last move forward
  amount

36
Step Five Camera Control

• Now lets learn how to change the camera view.
• Before the skaterGirl jumps, we want to move the
  camera in order to watch her jump from the right
  side.
• Click on Add Objects. You can move the camera
  using these buttons
• Use only the middle one, click and drag the
  camera to the right and then drag it forward and
  swing it around so that youre looking at your
  scene from the right side. Try it slowly.
• Remember to use undo if you make a mistake

37

• When your scene looks like this, first play your
  world to make sure that you can still see the
  conversation and the jump

• Once youre satisfied with the camera position,
  click more controls, then drop dummy at the
  camera
• Expand Dummy objects in the
• object tree. Rename Dummy as
• sideView

38
Changing the View in the animation

• Click Done to exit the layout mode
• Now that we have multiple views, we must specify
  the view at the beginning of the animation.
• Drag camera from the object tree into the very
  beginning of world.my first method. Select set
  point of view, Dummy Objects, originalPosition.
  Set duration to 0.

• See the next slide for the screenshot

39
Set Point of View to Dummy Object

• This screenshot shows setting the camera point of
  view to the originalPosition.

• Then, right after world.getOnBoard, drag camera
  set point of view, select Dummy Objects, sideView
• Play your world

40
Set point of View to an Object

• Another way to change the point of view of the
  camera is to set it to a character. Lets set the
  view to skaterGirl.
• Before the call to skateCircle, drag in the
  camera and select set point of view. Select
  skaterGirl, select her head, the entire head.
• Play your world.
• See the next slide for an explanation of what
  went wrong

41

• When you play the world, the skaterGirl moves,
  but the camera doesnt move with her.
• Drag in a Do together above the call for
  skateCircles. Drag the set point of view to
  skater girls head instruction into it.
• Then drag camera into the do together and select
  set vehicle, select the skaterGirls head.

42
World.myFirstMethod

• The current version of myFirstMethod, after the
  conversation

• Congratulations on finishing Part Two. In Part
  Three, you will learn how to interact with your
  animations