Curved World? need to replicate that perspective fx

Is there a way to set a shader or something to render like this?

Im making a game similar to Flippy Race, need the perspective on the distance to appear curved like we’re on a globe


You need to have GLSL knowledge to write a WebGL Shader that curves all of the world’s vertices based on the player or camera position; the farthest away, the more curve applied.

Here’s a shader someone wrote for unity:

You can use it as a base to write the shader from scratch in GLSL.

1 Like

I was thinking of cheating and render the scene to a render texture and then apply it to a curved mesh

I think that game in the video was actually built on a rotating cylinder or other curved geometry. I don’t think the curved effect is from a post-process. From what I see, I don’t see how simply applying a post effect would replicate what is happening in this game.

The GLSL shader devMidgard appears to actually displace vertices before rendering. So that approach is viable if you can find a way to do it in PlayCanvas.

It may seem like it’s actually built on a rotating cylinder or something like that, but that’s actually the magic of shaders.

Just imagine how complex would a game like that be to design, because if you build everything on a rotating cylinder, setting up colliders and other stuff is quite tricky.

However with a shader like the one I found you can simply design the game like any other, on a flat scene, then the shader would take care of making the illusion and tricking you into believeing it’s actually been built like that.

No games would choose the “build directly on an actual rotating cylinder” approach because of the difficulty on design.

Now, another question that raised in my mind while looking up shaders that curve the world like in Animal Crossing or any mobile game, is what happens with colliders? If you displace the vertices then the collider volume you’ve set up in the editor simply won’t be on the right spot, because it doesn’t know what the shader is doing, right?

But actually, it’s all fine! Because by the time the player is about to collide with the object in question, the displace of the vertices is minimal or even nothing, because the distance to the player is very near, so the shader has stopped displacing its vertices.

It’s a very neat and genius approach to making game worlds like that, I was pretty surprised reading about it and have long wanted to make a “curved world” game. Maybe in the future :stuck_out_tongue:


Its a shader

I am doing exactly this for my current project with just an easy code that curves the vertices downwards the further they are in world space (you could change that, eg. distance from camera etc).
This code is part of a vertex shader (vec4 getPosition() to be exact, in transformVS chunk)

float depth = posW.z;
float noCurveDistance= 20.0;

if(depth > noCurveDistance) {
    float amountX = pow(depth - minDistanceToCurve, 2.0) * 0.0001;
    posW = posW + vec4(amountX, 0.0, 0.0, 0.0);

This code curves the world downwards for me, you can change the function to fit your needs.


Thanks Karel, sounds like what I need. Where should I paste that code?

Just copy and replace the transformVS chunk vertex shader with above specified lines in section:

      screenPos = posW;            
      ....paste code here

Thanks, and sorry for the newbie question - how do I apply the vertex shader to the sccene?

Hi Karel, thank you for sharing the code!
How can I change it so it use z distance to camera instead of z-value of it’s position?
I’m newbie at shaders)

Hi @DmitryDevGuy,

You can pass the current camera position as a custom uniform to the vertex shader and do something like this:

float amountX = pow(posW.z - cameraPos.z, 2.0);

Done, thank you :slight_smile:


any chance get this shader?

Hi @Makri and welcome,

Here is my try on it, on a single direction (move around by clicking the mouse and using WASD or arrow keys). It takes into account the active camera position to calculate the curve center.

Note: the effect works in the vertex shader, meaning for it to create a curve all prolonged geometry requires sufficient decimation (polygons).


thank you :grinning:

Nice one @Leonidas

Very tempted to make something with this now, maybe a vertical space shooter!


Yeah, that curve on the horizon is so Nintendo like!

Hi @Leonidas I could not access this project. Could you please share this curve shader?

Don’t bother I was opening the link in incognito mode.

1 Like