3DSkybox - A way to create more immersive skyboxes for your game


#1

I originally just posted this to the ‘What are you working on currently?’ thread, but I thought I should make a dedicated post so I can share this with people who aren’t on the DevForums. I’m not that great linguistically so this post might seem a bit sloppy, I will try and fix this over time.

Introduction

With the advent of the ViewportFrame, we have seen a wide range of new and inventive uses for the feature. I decided to create a simple ‘Skybox’ model because I really don’t like seeing games where there’s just a drop to nothing, or a clearly flat image.

(The picture below uses a roughly 4096 x 4096 stud terrain map).

In the past I had attempted using programs like Cinema4D to generate six images for use in the actual skybox objects, but whilst they worked in improving the immersion of a game, it still felt flat and static (Not to mention you were still limited by a resolution limit so the images often looked rather poor in quality). This model attempts to fix that by allowing you to put in whatever you want into the skybox and allowing you to dynamically change it, or just make a more immersive skybox which seems to go on and on forever.

(The picture below uses the same terrain map as above, but includes a desert in the ‘Skybox’)

(Large moving objects)

How this works is by putting a billboard gui in front of the main camera (Constantly positioning it so it’s in front of the camera) at a really far away distance so it shouldn’t really block anything in the workspace, then filling the screen with said billboard gui. We then create a ‘fake’ camera at the ‘SKYBOX_ORIGIN’ position (This defaults to 0,0,0) and keep changing the fake camera’s orientation to match the real camera, and then dependant on where the real camera moves, the skybox will move a fraction of the speed.

The reason why we move the camera a fraction of the speed is because these skybox objects are actually really small!

(The MrGreyR15 is just a regular sized character).

This then turns into this;

Limitations

There are some limitations to this, most of which are due to the ViewportFrame (At the time of writing this), such as lighting / physics and how the ViewportFrame will begin to stretch when it reaches a certain resolution - distorting whatever objects you use, but for the most part it seems to be ok, and I’m sure many issues will be fixed later on. I think the biggest concern is that this isn’t really a good use of the ViewportFrame, but i’ll leave that to another time. Fog also seems to be pretty funky with this, I would probably recommend disabling lighting fog, and just use your own method (If possible).

Advice for use

My advice for using this would be to keep a physical barrier be it a hill, invisible wall, large stretch of water, so the player can’t just walk right to the edge of the world, because whilst this can improve immersion, you will still be able to tell when the world ends. Good uses include the ability to create extremely large objects that would have otherwise been cut off by the render distance, and the ability to dynamically change the skybox without having to rely on a large number of images to put into an actual skybox object.

Just to say this is completely open source, so do whatever you want with it, I hope we can make some more immersive experiences.

How to use

By default the 3DSkybox includes a simple example ‘city’ union i made that can showcase the size of the objects, just drag it out and put it in the workspace.

If you go into the SkyboxScript you can change some options like;

  • Skybox Distance - This defines how far away the billboard gui sits, it’s best to have this quite big so it doesn’t clip with anything in the workspace, but I wouldn’t put it too big since it seems to get a bit funky.
  • Skybox Origin - This is where the fake camera sits.
  • Allow Movement - This is just a toggle to allow the skybox to ‘move’ relative to the player’s camera.
  • Movement Scale - This value defines how much the skybox will move when the camera does, the smaller the value, the faster the skybox will move (It’s good to set a larger value if you want to make the skybox seem further away than it really is).

You can then place the objects you want to include in the skybox under the ViewportFrame object.

Once done just put the 3DSkybox billboard gui in the StarterGui.

Download

Download and Link to Model

3DSkybox.rbxm (72.3 KB)
https://www.roblox.com/library/2613880977/3D-Skybox

I thought I might throw in some interesting clips that can showcase some of the funky side of things.

Funky Clips

Falling 100k studs
https://giant.gfycat.com/SpiritedNervousAfricanjacana.mp4
https://giant.gfycat.com/GenerousThunderousDrake.mp4


#2

I want to be the first one to say that this is probably the most amazing thing i’ve seen this year. Keep it up!


#3

Thats radical


#4

This is rather impressive. Thank you for sharing


#5

This is really cool. I never would have thought of using viewport frames in this way. Great work!


#6

Did you ever use Valve’s Hammer editor?

(You beat me to this, btw. good work :slight_smile: )


#7

Haha,

Nah, I’ve never really used Hammer before, but it’s very similar to how they do skyboxes in Source (In a way). I guess the major difference is that the ‘skybox’ isn’t in gameworld / workspace.


#8

Outstanding discovery,
your efforts and time put into this is very appreciated, it’s showcased in a simple and effective way.
Thanks for including the download and other possibilies with ViewportFrame aswell.


#9

This will make a fine addition to my collection.


#10

This is incredible. Thanks for putting so much effort into achieving this, then sharing it with the developer community.


#11

My favorite thing about this post has to be the surreal-ness of Saturn & the R15 character. It’s honestly amazing.

I am curious though. Is the terrain the player standing on part of the skybox?


#12

could this be used to create an illusion of infinite terrain water?


#13

Any way to make it so it ignores fog? So something like this could be done:
Desired:


Actual:


#14

making the skybox slightly transparent might work?


#15

Finally did what I’ve been wanting to do since I started on Redshift Arena. However, the problem now lies with the model slowly breaking apart. Not entirely sure how to fix that as the other method to get around this, doesn’t work since ViewPortFrames don’t support welds yet. Still though, I’m happy with how this is looking so far. Here’s the perfect soundtrack to go along with this. :clap:

And then here’s the actual place:

Edit
Just remembered ViewPortFrames aren’t released for clients yet. :joy:

Still though, here's some screenshots!





#16

That looks out of this world.


#17

Haha, very funny! Lol


#18

I had issues with fog myself, I originally had it enabled for the desert, but then it just seemed to mess it all up - so I turned it off.


#19

You probably could, however I personally would keep a layer of water terrain (If the player is able to reach it), whilst blocking them from being able to swim too far out. Keep in mind I don’t think you’ll be able to use actual terrain water for the skybox, but you might be able to export the texture and make a sprite map of it for a basepart.


#20

The terrain the player is on isn’t part of the skybox (The smooth terrain 4096 x 4096), it was generated by a simple height map importer I made, but it’/ really sloppily made so I never released it - I’m going to try and eventually get around to fixing it sometime.