Hello there!
Does anyone know how to make a skybox render without smoothing? Or does it rely on some sort of stretching…
Desired effect is the pixely aesthetic
Could you pixelate the images or do you want to be able to vary the pixelation withinBJS?
I’ve got the original image pixelated, but it seems to come out smooth/blurry when I load it in-engine.
The screenshot above shows in-engine (top) and source image (bottom). The image is 64x64 and put onto a 5000 unit skybox. I tried to set the sampling mode of a few textures but maybe I’m changing it on the wrong object…?
var skybox = BABYLON.Mesh.CreateBox("skyBox", 5000.0, this.scene)
var skyboxMaterial = new BABYLON.StandardMaterial("skyBox", this.scene)
skyboxMaterial.backFaceCulling = false
skyboxMaterial.reflectionTexture = new BABYLON.CubeTexture("/images/TropicalSunnyDay", this.scene)
skyboxMaterial.reflectionTexture.coordinatesMode = BABYLON.Texture.SKYBOX_MODE
skyboxMaterial.reflectionTexture.samplingMode = BABYLON.Texture.NEAREST_SAMPLINGMODE
skyboxMaterial.samplingMode = BABYLON.Texture.NEAREST_SAMPLINGMODE
Also not really sure how this would even look in the end if it worked… may try to investigate just having a gradient sky (if cheap…) and then putting a few voxelly cloud models around
ty ty
There’s an updateSamplingMode method on the texture object, though it appears to not be working if called before the texture is ready (pg here, issue on old forum here).
2 Likes
So as you all may have imagined, putting pixel art on a literal box makes the box very obvious – you can see the lines of nice square pixels converge towards the corners (see above image).
Is there a trick to make these pixels always face the camera but still scroll around like a distant object (aka the sky)?
I’m imagining a giant billboard sprite off in the distance, parented to the camera so it is always in front of the camera…but that the image on that billboard scrolls/pans as the camera moves thus showing a different section of the sky. The source image would just be a long horizontal thing that could seamlessly loop maybe. For all I know this is already a type of a sky in 3d games…?
This is just me playing around so whether it can be adapted to work with your scenario I am not sure. The basic idea is to use a cylinder for the sky. I have done it with limits on the up and down movements on the camera but could be changed for other cameras.
This Babylon.js Playground uses the px, nz, nx, pz skybox images to form one long image.
This https://www.babylonjs-playground.com/#SEPRT4#1 uses a square image (adapted to tile left to right)
To get things as you want you will probably need to improve: images, image ratio, pixelation, lighting, positioning of cylinder and/or camera.
Hopefully you might get some ideas from this.
2 Likes
Thanks those look good. Something like this is definitely going to work.