Main content
Pixar in a Box
Course: Pixar in a Box > Unit 14
Lesson 1: Geometric transformations- Start here!
- Introduction to geometric transformations
- 1. Coordinate plane
- Graph points
- 2. Translation
- Laying out a scene using translation
- 3. Scaling
- Scaling items in a scene
- 4. Commutativity
- Commutative and non-commutative transformations
- 5. Rotation
- Finish your scene!
- 6. Composite transformations
- Composite transformations
- Getting to know Fran Kalal
© 2023 Khan AcademyTerms of usePrivacy PolicyCookie Notice
4. Commutativity
We need to be careful with the order of scaling and translation. But why?
Want to join the conversation?
According to Fran, the correct order in which you are supposed to transform without muddling things up is: Scale, Rotate, Translate. Correct? But in computer programming it works better in this order: Translate, Rotate, Scale. Why is this? Does it have to do with the fact that in computer programming, the translate function actually translates the Origin? Or am I misunderstanding something?(18 votes)
Yes, it is horribly confusing, especially if you want to write a program in processing.js to explain the process in the video. You're right about the reason for the difference. In the CS environment, transformations work on the entire canvas, changing the coordinate system, whereas in the video and programs here, transformations work on individual elements (which I think is more intuitive).(14 votes)
Modeling scaling is a vector/matrix operation here, then? That would explain the non-commutative behavior. Also, the objects are anchored at a corner instead of on center? That would also make the operations non-commutative, I think.(2 votes)- Scaling can be done by multiplying by the matrix:
sx 0
0 sy
Or more often, if you want to translate, and so have a 3x3 matrix:sx 0 0
0 sy 0
0 0 1
Scaling will always be non-commutative with translation. Imagine a point at (0, 0). Scaling by whatever value you like and it will stay and (0, 0). Then translate it by (x, y) and it will be at (x, y). If you translate it by (x, y), then scale it by (s, s), it will be at (sx, sy). (You can also compare multiplying the scaling matrix with the translate matrix in a different order).
If you go to one of the interactives in this tutorial, you can turn on the initial image to keep it a version anchored at (0, 0). Then you can click on that to select a point on it and follow how that point is transformed in the equations.(5 votes)
i dont understand(1 vote)
start by translating this object by five in X and three in Y, and then scale by a factor of two. But what if I change the order and do scaling before translation? In this case, I'll scale by a factor of two, and then translate by five in X and three in Y. Huh. I get a different result. ^ That means the order of operations matters ^ when we combine scaling and translation. Let's try applying two different translations. The first by, say, hmm, five in X and three in Y. And the second by, say, two in X and four in Y. And if I do these in the opposite order, I get the same result. ^ So apparently, order doesn't matter ^ when combining two translations. When order doesn't matter, mathematicians say that the operations are commutative. (magical chiming) When order does matter, mathematicians say the operations are (magical chiming) non-commutative. Translations commute with each other because addition is commutative. ^ But scaling and translation don't commute. ^ We'll study commutativity in more detail a little later. In the meantime, use the next exercise to get some practice with this concept.(3 votes)
so if i put them in a different order does that matter(2 votes)
It explains in the video that scaling can go with scaling but not with translation.
Like with positive and negative!(1 vote)
The video is confusing, because at 27 seconds, when we "scale by a factor of 2", the bottom LHS of the square containing the ball suddenly moves from (5,3) to (10, 6). Not only is the ball scaled, but the translating vector is scaled as well. This is not made clear in the video.(2 votes)
They are both being doubled.(1 vote)
- Do you know of a site that i can practice everything i learned from pixar in a box? A site that i can actually create a movie? thank you!(1 vote)
- does anyone know the math formula to find the position of the object after it scale?(1 vote)
- so when she says the order does she mean pemdas?(1 vote)
- So than i said, "That's not a camel, that's my wife!"(1 vote)
Question, wouldn't you get the same result when you scale because your just sizing one before moving it and vise versa.(1 vote)
Video transcript
(springing noises) - We're a good way towards building a shot that matches the sketch we got from the story department. But before we continue, let's pause for a moment to explore an interesting issue that comes up when combining operations. In the last exercise, you used the two operations of scaling and translation to position some objects. For example, suppose I start by translating this object by five in X and three in Y, and then scale by a factor of two. But what if I change the order and do scaling before translation? In this case, I'll scale by a factor of two, and then translate by five in X and three in Y. Huh. I get a different result. ^ That means the order of operations matters ^ when we combine scaling and translation. Let's try applying two different translations. The first by, say, hmm, five in X and three in Y. And the second by, say, two in X and four in Y. And if I do these in the opposite order, I get the same result. ^ So apparently, order doesn't matter ^ when combining two translations. When order doesn't matter, mathematicians say that the operations are commutative. (magical chiming) When order does matter, mathematicians say the operations are (magical chiming) non-commutative. Translations commute with each other because addition is commutative. ^ But scaling and translation don't commute. ^ We'll study commutativity in more detail a little later. In the meantime, use the next exercise to get some practice with this concept.