If you're seeing this message, it means we're having trouble loading external resources on our website.

If you're behind a web filter, please make sure that the domains *.kastatic.org and *.kasandbox.org are unblocked.

Main content

4. Commutativity

We need to be careful with the order of scaling and translation. But why? First, we move an object 5 steps to the right and 3 steps up. Then, we make the object twice as big. But, if we first make the object big and then move it, we end up in a different place! This means the order of doing things matters. When the order doesn't matter, we call it "commutative". When the order does matter, we call it "non-commutative"..

Want to join the conversation?

  • orange juice squid orange style avatar for user ⊷נαςк ρ⊶
    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)
    Default Khan Academy avatar avatar for user
    • leafers sapling style avatar for user Peter Collingridge
      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).
      (15 votes)
  • piceratops ultimate style avatar for user trek
    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)
    Default Khan Academy avatar avatar for user
    • leafers sapling style avatar for user Peter Collingridge
      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.
      (6 votes)
  • hopper cool style avatar for user wublablu
    i dont understand
    (2 votes)
    Default Khan Academy avatar avatar for user
    • aqualine ultimate style avatar for user Cosmo The Sender
      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.
      (4 votes)
  • blobby green style avatar for user ccanedo6526
    So than i said, "That's not a camel, that's my wife!"
    (3 votes)
    Default Khan Academy avatar avatar for user
  • female robot amelia style avatar for user elijlark9625
    so if i put them in a different order does that matter
    (2 votes)
    Default Khan Academy avatar avatar for user
  • blobby green style avatar for user Chris.Poole777
    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)
    Default Khan Academy avatar avatar for user
  • blobby green style avatar for user viviannsmith1
    so when she says the order does she mean pemdas?
    (2 votes)
    Default Khan Academy avatar avatar for user
  • blobby green style avatar for user Rassi Levine
    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)
    Default Khan Academy avatar avatar for user
  • piceratops ultimate style avatar for user Duy Troung Nguyen
    does anyone know the math formula to find the position of the object after it scale?
    (1 vote)
    Default Khan Academy avatar avatar for user
  • duskpin sapling style avatar for user ambrown24
    Question, wouldn't you get the same result when you scale because your just sizing one before moving it and vise versa.
    (1 vote)
    Default Khan Academy avatar avatar for user

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.