How to get camera perspective view like Brawl Stars?

icqqqicqqq Posts: 36Member

I want to get the camera perspective view like the following screencap
enter image description here

You can see it is 3D but the edges of blocks are parallel.
So How can I get this view?
Is this perspective or orthogonal?
Can I achieve the same effect if I use perspective camera?

thanks!

Best Answers

  • TwistedTwiglegTwistedTwigleg Posts: 3,089
    Accepted Answer

    Looking at the picture, there are two ways they might have achieved this effect.


    One is that the background is not 3D at all, but rather a 2D image with layers. One thing that gives away that this could be the case is on the far middle right, the bone thingy by a block of stone. The block casts a shadow, but the bone thingy doesn't appear to be effected by this shadow at all. To me, this points towards the background could be 2D, but I haven't play the game before so perhaps this is just a rendering artifact or something.

    If the background is 2D, then it is, relatively speaking, easy enough to achieve this effect with a perspective camera. You need to have a large Quad that always is facing the camera. The easiest way to do this is to have the camera stay at a fixed angle and rotate the quad to face this angle, though there are other ways to go about it if you need/want to use a different technique.

    Then as the players move through 3D space and explore the world make sure the quad (and image on the quad) is big enough to cover the entire game area/world that the camera can see. Add collision shapes at the correct positions and have your 3D characters float above the background image, giving the illusion that they are on the ground.

    However, this adds a lot of potential headaches and honestly, I'm not sure this is how they did it. I'm thinking the bone thingy I mentioned above is just a rendering artifact.


    The other, more likely, way they are doing it is either by using a single orthographic camera with models that look like they are using a perspective camera through texturing, modeling, or shader work. Another possibility is that they are using two cameras, an orthographic camera for the environment and a perspective camera for the players.

    If it is 3D, and you want to use a perspective camera, I would recommend one of two things:

    • Change the Field of View on your perspective camera to a high value so it looks similar to an orthographic camera

      • One huge advantage with this is that everything will look right in relation to other objects in the scene automatically, since you don't need to worry about combining cameras and all that.
      • Using a single camera is easier to manage
      • Depending on your art style, it might look like an artistic choice! This could be considered a pro or a con depending on what you want your game to look like.
    • Use a dual camera technique where the environment is rendered using an orthographic camera and the characters are rendering using a perspective camera.

      • One huge disadvantage with this method will be finding a way to get everything synced up so it looks seamless. I don't know for sure how hard this will be, but I would guess it is difficult to pull off, otherwise more games would be using this method.
      • The characters might appear to be floating on the ground and seem to get smaller towards the edges due to how a perspective camera renders differently than orthographic cameras.
      • Might be harder to make art assets look seamless with this method.

    I should add that what I wrote is from my own personal experience. I have not worked on brawl stars, nor played the game myself, so I cannot say for sure how they are doing it nor what the standard way for doing something like this would be.

    Hopefully this helps!

  • MoonstormMoonstorm Posts: 1
    edited October 2019 Accepted Answer

    I created my account to post this for anyone wondering. NOTE: I'm not a Godot user (been playing with it, but mostly use Unity for my main projects).

    I was looking to achieve this exact camera angle (Brawlstars inspired) and managed to find exactly the right combination that makes it look and feel exactly like Brawlstars. I have played Brawlstars many times and can confirm this configuration looks and feels very similar! Your actual coordinates may vary depending on the scale of your actual gameworld but..

    Camera Mode: Perspective
    Camera Field of View: 7 (yes, only 7)
    Camera X axis rotation: 60
    Camera Y position: 85 (or a very large number, large enough to view your entire battlefield's width)


    The background is 3D (and not a 2D image that's emulating 3D) though the entire scene has baked lighting, probably for performance reasons. Hope this helps!

Answers

  • TwistedTwiglegTwistedTwigleg Posts: 3,089Admin
    Accepted Answer

    Looking at the picture, there are two ways they might have achieved this effect.


    One is that the background is not 3D at all, but rather a 2D image with layers. One thing that gives away that this could be the case is on the far middle right, the bone thingy by a block of stone. The block casts a shadow, but the bone thingy doesn't appear to be effected by this shadow at all. To me, this points towards the background could be 2D, but I haven't play the game before so perhaps this is just a rendering artifact or something.

    If the background is 2D, then it is, relatively speaking, easy enough to achieve this effect with a perspective camera. You need to have a large Quad that always is facing the camera. The easiest way to do this is to have the camera stay at a fixed angle and rotate the quad to face this angle, though there are other ways to go about it if you need/want to use a different technique.

    Then as the players move through 3D space and explore the world make sure the quad (and image on the quad) is big enough to cover the entire game area/world that the camera can see. Add collision shapes at the correct positions and have your 3D characters float above the background image, giving the illusion that they are on the ground.

    However, this adds a lot of potential headaches and honestly, I'm not sure this is how they did it. I'm thinking the bone thingy I mentioned above is just a rendering artifact.


    The other, more likely, way they are doing it is either by using a single orthographic camera with models that look like they are using a perspective camera through texturing, modeling, or shader work. Another possibility is that they are using two cameras, an orthographic camera for the environment and a perspective camera for the players.

    If it is 3D, and you want to use a perspective camera, I would recommend one of two things:

    • Change the Field of View on your perspective camera to a high value so it looks similar to an orthographic camera

      • One huge advantage with this is that everything will look right in relation to other objects in the scene automatically, since you don't need to worry about combining cameras and all that.
      • Using a single camera is easier to manage
      • Depending on your art style, it might look like an artistic choice! This could be considered a pro or a con depending on what you want your game to look like.
    • Use a dual camera technique where the environment is rendered using an orthographic camera and the characters are rendering using a perspective camera.

      • One huge disadvantage with this method will be finding a way to get everything synced up so it looks seamless. I don't know for sure how hard this will be, but I would guess it is difficult to pull off, otherwise more games would be using this method.
      • The characters might appear to be floating on the ground and seem to get smaller towards the edges due to how a perspective camera renders differently than orthographic cameras.
      • Might be harder to make art assets look seamless with this method.

    I should add that what I wrote is from my own personal experience. I have not worked on brawl stars, nor played the game myself, so I cannot say for sure how they are doing it nor what the standard way for doing something like this would be.

    Hopefully this helps!

  • MegalomaniakMegalomaniak Posts: 2,892Admin

    As pointed out by @TwistedTwigleg it(the background) is not 3D but 2D that is emulating orthogonal 3D projection(in orthogonal projection two of the 3D axis can be/are aligned in viewspace). This is kind of similar to, but not to be confused with isometric projection where none of the 3 axis are aligned.

  • MoonstormMoonstorm Posts: 1Member
    edited October 2019 Accepted Answer

    I created my account to post this for anyone wondering. NOTE: I'm not a Godot user (been playing with it, but mostly use Unity for my main projects).

    I was looking to achieve this exact camera angle (Brawlstars inspired) and managed to find exactly the right combination that makes it look and feel exactly like Brawlstars. I have played Brawlstars many times and can confirm this configuration looks and feels very similar! Your actual coordinates may vary depending on the scale of your actual gameworld but..

    Camera Mode: Perspective
    Camera Field of View: 7 (yes, only 7)
    Camera X axis rotation: 60
    Camera Y position: 85 (or a very large number, large enough to view your entire battlefield's width)


    The background is 3D (and not a 2D image that's emulating 3D) though the entire scene has baked lighting, probably for performance reasons. Hope this helps!

Sign In or Register to comment.