CS320n – Elements of Visual Programming
description
Transcript of CS320n – Elements of Visual Programming
![Page 1: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/1.jpg)
CS320n – Elements of Visual Programming
Alice ConceptsMike Scott(Slides 1-2)
![Page 2: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/2.jpg)
Visual Programming Alice Concepts 2
What We Will Do Today• Finish the material in chapter 1• Continue working on the tutorials and
appendix 1 material in Alice
![Page 3: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/3.jpg)
Visual Programming Alice Concepts 3
Types of Animation• Two kinds of Alice animations
– Movie• User “watches” animation• “machine-centric”
– Interactive• User participates – clicks mouse,
controls actions with keys• “user centric”
![Page 4: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/4.jpg)
Visual Programming Alice Concepts 4
Events• Animations that are “interactive depend on the
user’s actions– mouse click– key press– others (head mounted device, dance pad)
• Actions are events• Interactive programs are event driven
Event window portion of Alice
![Page 5: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/5.jpg)
Visual Programming Alice Concepts 5
Interactivity in Alice• Animation with no
interaction– Movie– DEMO Octopus Ride
• Animation with interaction– DEMO Ice Skater– What are the events?– What response does the
skater make to each event?
![Page 6: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/6.jpg)
Visual Programming Alice Concepts 6
Objects• What is an object?
– anything that can uniquely identified from other things
• What makes an object unique?– has a name– has properties
• width, height, color, location, age, id#– has a purpose
• associated actions it can perform• tasks it can carry out – things it knows how to do
![Page 7: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/7.jpg)
Visual Programming Alice Concepts 7
Classes• Objects are categorized into classes
• Each objects is an instance of the class• All objects in a class
– have the same properties– generally can perform the same tasks
Penguins
Dogs
Skipper
Kowalski
PrivateSnoopy
Odie
RenOpus
Rico
![Page 8: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/8.jpg)
Visual Programming Alice Concepts 8
Objects in a Virtual World• In Alice, each 3D model is a class of
objects– class: penguin– objects: penguin,
penguin1, penguin2
![Page 9: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/9.jpg)
Visual Programming Alice Concepts 9
Changing Properties of Obejcts• Properties of Object can be
changed• Location can be changed by
clicking and moving object• Orientation can be changed
in the “Add Objects” View• Other properties, such as
color, can be changed in the properties window when the object is selected
![Page 10: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/10.jpg)
Visual Programming Alice Concepts 10
Object Parts• Objects may be composed of parts
– which may in turn be composed of parts– the whole object may be told to do something or
an individual part
![Page 11: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/11.jpg)
Visual Programming Alice Concepts 11
Center of an Object• each object has center point
– usually near center of mass, but really set by graphic artist that created object
– spin point for object– things that sit or stand on
ground usually havecenter between feet
– things that are held havecenter at point object would be held
![Page 12: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/12.jpg)
Visual Programming Alice Concepts 12
Distance• object’s distance from each other are
based on the distance between their center points
• may look like objects are zero distance away, but actually centers still some positive distance away
![Page 13: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/13.jpg)
Visual Programming Alice Concepts 13
Position in the World• The world in an Alice
program models a 3D space
• every object in the world has a positionx, y, z, coordinate relative to the center of the world
• ground starts at center of world
• axes (green = up, red = right, blue = forward)
![Page 14: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/14.jpg)
Visual Programming Alice Concepts 14
Adding 3D Text• Under the “Add Objects”
window• Creates a 3D Text Object that
can be positioned in the scene• Like other objects it has a host
of behaviors and properties
![Page 15: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/15.jpg)
Visual Programming Alice Concepts 15
Adding “Billboards”• Billboards are flat, 2D
images in a scene• Almost any graphic type
can be added.• GIF, JPG, TIF, PNG, BMP• Select file and image is
added to scene• Images must be created is
some other program
![Page 16: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/16.jpg)
Visual Programming Alice Concepts 16
![Page 17: CS320n – Elements of Visual Programming](https://reader031.fdocuments.us/reader031/viewer/2022020200/56815f8f550346895dce92a5/html5/thumbnails/17.jpg)
Visual Programming Alice Concepts 17
Class Work• Continue work on tutorials• Appendix A,
– Part 1 – Part 2: Using Pop up menus to create an
initial scene.