Hi everyone. I have seen many indie games (especially horror ones) use a ps1 aesthetic, but I haven’t seen many people use this style inside of Roblox.
Example of “ps1 look”:
The reason it is difficult to create this look is due to Roblox’s engine limitations, with the shaders required for this look (eg. downsampling, affline mapping) not yet available to us. However, we can recreate this effect in certain ways on roblox. I have put together three methods that can achieve similar aesthetics to what other game engines can do.
This tutorial outlines the three methods for creating this look and also provides a game that you can look through as an example of how this can be used.
Method 1: Using textures
This method is the most straightforward of the three, but has some limitations, depending on how close to the “ps1 look” you want it to be.
You can use textures that are 256x256 or 128x128 pixels to create a ps1 style, but Roblox filters textures lower resolution than 1024x1024, which leads to blurry textures.
You can upload the textures as 1024x1024 but if there are a large amount of high-res textures in your game it impacts performance.
This blurriness can be bypassed by using the Pixelated resample mode on ImageLabels, but this will require you to use SurfaceGuis as a replacement for textures, which impacts performance.
Example of filtering modes: Left is default, right is Pixelated
The SurfaceGui images do not wrap around the surface of an object like Decals and Textures do, so you cannot use them on objects like spheres or cylinders.
This method is the simplest but least closest to the ps1 look of the three, because it is missing the warping effect caused by affline mapping, and is a higher resolution than the native ps1 resolution.
Method 2: Textures and Warping
This method still uses the pixelated textures from before, but also adds distortion in a way that looks similar to the affline mapping used for the ps1.
Most game engines use floating-point numbers to calculate how 3d models will look, but when you get further away from the origin (0,0,0) the numbers are less precise, which results in model distortion.
Examples:
50k studs away from origin
900k studs away from origin
2 million studs away from origin
This floating point precision error that usually affects games can be exploited to create the desired warping effect, with the intensity being how far from the origin you are.
This looks closer to the ps1 style, but if you really want the most convincing look there is an even better method.
Method 3: Textures, Warping and Glass
This method is the most limiting but also the most similar to the ps1 style.
This method also abuses the floating point error but with one difference: it creates a downsampled effect.
The glass material is critical to this method because of the unique distortion effect it has.
Like with models, this distortion effect is more pronounced and pixelated when further from the origin.
With glass:
Without glass:
This really sells the ps1 look with the low resolution effect, but also has drawbacks.
- Everything that normally cannot be seen through glass will be invisible in your game (eg. glass, transparent objects, surface and billboard guis, decals, textures, etc.)
- Performance is not good when using this method.
But it looks quite good.
Here is the script i used to attach the glass to the camera:
local Camera = workspace.CurrentCamera
local part = workspace.Glass
part.CanCollide = false
part.Anchored = true
part.Parent = workspace
local function update()
part.CFrame = Camera.CFrame*CFrame.new(0,0,-0.41)*CFrame.Angles(math.pi/-2,math.pi/1,math.pi/1)
end
Camera:GetPropertyChangedSignal"CFrame":Connect(update)
update()
The glass distortion effect can also be changed by moving it closer or further away from the camera.
To get the best results, change the glass transparency to 0.99 and the glass color to medium stone grey.
Note that this effect is only visible on graphics settings 8 or higher.
Optional effects
In one of my old projects where I used this look, I additionally locked the framerate at 25fps, changed the aspect ratio to 4:3 and added lines across the screen to imitate an old monitor.
These effects are optional but can sell the look further depending on what kind of game you are making.
I hope you all found this tutorial helpful if you are looking to create this effect.
Examples of games I used these methods in:
Method 3:
(old horror project, uncopylocked)
https://www.roblox.com/games/5315543299/ps1
Method 2:
(current project)
https://www.roblox.com/games/7016581453/Killmode
