Mini Tutorial: Normal Maps and How Not to Do Them

[Morton]

Thank you I use to make normal maps the wrong way all the time. this helps out alot

[Machaca8]

Does anyone else run into the problem of the normal map not seemingly aligned with the diffuse when applied to the model? Basically, I run my normal map through the plugin and then I apply it, it doesn't look as "smooth" or "crisp" as everyone else's. Yet, if I make a bump map from the same image, it's aligned fine. Any suggestions?

Bump:


Diffuse:


Normal:


(p.s. I know the normal map was created the "wrong" way, but it still doesn't explain the misalignment issue I keep having regardless of the way I created the normal map)

[sampson]

yes i get that problem exactly a few times dunno what it is.

[Machaca8]

Arg, it's beyond frustrating sometimes. It's hard to tell if my normals are any good when they won't align, ya know?

[Talon]

I think what you're getting at is that the details in your normal map are larger than the details in your diffuse? Whereas a bump map is exactly right.

This is because where a 1-pixel-wide groove is just a black line on a bump map, when it gets converted to a normal map it needs to record the angle of both sides of the groove as they sink inwards. So it needs to be at least two pixels wide (one pixel to record the \ angle of one side and another to record the other side's / angle) and maybe another pixel to record the flat base inside the groove.

It can be a bit of a problem, but one you need to live with, really. It's just a limitation of using height-map generated normal maps. You should find that if you bake it from a high poly model, you'll get cleaner, more refined results.

[Machaca8]

Originally Posted by Talon

I think what you're getting at is that the details in your normal map are larger than the details in your diffuse? Whereas a bump map is exactly right.

This is because where a 1-pixel-wide groove is just a black line on a bump map, when it gets converted to a normal map it needs to record the angle of both sides of the groove as they sink inwards. So it needs to be at least two pixels wide (one pixel to record the \ angle of one side and another to record the other side's / angle) and maybe another pixel to record the flat base inside the groove.

It can be a bit of a problem, but one you need to live with, really. It's just a limitation of using height-map generated normal maps. You should find that if you bake it from a high poly model, you'll get cleaner, more refined results.

Thanks for the response. I'm trying to look, but I can't find anything that's too clear. Do you have any handy "How to bake normals from a high poly" tutorials/links? And, for example, the usually low-poly speed modeling objects, how does one create a high-poly from models like that? I think my brain's trying to make things more difficult than they really are, so any help or pointing in the right direction is an awesome and much appreciated help!

[Machaca8]

Ah, nevermind. Stumbled upon Ben Cloward's website again. God, he's an amazing resource.

[lillarosin]

Thanks for a great and easy to understand mini-tutorial!

I have a question though. I've tried to hand-paint such a height map as in your first example (the wall) and generating a normal map with the Nvidia's plugin in Photoshop. Following your example with the thingy that sticks out in the middle bottom of the wall, I've filled a solid circle with white on a mid-grey background. But the normal map always result in a framed effect rather than something beveling out completely. It becomes a sharp framing circle effect rather than a solid form that bevels out. Is this dependent on the gradient perhaps? I've tried to create a feathered circle (with a gradient) which gets me closer, but it gets too weak to properly see. Increasing the scale in the plugin causes an ugly scratchy look and setting the bump map amount in 3ds max it still gets too weak.

Any idea what I'm doing wrong?

On the other hand, I see that you use sharp lines which results in nice bevels - but when I do it (using pencil tool or marquee tool without feathering or antialiasing) I get an extra bevel! This "render" could help explain it:

This normal map is generated from a white square on a mid-grey background, but the image displays two edges. By the way, this image also illustrates my previous question, the framing effect. My guess is a resolution issue, but I use resolution sizes at 1024x1024 and up, just as in the speed texturing challenges here at this forum. Any ideas what is causing this?

So since all my normal maps results in very messy bevels I've actually come close to quit using them at all. Or maybe learn the method of modeling high poly and bake a normal map to apply on a low poly model (I'm fairly new to 3D). Still, it would be nice to paint normal maps in Photoshop like you did to make the models more detailed. I'm also following the speed texturing challenges here with great interest, and am impressed how people can create depth on a simple plane with a normal map. Any help is greatly appreciated!

[Ghostscape]

Are you using the normal map as a normal map or are you loading it as a bump map? In that last example it looks like you're loading it up as a bump map. That would explain your issues with the wood image, as well.

[lillarosin]

Ghostscape: Not sure if it's me you're commenting, but no matter what, I'm interested in knowing how I can load it as a normal map? I'm putting the normal map in the bump material slot, because I don't know where else.