Scientific Visualization

1. Thinking of Grad School??? If you’re thinking of studying Computer Science you will probably need to take the GRE. You can take a practice test Saturday February 18, 2006 in the Highsmith Union and will begin promptly at 10:00 am. Because space is limited, register early at 1-800-KAP-TEST or online at www.kaptest.com. Scientific Visualization February 1, 2006 Courtesy of the Career Center Open internship – Curt Manns URTV will be Asheville`s first public access television station. URTV, Inc., a nonprofit organization, is currently preparing to launch Channel 20Looking for interns in production, marketing, business and IT. Part time E. Ennalls Berl II is trying to find a highly competent and reliable person to complete his web site. The site is for a service to Senior Citizens business.

2. Agenda • Quiz • Review Homework - due tonight • Your animatic. • Class comments • What artwork do you need? • Class Material (keyframe animation, using an external library, principles of animation) • Next week’s assignment

3. Using External Libraries in Flash • Create a new Flash file. • File / New • Set document properties so that the stage size is 706x566 pixels. • Modify / Document • Set the background to some color other than white (so the clouds show). • Use library from shared.fla found in the directoryhttp://www.cs.unca.edu/~reiser/sv/project1/Flash1-31-06/ • File / Import / Open External Library

4. Tweening • In flash tweening refers to generating inbetween frames between keyframes. • Motion tweens refer to the animation needed to show moving (translating) a symbol from one location to another. • Strangely enough a motion tween can also include scaling (resizing) and rotation. • Throughout the remainder of this class (and in 2D and 3D graphics packages) we will continue to refer to the standard transformations of translation, scaling and rotation.

5. Create a Motion Tween • Open Flash • Create a square on the stage. • Select the square. • Modify / Convert to Symbol • Name the symbol square and make it a movie. • Select the square on stage and make sure it is an instance of square. Name the instance mySquare. • Select keyframe 30 in the Timeline. • Insert / Timeline / Keyframe

6. Motion Tween (2) • (With frame 30 still selected,) move the instance of mySquare to a different location on the Stage. • Select a frame between the keyframes in Frame 1 and Frame 30. • In the property inspector, select Tween and from the drop down menu, select Motion Tween.

7. Motion Tween (3) • Save • Control / Test Movie - your square should move across the stage. • From the property inspector add a rotate by selecting a direction like CW and 1 for 1 full rotation. • From the menu at the bottom of the timeline select onion skinning (the 2nd icon to the right of the trash) to verify that your square is rotating one full rotation.

8. Shape Tween • Generates in-between frames between different shapes (not symbol instances) • Using symbols encourages reuse so use symbols, then Modify / Break Apart the instances. • Once you have the broken apart graphics in your beginning and ending frames. Create a shape tween between the two.

9. John Lasseter1987PRINCIPLES OF TRADITIONAL ANIMATIONAPPLIED TO 3D COMPUTER ANIMATION

10. Introduction • Three Little Pigs • Academy Award Winner • Oscar for “Who’s afraid of the Big Bad Wolfe?”

11. Principles of Animation - Introduction • 1920s and 1930s animation was popular. • Disney noticed no lifelike movement for animal or human figure. • Disney established drawing classes at Chouinard art in LA. • From these classes the following principles were established.

12. Principles of Animation • Squash and stretch -- defining the rigidity and mass of an object by distorting its shape during an action. • Timing -- spacing actions to define the weight and size of objects and the personality of characters. • Anticipation -- preparation for an action. • Staging -- Presenting an idea so that it is unmistakably clear.

13. Principles of Animation • Follow through and overlapping action -- the termination of an action and establishing its relationship to the next action. • Straight ahead action and pose-to-pose action -- the two contrasting approaches to the creation of movement. • Slow in and out -- the spacing of the in-between frames to achieve subtlety of timing and movement. • Arcs -- the visual path of action for natural movement.

14. Principles of Animation • Exaggeration -- accentuating the essence of an idea via the design and the action. • Secondary action -- the action of an object resulting from another action, • Appeal - creating a design or an action that the audience enjoys watching.

15. SQUASH AND STRETCH

16. SQUASH AND STRETCH

17. SQUASH AND STRETCH

18. SQUASH AND STRETCH

19. SQUASH AND STRETCH

20. TIMING • NO inbetweens ........... The Character has been hit by a tremendous force. His head is nearly snapped off. • ONE inbetweens ......... The Character has been hit by a brick, rolling pin, frying pan. • TWO inbetweens ......... The Character has a nervous tic, a muscle spasm, an uncontrollable twitch. • THREE inbetweens ..... The Character is dodging a brick, rolling pin, frying pan.

21. TIMING • FOUR inbetweens ........... The Character is giving a crisp order, "Get going!" "Move it!" • FIVE inbetweens ........... The Character is more friendly, "Over here.""Come on-hurry!" • SIX inbetweens ........... The Character sees a good looking girl, or the sports car he has always wanted. • SEVEN inbetweens ........... The Character tries to get a better look at something.

22. TIMING • EIGHT inbetweens ........... The Charaeter searches for the peanut butter on the kitchen shelf. • NINE inbetweens ........... The Character appraises, considering thoughtfully. • TEN inbetweens ........... The Character stretches a sore muscle.

23. ANTICIPATION

24. ANTICIPATION

25. ANTICIPATION

26. STAGING • In Luxo, Jr. all action was staged to the side for clarity.

27. STAGING • Andre’s scratch was staged to the side for clarity.

28. FOLLOW THROUGH • Follow through of Wally B’s feet.

29. OVERLAPPING ACTION • Overlapping action of Wally B’s feet.

30. Walt Disney Definition of Overlapping Action It is not necessary for an animator to take a character to one point, complete that action completely, and then turn to the following action as if he had never given it a thought until after completing the first action. When a character knows what his is going to do he doesn't have to stop before each individual action and think to do it. He has planned in advance in his mind.

31. Walt Disney Example of Overlapping Action The mind thinks, "I'll close the door - lock it - then I'm going to undress and go to bed." • Well, you walk over to the door • before the walk is finished you're reaching for the door before the door is closed you reach for the key • before the door is locked you're turning away - while you're walking away you undo your tie • and before you reach the bureau you have your tie off. In other words, before you know it you're undressed - and you've done it in one thought, "I'm going to bed."

32. STRAIGHT AHEAD ACTION OR POSE-TO-POSE • Pose to pose (Keyframes). • Animator creates keyframes. • Straight ahead. • Characterized by zany action. • Animator makes one drawing after another.

33. SLOW IN AND OUT • The spacing of the inbetween drawings between the extreme poses.

34. SLOW IN AND OUT

35. ARCS

36. EXAGGERATION

37. EXAGGERATION

38. SECONDARY ACTION

39. APPEAL

40. APPEAL

41. PERSONALITY • “When character animation is successful and the audience is thoroughly entertained, it is because the characters and the story have become more important and apparent than the technique that went into the animation.” • “…the success of character animation lies in the personality of the characters.”

42. CONCLUSION • “… the first goal of the animator is to entertain.” • The animator must have two things: • a clear concept of exactly what will entertain the audience; • and the tools and skills to put those ideas across clearly and unambiguously

45. More Cartograms • http://www-personal.umich.edu/~mejn/election/

46. Homework • Read chapters 5 & 6 in Tufte. • Using your animatic as a starting point, create a 20 second animation of your module. Incorporate the feedback from tonight’s class into the animation. • Use the external library from WhatIsHaze? • Post on the mmas server

47. Homework • Class Work • Meet as a group. • Divide up the new artwork production. • Figure out a plan for the week. • How will you distribute new artwork to the members of your group? • Will you need to meet as a group or will email communication suffice?

48. Homework • Homework • Individual homework assignment due next week: create first draft animations. • Publish the flash file in HTML and SWF. • File / Publish Settings • Select the Formats tab. Check Flash and set the file name to the exact name required by your module which can be found as the link in http://www.cs.unca.edu/~reiser/sv/project1/draft1.htm or in the Jim Fox’s haze cast storyboard which is linked from http://www.cs.unca.edu/~reiser/sv/project1. • Select Publish. • Sftp the SWF file to your Sites directory (folder) on the mmas server. • Test your link at http://www.cs.unca.edu/~reiser/sv/project1/draft1.htm.

49. Module Names • "WhatIsHaze1Overview.swf"; • "whatIsHaze2CloserLook.swf"; • “WhatIsHaze3Cough.swf"; • "whatIsHaze4AcidRain.swf"; • "WhatCausesHaze1MobileStationary.swf"; • "WhatCausesHaze2Components.swf"; • "WhatCausesHaze3Details.swf"; • "WhatCausesHaze4WeatherImpact.swf";

50. Module Names • "WhatCausesHaze5NationalVariations.swf"; • "WhatCausesHaze6Inversions.swf"; • "HowMeasureHaze1Overview.swf"; • "HowMeasureHaze2Instruments.swf"; • "HowMeasureHaze3Visual.swf"; • "WhatHazeForecast1AQIOverview.swf"; • "WhatHazeForecast2AQIMap.swf"; • "WhatHazeForecast3Calculate.swf";