Lecture Animated - University Of Wisconsin-Madison
9/14/10 UNIVERSITY of WISCONSIN-MADISON Computer Sciences Department CS 202 Introduction to Computation " Professor Andrea Arpaci-Dusseau Fall 2010 Lecture 4: How can computation create animated stories? Flowcharts Flowchart: Visual representation of steps of algorithm Summarizes how algorithm behaves given specific answers Symbols Boxes: Represent states (or actions or actions) Arrows (or edges): Show transitions (or decisions) between states Flowchart Example Flowchart for Animated Story Animated Story: Behaves the same every time No decisions! Flowchart is summary of sequential action of story How to create flowchart? Identify Initial State or Scene Group individual actions into higher-level “scenes” – Somewhat subjective (no right answer) – Label with descriptive name Identify characters of story – Specify actions of each character in scene Connect scenes sequentially 1
9/14/10 Animated Story Flowchart of Animated Story *Initial state* See Scratch code posted on web site! Flowchart of Animated Story *Initial state* Background: Railroad Cat: Left side Dog: Right side Flowchart of Animated Story *Initial state* Background: Railroad Cat: Left side Dog: Right side *Introductions* Cat: What should we do? Dog says: I don't know 2
9/14/10 Flowchart of Animated Story *Initial state* Background: Railroad Cat: Left side Dog: Right side *Introductions* Cat: What should we do? Dog says: I don't know *Color* Cat says: Lets do Tricks! Cat: I can change colors! Cat changes to 5 colors Cat changes back Flowchart of Animated Story *Initial state* Background: Railroad Cat: Left side Dog: Right side *Introductions* Cat: What should we do? Dog says: I don't know *Color* Cat says: Lets do Tricks! Cat: I can change colors! Cat changes to 5 colors Cat changes back *Whirl* Cat says I can whirl Cat whirls 5 times Cat changes back Flowchart of Animated Story *Initial state* Background: Railroad Cat: Left side Dog: Right side *Whirl* Cat says I can whirl Cat whirls 5 times Cat changes back *Introductions* Cat: What should we do? Dog says: I don't know *Fly* Cat moves 5 times Cat goes back *Color* Cat says: Lets do Tricks! Cat: I can change colors! Cat changes to 5 colors Cat changes back Flowchart of Animated Story *Initial state* Background: Railroad Cat: Left side Dog: Right side *Whirl* Cat says I can whirl Cat whirls 5 times Cat changes back *Introductions* Cat: What should we do? Dog says: I don't know *Fly* Cat moves 5 times Cat goes back *Color* Cat says: Lets do Tricks! Cat: I can change colors! Cat changes to 5 colors Cat changes back *Tiny* Cat becomes tiny Dog says I like that! Cat says why? 3
9/14/10 Flowchart of Animated Story *Initial state* Background: Railroad Cat: Left side Dog: Right side *Whirl* Cat says I can whirl Cat whirls 5 times Cat changes back *Introductions* Cat: What should we do? Dog says: I don't know *Fly* Cat moves 5 times Cat goes back *Color* Cat says: Lets do Tricks! Cat: I can change colors! Cat changes to 5 colors Cat changes back *Tiny* Cat becomes tiny Dog says I like that! Cat says why? *Eat* Dog says: No reason Dog walks until reaches cat Cat meows and disappears Dog says yummy How to Transform Flowchart to Scripts? Flowchart of Animated Story *Initial state* Background: Railroad Cat: Left side Dog: Right side *Whirl* Cat says I can whirl Cat whirls 5 times Cat changes back *Eat* Dog says: No reason Dog walks until reaches cat Cat meows and disappears Dog says yummy *Introductions* Cat: What should we do? Dog says: I don't know *Color* Cat says: Lets do Tricks! Cat: I can change colors! Cat changes to 5 colors Cat changes back *Tiny* *Fly* Cat moves 5 times Cat goes back Cat becomes tiny Dog says I like that! Cat says why? *End* Background and Dog fade out Background shows The End How to Tell Another Script to Run? Approach For each scene in flowchart, specify a script – May need to specify script for each character – Blocks in script show individual actions to be performed How to determine when script can run? – When should “Initial state” run? – When should “Introductions” scene run? – When should “Color” scene run? 4
9/14/10 How to Run Desired Script? Cat Scripts See Scratch code posted on web site! Dog Scripts Stage Scripts 5
9/14/10 Programming Concepts General Divide high-level functionality into logical units Descriptive naming is important Initial state must be specified Incrementally test code as you go Scripts must be activated to run Execution within script proceeds sequentially Control : forever, repeat times , repeat until Parameters (to blocks) specify behavior Goal is to make “non-fragile” code – When flag clicked; When receive message Today’s Summary Today’s Topics How to create animated stories in Scratch How to outline a sequential flowchart of steps How to broadcast and receive messages in Scratch Reading: Scratch User’s Guide Announcements Homework 2 due before class Friday – See web page for hw details (www.cs.wisc.edu/ cs202-1) – Any questions Send mail to cs202-tas@cs.wisc.edu Lab Hours in 1370 CS – Monday, Wednesday: 12-2pm – Tuesday, Thursday: 4-6pm 6
Flowchart Example Flowchart for Animated Story Animated Story: Behaves the same every time No decisions! Flowchart is summary of sequential action of story How to create flowchart? Identify Initial State or Scene Group individual actions into higher-level "scenes" - Somewhat subjective (no right answer)
Introduction of Chemical Reaction Engineering Introduction about Chemical Engineering 0:31:15 0:31:09. Lecture 14 Lecture 15 Lecture 16 Lecture 17 Lecture 18 Lecture 19 Lecture 20 Lecture 21 Lecture 22 Lecture 23 Lecture 24 Lecture 25 Lecture 26 Lecture 27 Lecture 28 Lecture
To search for animated graphics, use Google images, but look for ones that move or are animated. (These will usually be .gif files.) (There is a link on our website online for additional graphics. You will need to right click and save the picture to your picture folder.) Animated Sea Graphics Insert the Animated Graphics:
Lecture 1: A Beginner's Guide Lecture 2: Introduction to Programming Lecture 3: Introduction to C, structure of C programming Lecture 4: Elements of C Lecture 5: Variables, Statements, Expressions Lecture 6: Input-Output in C Lecture 7: Formatted Input-Output Lecture 8: Operators Lecture 9: Operators continued
Wisconsin Arrowhead Union High School District Wisconsin School District of eloit‡ Wisconsin D C Everest School District Wisconsin Diocese of Green Bay Wisconsin Green Bay Area Public School District Wisconsin Greendale School District Wisconsin Hamilton School District
Animated transitions are used to convey state changes and engage viewers. We focus on animated transitions between statistical graphics, with the goal of accurately conveying changes, directing attention, and helping viewers stay oriented. 2.1 Animated Transitions Animation is a common method for conveying changes between visual-ization states.
Lecture 1: Introduction and Orientation. Lecture 2: Overview of Electronic Materials . Lecture 3: Free electron Fermi gas . Lecture 4: Energy bands . Lecture 5: Carrier Concentration in Semiconductors . Lecture 6: Shallow dopants and Deep -level traps . Lecture 7: Silicon Materials . Lecture 8: Oxidation. Lecture
TOEFL Listening Lecture 35 184 TOEFL Listening Lecture 36 189 TOEFL Listening Lecture 37 194 TOEFL Listening Lecture 38 199 TOEFL Listening Lecture 39 204 TOEFL Listening Lecture 40 209 TOEFL Listening Lecture 41 214 TOEFL Listening Lecture 42 219 TOEFL Listening Lecture 43 225 COPYRIGHT 2016
The most popular agile methodologies include: extreme programming (XP), Scrum, Crystal, Dynamic Sys-tems Development (DSDM), Lean Development, and Feature Driven Development (FDD). All Agile methods share a common vision and core values of the Agile Manifesto. Agile Methods: Some well-known agile software development methods include: Agile .
