week 1 lecture

advertisement
CSCI 053
Introduction to Software Development
Rhys Price Jones
Textbook:
Alice in Action with Java
By Joel Adams.
Published by Thompson Course
Technology.
ISBN: 1-4239-0096-0;
Published: 2008;
Software - free downloads:
Alice
http://alice.org/
Java 1.5
http://java.sun.com/j2se/1.5.0/download.jsp
Eclipse
http://www.eclipse.org/downloads
Exams etc
One midterm
One final
more or less weekly
quizzes
reading assignments
lab assignments
Objectives of CSci 053
What do you want the computer to do?
creativity and problem solving
Decide how to make it happen
design
Make it happen
programming
Critique the result
testing, analysis and maintenance
Creativity and Problem Solving
Can I teach these?
Can you learn these?
A Problem
in need of a (creative?) solution
The number 6 is perfect because
Its proper divisors 1 2 and 3
add up to 6: 1+2+3 = 6
What is the next perfect number?
Brute force vs elegant solutions
First few weeks
Problems will be “tell the following story”
design a solution using Alice objects
program the solution in Alice
test the solution
Closely follow the textbook
The rest of this presentation is based on a
presentation by Joel Adams -- the author
Follows exactly the first chapter of the
textbook
and what you will be doing in Lab 1
Week 1 Objectives
Design a simple Alice program
Build a simple Alice program
Animate Alice objects by sending them messages
Use the Alice doInOrder and doTogether
controls
Change an object’s properties from within a
program
Use Alice’s quad view to position objects near
one another
10
Getting and Running Alice
Alice software is freely distributed
Downloading Alice
Go to the website: http://alice.org
Click the link Get Alice 2.0 (or whatever the
latest version is)
Click download link specific to your operating
system
Save Alice.zip (or Alice.dmg) to your PC
11
Installing and running Alice (Mac)
Extract Alice from Alice.dmg file
this may happen automatically
Create desktop shortcut or dock item to
Alice.app
Double-click Alice desktop icon or singleclick dock item to launch Alice application
Installing and running Alice (Windows)
Extract Alice from Alice.zip file
Create desktop shortcut to Alice.exe
Double-click Alice icon to launch Alice
application
The Alice Tutorials
When you open Alice you are presented
with a screen offering you a choice of
tutorials
Four interactive tutorials teach the basics
of Alice
Work through tutorials as soon as you can
14
The Alice Tutorials (contd)
Access tutorials from Tutorial tab of
startup dialog
(see next slide)
Developing programs involves art and
science
Active learning: implementing designs as
you read
15
The Alice Tutorials (continued)
16
Program Design
Programming in Alice is similar to filmmaking
17
Film-making terms
Treatment: short prose version of a film
Screenplay: written version of film that includes dialog
Scene: a piece of the story usually set in one location
Shot: part of scene told with camera in one position
Viewpoint: perspective of camera for a given shot
Storyboard: drawing that provides blueprint for a shot
User Stories
Prose versions of programs from user
perspective
User story is the foundation of good software
The user story plays a role similar to a
screenplay
19
Critical components of user story
A basic description of events taking place in the
story
Nouns in the story (which correspond to objects)
Verbs in the story (which correspond to actions)
Chronological flow of actions (algorithm)
Guideline: number actions according to their
flow
User Stories (continued)
21
Storyboard-Sketches
Storyboard
Detailed drawing of a shot
Arrows show movements of characters or
camera
Collection of storyboards helps actors
visualize film
Storyboard-sketch: storyboard for application
screen
22
Components of a storyboard-
Object’s position (location)
Object’s pose (position of limbs, if it has
any)
Object’s orientation (direction it is facing)
Camera’s viewpoint
Storyboard-Sketches (continued)
24
Transition Diagrams
Link the multiple storyboard-sketches
In a movie, transition diagram is a linear
sequence
25
Transition Diagrams (continued)
26
Quizlet
1. A(n) ____________________ is a piece of the story that is told with the camera in
the same position.
Answer:
2. ____________________ are drawings that show the position and motion of each
character in a shot.
Answer:
3. The ____________________ in a story correspond to the actions you want the
objects to perform in the story.
Answer:
4. A sequence of steps that solves a problem is called a(n) ____________________.
Answer:
Quizlet answers
1. A(n) ____________________ is a piece of the story that is told with the camera in
the same position.
Answer: shot
2. ____________________ are drawings that show the position and motion of each
character in a shot.
Answer: Storyboards
3. The ____________________ in a story correspond to the actions you want the
objects to perform in the story.
Answer: verbs
4. A sequence of steps that solves a problem is called a(n) ____________________.
Answer: algorithm
How to Program in Alice
Templates provide a basic world environment
Sample program is based on the “grass”
Template
29
Areas in the Alice Window
30
Areas in the Alice window
Menus: includes File, Edit, Tools, and Help
Buttons: includes Play, Undo, and Redo
Object tree: lists all world objects; e.g., ground
Details area: includes properties, methods, functions
World window: displays graphic objects in a program
Editing area: includes editing space and controls
Events area: contains actions responding to events
Program Style to match book
Change program display styles in Preferences
How to access Preferences dialog box
Click the Edit menu
Click the Preferences choice
Selecting a display style in Preferences dialog
Click next to “display my program” in General tab
Select a style
Style recommended for course: Java Style in Color
32
Program Style (continued)
33
Adding Objects to Alice
Class: blueprint for an object
How to populate Alice world with objects
Click Add Objects button in world window
Locate class specifying the object in the Alice Gallery
Right-click class and select “Add instance to world”
Objects in sample world: aliceLiddell and whiteRabbit
Naming conventions for objects and classes
Class: capitalize all words; e.g., AliceLiddell
Object: capitalize all but first word; e.g., aliceLiddell
34 the object tree
Objects can be renamed from
Adding Objects to Alice (continued)
35
Position the objects
how?
demo
click “done” when satisfied
Accessing Object Subparts
Bounding box: encloses any Alice object
Impact of selecting an object in the object
tree
Bounding box is drawn around object in
world window (doesn’t seem to on my
Mac)
Details area adapts to the selected object
37
First action to program:
Alice turns head to user
First set of programming steps
Select + sign next to aliceLiddell in
object tree
Select + sign next to neck subpart
Select head (bounding box is drawn, details
change)
Drag doInOrder control to top of editing
window
Accessing Object Subparts (continued)
39
Accessing Object Subparts (continued)
40
Sending Messages
Programs rely on sending messages to objects
Method: behavior-producing message
41
Programming Alice’s head to turn
Select Alice Liddell’s head in the object tree
Scan through the methods in the details
area
Click on pointAt()
Drag pointAt()to the editing area and drop
it
Specify camera as the target
Send a message to the head
43
Testing and Debugging
Bug: error interfering with normal program
functions
Debugging: process of removing program
bugs
Click the Play button to test Alice Liddell
application
Alice Liddell’s head will turn toward the
user
44
Testing and Debugging (continued)
45
Coding the Other Actions
Task: complete first Alice Liddell application
Add Alice Liddell’s initial greeting
Point the white rabbit to the user
Have Alice Liddell introduce herself
Have the white rabbit introduce himself
46
Customize messages
say() message
Displays dialog for an object
Text can be customized by selecting other…
other customizations by selecting from more…
Example: adjust fontSize of message text to 30
Coding the Other Actions (continued)
48
Statements
Statement: a line or control structure in a program
Computer program is a collection of statements
Basic format of a line in a program
– object.message(value); more...
Control structures manage other statements
Example: doInOrder contains other
statements
49
The Final Action of the Story
Sequential execution
Actions are performed consecutively
Example: actions executed in doInOrder
structures
Simultaneous execution
Actions are performed in parallel
Example: actions performed in
doTogether structure
50
Finishing the first program
Add doTogether control structure to
application
Send say( )to aliceLiddell and
whiteRabbit
Message value: Welcome to our
world
The Final Action (continued)
52
Final Testing
First set of actions are performed
separately
Final actions are performed
simultaneously
53
Final Testing (continued)
54
The Software Engineering Process
A methodical approach to constructing
programs
Two parts:
design and
implementation and testing
55
Design
Write the user story
Organize nouns and verbs into an
algorithm
Create storyboard-sketches and the
transition diagram
Implementation and testing
For each noun in the story, add an object
to Alice world
Match message to verb and send message
to object
Test message to determine if it produces
desired action
Alice’s Details Area
Reflects attributes and behaviors of selected
object
Three panes: properties, methods, and
functions
58
The properties Pane
59
The properties Pane
Includes attributes such as color, opacity, visibility
Change values to alter object appearance/behavior
Example: make the White Rabbit disappear
Click opacity in the properties pane
Drag opacity to the editing area
Set opacity to 0
Change the duration to 2 seconds
60
Changing a Property
How a program changes when a property
is altered
New message is added to editing area
In the example above, a set () message is
added
The methods Pane
62
The methods Pane
Provides a list of behavior-generating messages
Objects respond to set of predefined basic
messages
Example: the resize( ) message
Some classes provide advanced methods
Examples: Frog, Monkey, Penguin
You can build complex animations using
methods
63
The functions Pane (continued)
64
The functions Pane
Provides list of information-returning messages
Functions return data, messages produce behavior
Some information returned by functions
Proximity to another object
Size in terms of height, width, or depth
Spatial relation to another object
Point of view (position and orientation in the world)
Subparts
• world object responds to different set of functions
65
Quizlet
1. True or False: Every Alice object can be surrounded by a bounding box.
Answer:
2. ____________________ are behavior-producing messages.
Answer:
3. A computer program consists of a collection of ____________________,
the combination of which produce some desirable behavior.
Answer:
4. ____________________ are messages that we can send to an object to
retrieve information from it.
Answer:
Quizlet answers
1. True or False: Every Alice object can be surrounded by a bounding box.
Answer: True
2. ____________________ are behavior-producing messages.
Answer: Methods
3. A computer program consists of a collection of ____________________,
the combination of which produce some desirable behavior.
Answer: statements
4. ____________________ are messages that we can send to an object to
retrieve information from it.
Answer: Functions
Alice Tip: Quad View
Actions performed after pressing ADD OBJECTS
Navigate the Alice Gallery, Locate classes, Use classes to
add objects to the world
Two views: single view and quad view
quad view
World window
View from the top
View from the right
View from the front
Alice Tip: Quad View
69
Summary
Alice: software tool used to create virtual worlds
User story: prose description of program form
the user’s point of view
Shot: component of a scene with the camera at
one viewpoint
Algorithm: flow of actions that solves a problem
Storyboard-sketch: drawing of a distinct screen
in a computer application
70
Summary (continued)
Alice window: menus, buttons, object tree,
details area, world window, editing area, and
events area
Class: blueprint for an object
Method: behavior-producing message
Function: message that returns information
Software engineering encompasses software
design, and implementation and testing
71
Review Questions
1. What is the difference between a scene and a shot?
2. How do you convert a user story into a program
flow?
3. Why are the ground, light, and camera objects
essential parts of an Alice world?
4. What is the relationship between a class and an
object?
5. What is the difference between methods and
functions?
Download