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?