Parallax Mapping with Images

Help and Feedback Creations Feedback
#1

Recently, I’ve been working on a Parallax Mapping script which calculates the size and position of an imagelabel and display it onto the surface of a part. You set a certain offset and it will display that ImageLabel as if it were a 2D plane at that point in 3D space.

Though it is very good, there are still flaws with the system, like how I can’t rotate the images as Image deformation is not a feature of imagelabels. However it can be used to mimic the way a viewportframe would display parts in 3D space, but at a fraction of the performance cost.

In this video there are three images which are placed 15 studs backwards from the part and offset with different values.

This can be used to fake the interior of rooms like seen below. Though it isn’t perfect as the walls surrounding the interior have to be faked with the size of the image, giving it a weird distortion when you look at it from angles that don’t show the back flat wall

The module also supports angled parts, as the Images are always rectangular they will also rotate with the part as seen below. It updates in real time, so it would support spinning/moving parts

The Images also work like any other normal ImageLabels, meaning you can apply transparency, etc. Since the code uses ImageLabels and not viewportframes, you are able to render a lot of them efficiently, seen below is one Part with 400 ImageLabels being rendered. Each Image is 500x500 Pixels.

If you have any ideas on how to correct the weird distortion for the interiors please post below about it!

UPDATED VERSION

I’ve managed to clean up the images and add a bunch of customization to allow certain restraints to be set on how well the editablemeshes will render as they aren’t bounded by the surfaceGUI.

This technique is 4 times as expensive though, which means that it would only be used in niche spots where imagelabels wouldn’t work. But since it supports both EditableMesh and Imagelabels, you can have them both co-exist on the same part at the same time. Though there are some problems with the editablemeshes vanishing at certain angles.

27 Likes
DistanceFade - A transparency falloff effect for your games
Introducing in-experience Mesh & Image APIs [Studio Beta]
#2

this is really cool

bruh

#3

I’ve updated it, adding support for rotation of the planes, allowing me to do what is seen below.

While the image does start to artifact when you get too close to the part, if you’re about 20 studs away or the part is obstructed, the illusion is basically perfect.

I achieved this through the use of editablemeshes and calculating each of the vertexes of the image individually, meaning the angled planes are 4 times as expensive to render as flat images in theory.

EDIT: Since I’m using meshes to render the rotated walls, it doesn’t get subjected to clipping, which is why you can see it in angles where you shouldn’t as the module places the vertices off of the part that it is rendering on.

2 Likes
#4

is there a way to do this but with a meshpart? to create parralex mapped bulletholes? if so could you make a basic module to do it?

#5

The Parallax mapping isn’t perfect though, as you will get the effects of perspective distortion (as opposed as affine distortion), to prevent this you need a lots of subdivision, which is bad for performance, yet if you make too less subdivision, it will appear wobbly. (because of the reasons above.)
there’s no way to make triangles act as affine mapping for perspective, so methods from playstation games are used.

#6

I’ve open sourced the module here:

#7

Yes, while I’ve been chipping away at small improvements to the module, It’s gotten fairly optimised and can run ~8000 image labels on an Iphone 13 at a smooth 60 FPS.

The problem I’m facing now is that surface GUIs are not at all optimised on desktops. Which results in desktop devices like PCs and Laptops receiving terrible performance when a feeble Iphone can run the stress test no problem. The problem comes down to how surface GUIs are being rendered on the desktop client.

If Roblox improves surface GUI rendering on desktop, I would likely be able to increase the number of windows I can have all going at once whilst keeping the module performant on all devices.

Though I can’t post in feature requests or bug reports which kinda sucks, so I can’t even ask Roblox to fix it :confused:

#8

Here’s the image with perspetive distortion:

image
image1920×1040 121 KB

It does not appear correct, as it’s not symmetrical.

#9

Sorry unrelated to this post (incredible work btw), but how did you do this lighting?
Could I get a place file?

#10

The lighting came from a paid module. It’s called VOLUMIKA and it’s a volumetric lighting :skull:. It’s like 40 USD if I remember correctly.

1 Like
#11

First Roblox developer to not gatekeep Parallax Mapping. (Trust me, some developers love keeping this a secret.)

2 Likes
#12

Ohh that thing? I remember it being somewhere around that price. Looks great but it’s just too much for me lol. Thanks though!

1 Like
#13

Yes I’m pretty sure elttob said that he was going to make a waitlist where you could receive the module for free if you just wait long enough.

1 Like