computer graphics - cauprof.cau.ac.kr/~kjpark/courses/2009_1_cg/lec04.pdf · 2009-03-23 ·...

37
Computer Graphics Kyoungju Park [email protected] http://graphics.cau.ac.kr Ch.6 of Shirley

Upload: others

Post on 07-May-2020

6 views

Category:

Documents


0 download

TRANSCRIPT

Page 1: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Computer Graphics

Kyoungju [email protected]

http://graphics.cau.ac.krCh.6 of Shirley

Page 2: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

ScheduleSchedule

week date contents

1st wk 03.02 What is computer graphics? Modeling, animation, rendering

2nd wk 03.09 Modeling & Rendering: 기본도형 드로잉, 칼라

3rd wk 03.16 컴퓨터 그래픽스를 위한 기초

4th wk 03.23 Animation: Motion graphic

5th wk 03.30 Animation: Motion graphic

6th wk 04.06 Animation: 물리기반 시뮬레이션(파티클 시스템)

7th wk 04.13 Animation: 물리기반 시뮬레이션(파티클 시스템)

8th wk 04.20 중간고사

9th wk 04.27 Modeling: Shapes(커브)

h k d l h 반 패턴10th wk 05.04 Modeling: Shapes(반복 패턴)

11th wk 05.11 Modeling: Typography

12th wk 05.18 상호작용(마우스, 태블릿)

13th k 05 25 R d i 이미지 소스 이용 T t M i Filt i13th wk 05.25 Rendering: 이미지 소스 이용 Texture Mapping, Filtering

14th wk 06.01 Rendering: 3D scene 환경 맵

15th wk 06.08 3D 작업

16th wk 06 15 기말고사16th wk 06.15 기말고사

Page 3: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

TopicsTopics

• TransformationsTransformations

– Translation

R t ti– Rotation

– Scaling

• 애니메이션 법칙애니메이션 법칙– Speed control

E i– Ease-in ease-out

Page 4: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Uses of TransformationsUses of Transformations• Modeling

– Build complex models by positioning simple componentsT f f bj t di t t ld di t– Transform from object coordinates to world coordinates

• Viewing– Placing the virtual camera in the world– Specifying transformation from world coordinates to

camera coordinates

• Animation– Vary transformations over time to create motion

Page 5: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Rigid Body TransformationsRigid Body Transformations

Rotation angle and line about which to rotateabout which to rotate

Page 6: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Non-rigid Body TransformationsNon rigid Body Transformations

Distance between points on object do not remain constant

Page 7: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Basic 2D TransformationsBasic 2D Transformations

• ScaleScale

• Shear

• Rotate

Page 8: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Composition of TransformationsComposition of Transformations

Cr t d b tri gi g b i t g th r g• Created by stringing basic ones together, e.g.– “translate p to the origin, rotate, then translate back”can also be described as a rotation about p

• Any sequence of linear transformations can be collapsed into a single matrix formed by multiplying the individual matrices together

• Order matters!• Can apply a whole sequence of transformations at once

• Translate to the origin, rotate, then translate back

Page 9: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

3D Transformations3D Transformations

3 D tr f r ti r r i il r t th 2 D• 3-D transformations are very similar to the 2-D case• Scale• Shear• Rotation is a bit more complicated in 3-D

– Different rotation axes

Page 10: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Euler Angles for 3-D R t tiRotations

Page 11: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Homogeneous 2D TransformationsHomogeneous 2D Transformations

Th b i 2D t f ti b• The basic 2D transformations become

Translation: Scale: Rotate:

Now any sequence of translate/scale/rotate operations can be combined into a single homogeneous matrix by multiplication

3D transforms are modified similarly

Page 12: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Rigid Body TransformationsRigid Body Transformations

Rotation angle and lineabout which to rotate

Page 13: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Rigid Body TransformationsRigid Body Transformations

A t f ti t i f th f• A transformation matrix of the form

where the upper 2x2 submatrix is a rotation matrix d l 3 i t l ti t i i idand column 3 is a translation vector, is a rigid

body transformation

• Any series of rotations and translations result in a rotation and translation of this form (and no change in the distance between vertices)no change in the distance between vertices)

Page 14: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Affine Geometry.pdf

Page 15: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Sequences of TransformationsSequences of Transformations

• Often the sametransformations areapplied to many pointsapplied to many points

• Calculation time forthe matrices andthe matrices andcombination isnegligible compared tothat of transformingthat of transformingthe points

• Reduce the sequence to• Reduce the sequence toa single matrix, thentransform

Page 16: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Collapsing a Chain of M t iMatrices

C id th it f ti ABCD i ’• Consider the composite function ABCD, i.e. p’ = ABCDp

• Matrix multiplication isn’t commutative – theMatrix multiplication isn t commutative the order is important

• But matrix multiplication is associative, so can calculate from right to left or left to right:calculate from right to left or left to right: ABCD = (((AB) C) D) = (A (B (CD))).

• Iteratively replace either the leading or the y p gtrailing pair by its product

Page 17: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

ExamplesExamples

• Modeling with primitive shapesModeling with primitive shapes

pushMatrix()popMatrix()

translate()

Page 18: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Example: AnimationExample Animation

Setting up a scene and animatingSetting up a scene and animating

pushMatrix()M t i ()popMatrix()

translate()

FRAME 1 2 3 4 5 6 7FRAME 1 2 3 4 5 6 7

Page 19: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Example: AnimationExample Animation

Setting up a scene and animatingSetting up a scene and animating

rotate()

FRAME 1 2 3 4 5 6 7FRAME 1 2 3 4 5 6 7

Page 20: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Example: Viewing TransformationExample Viewing Transformation

After midterm…..

Page 21: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Question about rotating about bit ian arbitrary axis

Page 22: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Principles of AnimationPrinciples of Animation

• From Disney Animation: The Illusion of Life by Thomas Johnson, Ollie Johnson

• Open question: how to support these principles in computer tools?

• John Lasseter. Principles of traditionalJohn Lasseter. Principles of traditional animation applied to 3D computer animation. Proceedings of SIGGRAPH(Computer Graphics) 21(4):35-44, July 1987

Page 23: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Principles of AnimationPrinciples of Animation

• Squash and stretch

• Staging

• Timing

• Anticipation

• Follow through

O l i ti• Overlapping action

• Straight-ahead vs. pose-to-pose vs. blocking

• Arcs• Arcs

• Slow in, slow out

• Exaggeration• Exaggeration

• Appeal

Page 24: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

The flour sackThe flour sack

• Characters composed of• Characters composed of living flesh do not move rigidly

• Preservation of volume is keyy

• Disney animators demonstrate with a halfdemonstrate with a half filled bag of flour

Do we have computer-created animation that is as expressive as this?expressive as this?

Page 25: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Squash and stretchSquash and stretch

Squash: flatten an object or character by pressure or by its own power

Stretch: used to increase the sense of speed and emphasize the squash by contrast

Note: keep volume constant!

Weight is given using timing

Add squash/stretch to define the motion and show the speedp

Page 26: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i
Page 27: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i
Page 28: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Anticipation and StagingAnticipation and Staging

T ll th di• Tell the audience what you are doing b f d itbefore you do it

• Present the idea so it is unmistakably clear. Audience can only see one thing at a time. Useful guide: stage actions in silhouette

Page 29: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Straight Ahead and Pose to poseStraight Ahead and Pose to poseScene drawings 에 사용되는 두 가지 방법

• Straight Ahead Action

• Pose to Pose

D th k f

g

Action

– Start w/ an idea

D ll f

– Draw the key frames first

Fill in the in– Draw all frames until done

Good for frantic

– Fill in the in-betweens

– Good for frantic motion such as a character jumpingcharacter jumping around in excitement

Page 30: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Follow Through and Overlapping Action

• Everything should not have to stop at once when a pose is reached

• The way the actionThe way the action is completed

=> tell about a=> tell about a character

Page 31: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Slow in and Slow outSlow in and Slow out

• Animator specifies the primary or keyAnimator specifies the primary or key frames which are most important

I d t t th f• In order to stress these frames, move slowly away from one key frame, quickly in the in between frames, and slowly into the next framey

• Most time is spent on/near the key framesframes

Page 32: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

ArcsArcs

• Motion in straight lines is notMotion in straight lines is not organic

M t h ti h d• Most human motion happens on curved trajectories or arcs

Page 33: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

TimingTiming

• The number of drawings determine theThe number of drawings determine the amount of time it takes on the screen

No inbetweens: character hit with a huge– No inbetweens: character hit with a huge force and his head is nearly snapped off

T i l– Two : nervous tic, muscle spasm

– Five : Come on… hurry

– Seven: tries to get a better look at somethingsomething

– Ten: stretches a sore neck

Page 34: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

ExaggerationExaggeration

• Walt Disney wanted exaggeration withWalt Disney wanted exaggeration with believability

T hi li t “ i i ”• To him, realism meant “convincing” like real people are

• If the character was sad, make him sadder if he was tired make himsadder, if he was tired, make him more tired

Page 35: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Secondary ActionSecondary Action

• Action aside from that of the primary character

• Must not distract the audience

Page 36: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Speed ControlSpeed Control

• Simplest form is to have constantSimplest form is to have constant velocity along the path

x

tt

Page 37: Computer Graphics - CAUprof.cau.ac.kr/~kjpark/courses/2009_1_cg/Lec04.pdf · 2009-03-23 · Composition of TransformationsComposition of Transformations • Cr t d b tri gi g b i

Ease-in Ease-out curveEase in Ease out curve

• Assume that the motion slows down atAssume that the motion slows down at the beginning and end of the motion curvecurve

xx

tt