It is quite straightforward to deduce how a normal vector n must transform it is remain orthogon to tangent vectors x: 1. initially n is orthogonal to x: dot(x, n)=transpose(x)n = 0. 2. a dot product can be represented by a transpose: dot(x, n)=transpose(x)n. (this is where transpose comes into play.) 3. if vectors x transform with modelMatrix M, (x-->Mx) then by which matrix, call it A, must n transform (n-->An) so as to satisfy dot(Mx, An)=0? 4. Represent the last condition with transposes: dot(Mx, An)=transpose(x)transpose(M)An = 0. 5. Look at the matrix product sandwiched inbetween: transpose(M)A. It that were the Identity matrix then transpose(x)transpose(M)An = transpose(x)n =0 so the new normal An would be orthogonal as we wanted. 6.Therefore we demand A must be a matrix which satisfies transpose(M)A=I, in other words A must be the inverse of transpose(M): A =inverse(transpose(M) ). I though I shared this since I wondered about it myself.
Bit of a deep topic but I would love a video on shadows... :) Whether that's doing a shadow map or shadow volumes or whatever. A bit more involved than the topics so far since it involves a lot, but I haven't seen a great tutorial on it for webgl.
Thanks for this tutorial, how can I change the light color? I tried this fragColor = (vColor* lightColor * .4) + (vColor * vBrightness * .6); but it gave weird results
[This reply has been edited.] I answered this earlier but wasn't thinking when I wrote it. This is a more correct answer: For simple coloured lights, the calculation is usually just this: finalColor = ( (ambientColor * ambientPower) + (lightColor * brightness * lightPower) ) * baseColor; where: `baseColor` is however your object is textured `ambientColor` is the colour of the ambient light (often just white, but it doesn't have to be) `ambientPower` is how much you want ambient light to contribute (e.g. 0.4) `lightColor` is the colour of your light `brightness` is the value you calculated in your shader `lightPower` is how much you want the light to contribute (e.g. 0.8) The way to think of this is: all lighting effects are additive and can be summed to a single colour value. We then multiply that colour value by the colour of the base object. While learning, if you can, try using a photograph to texture your object, rather than a flat (and especially bright) set of discrete colors. Also, avoid using pure color lights (like pure red or pure blue). Your brain won't accept how some colours mix at first. You've probably never seen a pure red object lit with a pure green light, so this shouldn't be super surprising. Once you've got something that looks natural, then replace it with the colours you like -- even unnatural ones. It will still look weird, but you can be more confident that it's correct.
![Seungmin "그렇게, 천천히, 우리(As we are)" | [Stray Kids : SKZ-PLAYER]](http://i.ytimg.com/vi/kAzmhLHePqU/mqdefault.jpg)
Best explanation of normals I ever found, finally I understand, thank you so much 👍
great video man....fetching ico is great
Simply amazing. I knew how to do this but the details you gave filled in so many gaps for me. Can't wait for the rest of what you have to share.
It is quite straightforward to deduce how a normal vector n must transform it is remain orthogon to tangent vectors x:
1. initially n is orthogonal to x: dot(x, n)=transpose(x)n = 0.
2. a dot product can be represented by a transpose: dot(x, n)=transpose(x)n. (this is where transpose comes into play.)
3. if vectors x transform with modelMatrix M, (x-->Mx) then by which matrix, call it A, must n transform (n-->An) so as to satisfy dot(Mx, An)=0?
4. Represent the last condition with transposes: dot(Mx, An)=transpose(x)transpose(M)An = 0.
5. Look at the matrix product sandwiched inbetween: transpose(M)A. It that were the Identity matrix then transpose(x)transpose(M)An = transpose(x)n =0 so the new normal An would be orthogonal as we wanted.
6.Therefore we demand A must be a matrix which satisfies transpose(M)A=I, in other words A must be the inverse of transpose(M): A =inverse(transpose(M) ).
I though I shared this since I wondered about it myself.
My arraybuffer‘s length of the icosphere.PNT.bin file is only 162, but in the video is should be 7680,does anybody have the same issue?
Bit of a deep topic but I would love a video on shadows... :) Whether that's doing a shadow map or shadow volumes or whatever. A bit more involved than the topics so far since it involves a lot, but I haven't seen a great tutorial on it for webgl.
you are a beast
Thanks for this tutorial, how can I change the light color? I tried this fragColor = (vColor* lightColor * .4) + (vColor * vBrightness * .6); but it gave weird results
[This reply has been edited.] I answered this earlier but wasn't thinking when I wrote it. This is a more correct answer:
For simple coloured lights, the calculation is usually just this:
finalColor = (
(ambientColor * ambientPower) +
(lightColor * brightness * lightPower)
) * baseColor;
where:
`baseColor` is however your object is textured
`ambientColor` is the colour of the ambient light (often just white, but it doesn't have to be)
`ambientPower` is how much you want ambient light to contribute (e.g. 0.4)
`lightColor` is the colour of your light
`brightness` is the value you calculated in your shader
`lightPower` is how much you want the light to contribute (e.g. 0.8)
The way to think of this is: all lighting effects are additive and can be summed to a single colour value. We then multiply that colour value by the colour of the base object.
While learning, if you can, try using a photograph to texture your object, rather than a flat (and especially bright) set of discrete colors. Also, avoid using pure color lights (like pure red or pure blue). Your brain won't accept how some colours mix at first. You've probably never seen a pure red object lit with a pure green light, so this shouldn't be super surprising. Once you've got something that looks natural, then replace it with the colours you like -- even unnatural ones. It will still look weird, but you can be more confident that it's correct.
Arras. I screwed up my reply to you. I will edit it. Sorry.