Jump to content
havenphillip

Parallax shader

Recommended Posts

Super easy to use. You just slap it on a material and slap that material on an object. You gotta have a heightmap. I make mine on Materialize, which is free. Makes simple, wimpy flat planes look more complex than they are. Haven't tested it for any FPS drop or with decals or anything. Should be fun to mess with, though.




ย 

cobbleexample.png

Parallax.zip

  • Like 3

Share this post


Link to post
Share on other sites

Really awesome. My only concern is the shader with AMD because that's always a concern. But good work from what I'm looking at.

  • Like 1

Share this post


Link to post
Share on other sites

I see you actually did parallax occlusion mapping (POM), which is one step beyond simple parallax. Nice job.

  • Like 1

Share this post


Link to post
Share on other sites

Thanks dude it's a magical world of bewilderment. I dig this stuff up piecemeal but I'm going to go back and find some more tutorials to see if I can make better sense of it.

Share this post


Link to post
Share on other sites

That decal looks like it's working. So far so good. Hadn't seen you in a while, Yue, I was worried.

I've heard of AMD but I'm not sure what that means, exactly. It's parallax, though. It shouldn't be too expensive to run.

  • Thanks 1

Share this post


Link to post
Share on other sites
57 minutes ago, havenphillip said:

That decal looks like it's working. So far so good. Hadn't seen you in a while, Yue, I was worried.

I've heard of AMD but I'm not sure what that means, exactly. It's parallax, though. It shouldn't be too expensive to run.

AMD as in the vendor of the card. With my RX480, not everything works like it should.

  • Confused 1

Share this post


Link to post
Share on other sites

Added an edge texture which I made in GIMP. It looks remarkably good in-game even with texture settings set to low and standing right up to it. I'm working right now on fixing the color change to offset the loss of brightness by adding the map.

It was pretty easy to make. In GIMP I opened the diffuse texture, then went to Filters/Distorts/Emboss, and set the elevation to 90 so the edges were evenly dispersed.

easy to code, too. You just mix it with the diffuse:

...

ย ย ย ย  vec4 edge = texture(texture4,texcoords0.xy);

ย ย ย ย  edge = mix(edge,outcolor,1.0-edge_amount);

...

ย ย ย  //Output
ย ย  ย fragData0 = outcolor;
ย ย  ย fragData0 *= edge;

...

Zoom in on this I'm fining it ridiculous how close I can get to this texture without it looking like a pixelated mess. Might be worth it to include an edge texture generator in LE5.

ย 

edge examples.jpg

  • Like 2

Share this post


Link to post
Share on other sites
1 hour ago, ๐Ÿ’ŽYue๐Ÿ’Ž said:

A question, with what do you create the texture of protuberance? ( the blue texture ).ย 

I see that you don't have the same result if I use the texture that is created in leadwerks.ย 



I use Materialize. It's free. 3 tutorials you should have it mastered.ย 

http://boundingboxsoftware.com/materialize/downloads.php

http://boundingboxsoftware.com/materialize/tutorials.php

I used a slightly different diffuse texture when I made the normal map (protuberance), which I doctored in GIMP to exaggerate the contrast and then discarded. So it makes sense that the LE normal map wouldn't work the same. See how this one is brighter?
ย 

cloverforheight.jpg

  • Like 3
  • Thanks 1

Share this post


Link to post
Share on other sites

Here's another version I built for speed. I took out a lot of the bells and whistles. I was also doing a bunch of pointless calculations in the matrix. It's a little faster but unfortunately it requires sacrifices. Would be nice if Josh could find us a few FPS points somewhere so stuff like this could be used more widely. LE would look amazing.

ย 

parallax_economy.zip

  • Like 3

Share this post


Link to post
Share on other sites

I was looking inside the leadwerks shaders directory and I see shaders of parallax and tessellation.

My question is what's the difference between these and the one you've exposed here. ย I don't know much about shaders. But it is curious to see that you always have something to learn.
image.png.d796c8fdd822ff6be559beddbb9e0765.png
ย 

Share this post


Link to post
Share on other sites

Honestly I'm just learning that as I go. But as Josh mentioned, this shader is technically "parallax occlusion" (POM), or maybe "steep parallax." Pretty much all I know is it requires an extra matrix-to-eye calculation and the way I understand it it uses the z coordinate of the "eye" to produce a perception of depth like a raycast.

  • Like 1

Share this post


Link to post
Share on other sites

I just figured out how to get even more speed. So now I'm going to backtrack from the parallax_economy shader and see how much I can put back into it without losing that speed. I'll post the final shader either today or tomorrow.

  • Like 2

Share this post


Link to post
Share on other sites

Ok last one all nice and tidy so you can delete all the above if you prefer. I put in the regular and economy versions and two textures to mess with just as examples. I left out the cobblestone texture, though. The regular parallax has the edge texture in it uncommented in case you want to check it out. It looks good but it cuts the FPS in half. The economy version is an attempt to get max speed without making it look too bad, and it really doesn't look too bad at all unless you compare it to the other one, but it's clearly the more workable option.

ย 

ย 

Parallax.zip

  • Like 3

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


ร—
ร—
  • Create New...