WEBVTT Kind: captions Language: en 00:00:00.260 --> 00:00:06.080 What they're really, of course, is some weird pan-dimensional trickery, because of course when... 00:00:06.200 --> 00:00:10.580 ... we're working in 3D we add a fourth dimension on to the vectors, 00:00:10.860 --> 00:00:17.160 ... and a fourth row/column on to the matrices and we're doing a sheer operation... 00:00:17.360 --> 00:00:23.260 ... in four dimensional space, which casts a shadow of its objects back into 3-dimensional space 00:00:23.440 --> 00:00:24.580 ... as a translation 00:00:26.220 --> 00:00:31.300 We chose in our description before that the origin was gonna be here, 00:00:31.300 --> 00:00:35.300 ...on the base of the pyramid. But, in theory, it could be anywhere in the universe. 00:00:36.420 --> 00:00:42.980 You could specify the vertices relative to Mars, or New York, or this point on the table over here... 00:00:43.240 --> 00:00:44.540 .. or the top of the pyramid, or the center, or whatever. 00:00:45.580 --> 00:00:49.760 The origin becomes almost like a center of gravity of the object 00:00:49.920 --> 00:00:56.100 ... because any transformations we do on the vertices, are done relative to the origin. 00:00:56.260 --> 00:01:00.040 Because they're done in the same coordinate space, 00:01:00.100 --> 00:01:04.260 ... the same frame of reference that the vertices are specified in. 00:01:04.380 --> 00:01:06.600 So, transformations... 00:01:06.600 --> 00:01:08.280 [off screen voice] So what's a transformation?... 00:01:08.280 --> 00:01:09.800 That's a good question. 00:01:09.980 --> 00:01:12.325 Yeah, we need to... We've specified our objects. 00:01:12.325 --> 00:01:14.280 We specified the vertices and the faces. 00:01:14.280 --> 00:01:24.000 The way we move objects around in 3D space, is by applying operations at the vertices, manipulating the vertices. 00:01:24.080 --> 00:01:30.120 Uh, using transformations. What is a transformation? 00:01:30.120 --> 00:01:32.020 Well there's three basics types of transformations 00:01:32.020 --> 00:01:36.660 ... that we'll cover ... There are others, but the three basic types are scaling, 00:01:36.660 --> 00:01:37.940 translation, and rotation. 00:01:38.020 --> 00:01:40.160 And we'll start with scaling, I suppose. 00:01:40.180 --> 00:01:44.260 So, let's draw a triangle. Let's keep it 2d for simplicity's sake. 00:01:44.360 --> 00:01:50.760 So, we want to scale our triangle. Everything that's applicable in 2 dimensions... 00:01:50.860 --> 00:01:55.180 ...will also work in 3 dimensions. Everything we're going to talk about will work in 3 dimensions. 00:01:55.380 --> 00:02:00.720 For now let's just work on scaling. We want to scale, let's say, vertically. 00:02:00.740 --> 00:02:03.540 So, the way we do that, we write out our coordinate. 00:02:03.560 --> 00:02:07.240 Let's just use, um, vertix A as an example. 00:02:07.240 --> 00:02:09.840 In mathematics, uh, these coordinates are called vectors. 00:02:09.880 --> 00:02:15.900 Vectors are just arrays of numbers, I mean, everyone is pretty familiar with vectors... 00:02:15.980 --> 00:02:19.160 I like to write them vertically, you can write them horizontally 00:02:19.160 --> 00:02:21.460 doesn't really matter, but I think it's probably more clear 00:02:21.460 --> 00:02:23.460 if we write it vertically 00:02:23.460 --> 00:02:27.080 to scale a vector, we just need to do a simple multiply operation 00:02:27.100 --> 00:02:29.540 so we want to scale vertically 00:02:29.540 --> 00:02:31.220 so, we don't want to scale an x 00:02:31.240 --> 00:02:32.840 so we'll keep that as one. 00:02:32.900 --> 00:02:35.780 What we do want to scale, is Y 00:02:35.780 --> 00:02:39.480 so we'll scale by 2 and to get the answer all we do is 00:02:39.480 --> 00:02:42.780 0 times 1 is 0, 1 times 2 is 2 00:02:42.780 --> 00:02:46.760 And the result, if this is our new coordinate A... 00:02:48.820 --> 00:02:50.620 it's up here. 00:02:50.620 --> 00:02:52.680 A equals (0, 2). 00:02:52.680 --> 00:02:55.960 Well if we apply that same transformation to our, um, 00:02:55.960 --> 00:03:00.140 two vertices that are on the x axis, we find that they're unchanged. 00:03:00.140 --> 00:03:06.020 Because, um, minus 1 times 1 is 1 -- there's minus one 00:03:06.020 --> 00:03:08.800 and 0 times 2 is still 0. 00:03:08.800 --> 00:03:12.160 So those vertices still lie on y=0 00:03:12.660 --> 00:03:16.120 Translation works exactly the same, 00:03:16.120 --> 00:03:18.660 however, instead of multiplying, we add. 00:03:18.660 --> 00:03:20.660 Here's our triangle that we started with 00:03:20.660 --> 00:03:22.480 So say we now want to translate it 00:03:22.480 --> 00:03:24.140 one unit this way. 00:03:24.140 --> 00:03:26.700 Well, let's take this coordinate as an example 00:03:26.700 --> 00:03:29.760 So, we have 1 in x and 0 in y 00:03:29.760 --> 00:03:32.140 plus, we want to move 1 unit in x 00:03:32.140 --> 00:03:35.320 so, plus 1 unit in x and 0 in y. 00:03:35.320 --> 00:03:37.940 Equals (2, 0). 00:03:37.940 --> 00:03:40.920 So, this point now lies over here. 00:03:40.920 --> 00:03:43.420 And if we do that to all the vertices of our shape 00:03:43.420 --> 00:03:45.740 We get this. 00:03:45.740 --> 00:03:47.920 So, we've had 00:03:48.860 --> 00:03:49.920 Scaling... 00:03:51.540 --> 00:03:52.720 and Translation. 00:03:52.720 --> 00:03:54.400 Both work very much the same. 00:03:54.400 --> 00:03:56.720 One's a multiplicative operation on a vector 00:03:58.500 --> 00:04:00.980 and the other is an additive operation. 00:04:00.980 --> 00:04:02.980 Rotation is slightly more complicated 00:04:02.980 --> 00:04:04.840 and involves trigonometry. 00:04:04.840 --> 00:04:06.920 So, I'll just write out the formulas. 00:04:06.920 --> 00:04:08.960 Trigonometry tells us that 00:04:08.960 --> 00:04:10.980 for any given angle, A, 00:04:10.980 --> 00:04:15.700 are points x, new x, and new y. 00:04:15.700 --> 00:04:17.580 Somewhat convoluted, but 00:04:17.580 --> 00:04:19.700 that's trigonometry, isn't it? 00:04:19.700 --> 00:04:22.100 Let's take our triangle again. 00:04:22.480 --> 00:04:24.840 So this is our x axis, this is our y axis. 00:04:24.840 --> 00:04:26.840 We have our vertices, as before. 00:04:26.840 --> 00:04:28.840 Let's take this point again, 00:04:28.840 --> 00:04:30.840 and we want to rotate it, 00:04:30.840 --> 00:04:33.180 by 90 degrees anti-clockwise. 00:04:33.180 --> 00:04:36.060 So, we'll follow our formula along here. 00:04:36.060 --> 00:04:38.620 So, our new x value 00:04:38.620 --> 00:04:40.500 is going to be 00:04:40.500 --> 00:04:43.480 the x value here, which is (1, 0)... 00:04:44.220 --> 00:04:51.540 [inaudible] 00:04:52.060 --> 00:04:54.020 Because y is 0, 00:04:54.020 --> 00:04:56.020 these cancel out. 00:05:00.870 --> 00:05:10.180 x equals 0, y equals 1. So our new coordinate is (0, 1) which is what we'd 00:05:10.180 --> 00:05:17.229 expect because we're rotating by 90 degrees. So that covers scale, translation 00:05:17.229 --> 00:05:22.810 ... and rotation and by applying these simple operations - maybe not so simple in 00:05:22.810 --> 00:05:27.940 the case of rotation we can move our object around by manipulating the 00:05:27.940 --> 00:05:31.930 vertices and we call these transformations now there's actually - if 00:05:31.930 --> 00:05:37.570 we go back to rotation - there's another way to write out this formula that will 00:05:37.570 --> 00:05:44.650 seem strange at first. But bear with me because the benefit of it will hopefully 00:05:44.650 --> 00:05:48.789 become clear. We can draw a little table I'll try and make it a bit smaller 00:05:48.789 --> 00:05:52.479 this time. This basically represents exactly the same information that we've 00:05:52.479 --> 00:05:55.960 got here but just in a slightly different format. What we do is we 00:05:55.960 --> 00:06:01.539 multiply our inputs down the columns and then sum across the rows to get the result 00:06:01.539 --> 00:06:07.060 So if we just take our example that we had before of coordinate (1, 0) 00:06:07.060 --> 00:06:14.530 wasn't it? So our x = 1 and y = 0. So let's write our inputs in the 00:06:14.530 --> 00:06:18.080 top here. 1 times, 0 times. 00:06:19.320 --> 00:06:23.660 And the cosine of 90, which we want here, is 0. 00:06:24.080 --> 00:06:29.340 And also the cosine of 90 for this part here is 0. 00:06:29.340 --> 00:06:32.340 Minus sine 90 is -1 and sine 90 is 1 00:06:32.640 --> 00:06:37.800 So what did I say before? We multiply down the columns, and then ... 00:06:38.000 --> 00:06:43.380 ... we sum across the rows. So 1 x 0 = 0 and 1 x 1 = 1 00:06:43.780 --> 00:06:50.710 0 x -1 = 0 and 0 x 0 = 0. So then we sum across the rows to get ... 00:06:50.710 --> 00:06:55.540 ... new x and new y. 0 + 0 = 0 1 + 0 = 1 00:06:55.540 --> 00:06:58.240 ... which is the answer we got before. 00:06:58.380 --> 00:07:03.800 This representation of these formulae here... 00:07:03.840 --> 00:07:07.480 ... is in mathematical terms called a matrix. 00:07:07.720 --> 00:07:13.580 Matrices are very important and useful objects when it comes to manipulating vectors. 00:07:13.780 --> 00:07:19.340 So let's just for clarity write out the rules for multiplying a vector by a matrix. 00:07:19.340 --> 00:07:23.660 So that sums up exactly what we were doing in the table here. 00:07:23.660 --> 00:07:27.860 We're multiplying down the columns and we're summing across the rows. 00:07:27.860 --> 00:07:31.780 So we've been able to represent rotation using a matrix format. 00:07:31.780 --> 00:07:38.558 Let's now go on and see if we can represent scale in the same way. 00:07:38.558 --> 00:07:43.980 So using our rules from before we can take a vector, say (1, 1)... 00:07:43.980 --> 00:07:47.460 ...and the scale matrix. 00:07:47.460 --> 00:07:52.220 So what we want to do is scale, let's say in the y direction. 00:07:52.220 --> 00:07:57.237 So we want to stay the same in x and multiply by 2 in y... 00:07:57.237 --> 00:07:59.478 ... and then put zeros here. 00:07:59.478 --> 00:08:03.582 So following our rules for vector matrix multiplication, 00:08:03.582 --> 00:08:06.660 we can see that the new x component is.... 00:08:06.660 --> 00:08:11.980 (1 x 1) + (1 x 0) = 1 00:08:11.980 --> 00:08:16.720 (1 x 0) + (1 x 2)= 2 Is that the same answer that we were getting before? 00:08:16.720 --> 00:08:21.160 Let's just try our old-fashioned 'vector x vector' multiplication to do a scale. 00:08:21.740 --> 00:08:25.420 [mumbling vectors] 00:08:25.420 --> 00:08:27.480 1 x 1 = 1 1 x 2 = 2 00:08:27.540 --> 00:08:29.680 it's the same! 00:08:29.680 --> 00:08:33.460 It's probably a good idea to explain why we would do it this silly... 00:08:33.460 --> 00:08:35.180 ... convoluted way. 00:08:35.360 --> 00:08:39.680 Why would we take something that was very simple before, just adding and multiplying vectors 00:08:39.680 --> 00:08:44.660 And then re-representing them in this strange format. 00:08:44.660 --> 00:08:48.880 In going through these complicated rules of addition and 00:08:48.880 --> 00:08:52.740 multiplication to get the same answer. 00:08:52.740 --> 00:08:57.523 We have to apply these transformations on every single vertex... 00:08:57.523 --> 00:09:04.839 ... In order to move these 3D objects around in 3D space. That's really what we're trying to achieve. 00:09:04.840 --> 00:09:09.940 So with the simple operations it's fine but we have to apply them all separately, 00:09:09.940 --> 00:09:11.420 ... one after the other. 00:09:11.420 --> 00:09:14.320 And that's okay for a five vertex pyramid, 00:09:15.060 --> 00:09:19.120 ... but if you've got a hundred thousand vertices it quickly becomes quite costly. 00:09:19.320 --> 00:09:22.760 And the more transformations that you have to apply at every single vertex 00:09:23.460 --> 00:09:26.520 the more costly it becomes. 00:09:26.880 --> 00:09:30.626 And this is where the power of the matrix lies. 00:09:30.626 --> 00:09:35.900 This format allows us to actually multiply together two matrices. 00:09:35.900 --> 00:09:42.180 And by multiplying together two matrices we get a third matrix, which represents... 00:09:42.180 --> 00:09:50.300 the two transformations that were encoded in the original two matrices. 00:09:50.300 --> 00:09:53.760 What we can do is concatenate and combine transformation after transformation, 00:09:53.760 --> 00:09:59.980 simply by multiplying matrices together. And we can do that to compute a single 00:09:59.980 --> 00:10:03.360 transformation matrix, which we then apply to every single vertex. 00:10:03.360 --> 00:10:08.200 So we don't have to do transformation after transformation after transformation, 00:10:08.200 --> 00:10:12.380 we can just do one operation: a matrix vector multiply at every vertex. 00:10:12.380 --> 00:10:21.140 Let's have a quick look at the rules for (matrix x matrix) multiplication 00:10:21.140 --> 00:10:24.940 ... and if Sean has any sense he'll cut this bit out because it's really dull. 00:10:26.400 --> 00:10:30.100 We've represented scale, we've represented rotation in matrix form. 00:10:30.400 --> 00:10:38.000 Now I said before: 'Can we do translation?' And the answer is 'yes', but it's difficult. 00:10:38.180 --> 00:10:40.880 Because of this multiplication everywhere there's nowhere that we can put our... 00:10:40.889 --> 00:10:45.660 ...translation vector because scale and rotation are multiplicative operations, 00:10:45.660 --> 00:10:49.800 whereas translation is an additive operation and we can't do simple adds: 00:10:49.800 --> 00:10:54.380 With the matrix' multiplication rules everything gets multiplied somewhere. 00:10:54.380 --> 00:10:58.180 What we really want to do is say something like this: 00:10:58.180 --> 00:11:01.940 We want to say that our new vector equals the old vector... 00:11:03.720 --> 00:11:07.600 ... times our transformation matrix... 00:11:07.600 --> 00:11:09.760 ... plus a translation. 00:11:09.760 --> 00:11:15.680 Ideally, what we'd want to do is move this translation into the matrix. 00:11:15.680 --> 00:11:19.120 But there's nowhere for us to put it because this is an additive operation an additive operation, 00:11:19.120 --> 00:11:21.180 ... and the matrix is for multiplies. 00:11:21.740 --> 00:11:23.880 The way we do it is by using a little trick. 00:11:25.160 --> 00:11:28.460 Instead of just having X and Y, 00:11:28.460 --> 00:11:33.400 ... we add an extra dimension onto our vectors. 00:11:33.840 --> 00:11:35.540 And we fill it with 1. 00:11:36.140 --> 00:11:40.940 We have to do something similar to the matrix in turn so that the rules can still be applied. 00:11:41.780 --> 00:11:44.447 So we go a, b... 00:11:44.447 --> 00:11:50.200 Oops! 00:11:50.200 --> 00:11:52.640 We then have to have c, d, e, f, 00:11:52.640 --> 00:11:53.960 0 0 1 00:11:53.960 --> 00:11:57.060 and we have to have then a special value at the bottom here. 00:11:57.060 --> 00:12:01.400 Let's just do the formula for X based on our previous rules, 00:12:01.400 --> 00:12:04.500 ... but with the extra rows and columns added on. 00:12:04.500 --> 00:12:19.100 So, yeah let's just follow along here. 00:12:19.100 --> 00:12:21.920 We've got xa + yb + (1 times C)... 00:12:21.920 --> 00:12:29.249 xd + ye + (1 times f) 00:12:29.249 --> 00:12:34.320 ... and then we've got 00:12:34.320 --> 00:12:40.129 (1 x 0) + (1 x 0)... 00:12:40.500 --> 00:12:42.900 ... + (1 x 1). 00:12:45.260 --> 00:12:53.260 What we're doing here is we're multiplying as we were doing before, but multiplying by one. 00:12:53.260 --> 00:12:56.940 So these values C and F remain the same, 00:12:56.940 --> 00:12:58.620 ...but they get added on to the previous result. 00:12:59.060 --> 00:13:03.360 So the net effect of what we've done is that found a tricky way... 00:13:03.780 --> 00:13:05.720 ... to be able to do addition inside the matrix. 00:13:06.640 --> 00:13:10.020 Which means that we can throw translation in there now. C and F can be our translation vector, 00:13:10.020 --> 00:13:16.240 ... and it will be multiplied by one and added to the results. 00:13:16.240 --> 00:13:20.480 It seems like a bit of a hack, a bit of a weird trick. 00:13:20.480 --> 00:13:24.100 But what we're really doing is moving... 00:13:24.100 --> 00:13:26.780 ...our simple 2D shape ... 00:13:27.140 --> 00:13:29.260 ... on its 2D plane... 00:13:29.640 --> 00:13:31.840 ... into the third dimension. 00:13:33.200 --> 00:13:37.220 So that it exists on a single plane in 3D space. 00:13:37.520 --> 00:13:41.140 And the special matrix with the extra row is doing... 00:13:42.260 --> 00:13:49.620 ... a three dimensional shear in 3d space but in the 2D space of the plane that looks like a translation. 00:13:50.600 --> 00:13:52.669 So we've seen how it kind of works mathematically, and... 00:13:52.669 --> 00:13:58.160 ... what we're really doing of course is some weird pan-dimensional trickery, 00:13:58.160 --> 00:14:03.260 ... because of course, we're when we're working in 3d we add a fourth dimension onto the vectors, 00:14:03.269 --> 00:14:08.940 ... and a fourth row and column onto the matrices and we're doing a shear operation 00:14:08.940 --> 00:14:14.790 ... in four dimensional space which casts the shadow of its objects ... 00:14:14.790 --> 00:14:18.840 ... back into three-dimensional space as a translation. 00:14:18.840 --> 00:14:22.680 It looks like a translation in 3d but really it's... 00:14:22.680 --> 00:14:24.680 ...mind-blowing 00:14:27.360 --> 00:14:32.949 no matter how you arrange the three vertices of triangle they will always 00:14:32.949 --> 00:14:39.569 lie on the same plane in space how not to store passwords emitted thank you 00:14:39.569 --> 00:14:45.369 because you you really shouldn't store passwords yourself if you can all avoid 00:14:45.369 --> 00:14:47.729 it