Retro 2.5D style, unable to recreate in Unity.

This is Sonic Battle from GBA:

I find very charming the overall low resolution of the game, the 3D elements blend very well with the 2D sprites.

Yet i wonder, how would someone recreate a similar effect in Unity and still support different resolutions / modern standards?

My initial approach was to have a RenderTexture and set a low resolution for the whole camera rendering, the problem is that Sprites end up heavily distorted, loosing the beautiful blend the GBA game has.

Having a 2 cameras setup don't seem to help on "excluding" sprites of being affected by the RenderTexture, is either 3D low res rendered are shown and no Sprites or the opposite.

Maybe a shader to make the 3D models appear low resolution somehow?

Wanted to see if anyone has ideas for a case like this.

 

Your two-camera approach should work. You just need to troubleshoot to find what the problems are. If the sprites are not appearing, it could be an issue with your camera depth or clear flags, it could also be a sprite sorting or depth problem.

 

I have found no way to make it work with the 2 camera setup:

- 3D Camera, Solid Color, Depth = 0, Culling Mask = Everything except Sprites, Render Texture Attached
- Sprites Camera, Depth Only, Depth = 1, Culling Mask = Sprites Only
- Canvas in either Overlay or Camera space (3D Camera attached) with RawImage that covers full screen to display the RenderTexture

Seems the Canvas in Screen Space - Overlay for the RenderTexture makes it always render 3D on top of what the Sprites Camera is rendering. (Sprites not rendered)

Setting it to Screen Space - Camera does the opposite, sprites are rendered only. No matter the setting of the clear flags for both cameras. (3D not rendered)

Maybe it has to do with other settings like render queues of materials as 3D geometry is opaque and sprites are transparent?

Even if i managed it to work that way i worry that it would afffect the sorting of sprites on the 3D environment.

As i was not liking the complexity i have found what feels like an interesting alternative, a post processing low resolution effect with the attribute [ImageEffectOpaque] in the OnRenderImage method. That way the low resolution only affects opaque geometry and nothing else needs to be considered or changed.

 

Have you tried without using canvas?

Edit: It also occurred to me that your first approach should also work, and would probably be easier. To avoid the sprites being distorted, you need to set up a pixel-perfect rendering environment. There are plenty of tutorials on the internet about how to do this, but also Unity has a pixel-perfect package in the package manager that would make it easier to set up.

 

A post processing script that lowers the rendering resolution of the camera seems to be the easiest, i just added the [ImageEffectOpaque] attribute above it's OnRenderImage method.

That way no need to involve the canvas, layers, extra cameras... just take into consideration that anything opaque is going to be rendered in low resolution.

Maybe is that what you meant?

Every other method has lead me to some dead end, i'm not very experienced i must admit too.

 

It's also orthogonal if that helps. The original engine probably didn't use floats either (but that's another story).

 

Everything can help, thanks for the info.

I was wondering if it was a narrow perspective or an orthographic projection myself.

How did you percieved lack of floats? The texture jitter?

 

The hardware is really bad at floating point: https://www.coranac.com/tonc/text/fixed.htm

It is responsible for a characteristic shifting of pixels and bad alignments. They probably skewed scaling sprites or something like that.

But just rendering your game at a fixed resolution to a render texture with Unity's per-pixel settings and sprites should work for you. Anything else could be a box and rendered ortho - you don't really need the wobble part, and most people would not require a simulation of this hardware to get the feel you're going for.