Parallax Corrected Surface GUIs
(Module)
Anyways! I’ve created an open sourced parallax correction module to fake 3D space using UI elements like imagelabels and frames. This can be used for things such as faking the size and scale of things that would normally be in a skybox, but actually have it in 3D space without the need of a gigantic scaled model. The module has support for every UI element that works in a SurfaceGUI, including buttons.
The module WILL NOT work with rotation due to the clip descendants not working with rotation.
The images also cannot be rotated in 3D space as that would require image manipulation which currently is limited to editable image & meshes which aren’t live in-game yet, which is why I haven’t included them in this module.
Showcase Video
Here are some examples
Examples
TextLabels
Images
Low PixelsPerStud Effect
Moving Text
Videos (works with sound)
BoxInBox effect
Rotating Part
Downloads
play the OLD demo or download the demo file This one doesn’t have any optimisations
Optimised demo and download This one has optimisations and stress testing
ParallaxWindows.rbxm (12.6 KB)
Simple Setup Code
Step 1 - Import the Module
local ParallaxWindows = require(script.ParallaxWindows)
-- initiate a new ParallaxWindows using .new() constructor
local ParallaxWindow = ParallaxWindows.new()
Step 2 - Create your Frame
local part = game.Workspace.Part
local frame = ParallaxWindow:AddFrame(part,Enum.NormalId.Front) -- Create the frame object on a part's face
local originalOffset = Vector3.new(-10,0,0) -- the positional offset of the parallax
ParallaxWindow:UpdateFrameSettings(frame,{ ["PosOffset"] = originalOffset, }) -- update this specific frame's settings, overrides the default ones!
Step 3 - Running the Loop
game:GetService("RunService").RenderStepped:Connect(function()
-- call Step() for each parallaxwindow object to update all of its frames and guis
ParallaxWindow:Step()
end)
Final Example Code
local ParallaxWindows = require(script.ParallaxWindows)
-- initiate a new ParallaxWindows using .new() constructor
local ParallaxWindow = ParallaxWindows.new()
local part = game.Workspace.Part
local frame = ParallaxWindow:AddFrame(part,Enum.NormalId.Front) -- Create the frame object on a part's face
local originalOffset = Vector3.new(-10,0,0) -- the positional offset of the parallax
ParallaxWindow:UpdateFrameSettings(frame,{ ["PosOffset"] = originalOffset, }) -- update this specific frame's settings, overrides the default ones!
game:GetService("RunService").RenderStepped:Connect(function()
-- call Step() for each parallaxwindow object to update all of its frames and guis
ParallaxWindow:Step()
end)
Change Default Settings
local GuiSettings = {
["MaxFramerate"] = 60, -- Max Frame rate that the GUI will run at
["MinFramerate"] = 1, -- Min Frame rate that the GUI will run at (for when the GUI is out of Update Distance)
["UpdateDistance"] = 200, -- Distance that the GUI will stop updating at (Module will adjust framerate depending on the distance)
["ZOffset"] = 0,
["AlwaysOnTop"] = false,
["Brightness"] = 1,
["LightInfluence"] = 0,
["MaxDistance"] = 1000,
["PixelsPerStud"] = 100,
["SizingMode"] = Enum.SurfaceGuiSizingMode.PixelsPerStud,
}
local FrameSettings = {
["UpdateRange"] = 100, -- Distance at which the Image is no longer Updated
["ZIndex"] = 0,
["Image"] = "https://assetgame.roblox.com/asset/?id=18271321806&assetName=testface", -- TextureId
["ImageTransparency"] = 1, -- Transparency of the texture when in range
["BackgroundTransparency"] = 1, -- Transparency of the texture background when in range
["ImageColor3"] = Color3.fromRGB(255, 255, 255), -- Color of the texture
["BackgroundColor3"] = Color3.fromRGB(255, 255, 255), -- Color of the texture background
["ResampleMode"] = Enum.ResamplerMode.Default, -- Resampling mode
["ScaleType"] = Enum.ScaleType.Stretch, -- Scaling type
["ImageSize"] = Vector3.new(8, 8, 0), -- Size of the image in studs per tile, dont use Z value, just using V3 cause its more efficient than V2
["PosOffset"] = Vector3.new(0, 0, 0), -- Positional offset for parallax from the face
}
-- update default frame settings with initial customization settings
ParallaxWindow:UpdateSettings(GuiSettings,FrameSettings)
Customizable Settings
-- default settings, can be overriden with custom settings by using UpdateFaceSettings() and UpdateFrameSettings()
local DEFAULT_GUI_SETTINGS = {
["MaxFramerate"] = 60, -- Max Frame rate that the GUI will run at
["MinFramerate"] = 1, -- Min Frame rate that the GUI will run at (for when the GUI is out of Update Distance)
["UpdateDistance"] = 200, -- Distance that the GUI will stop updating at (Module will adjust framerate depending on the distance)
-- SurfaceGui settings
["ZOffset"] = 0,
["AlwaysOnTop"] = false,
["Brightness"] = 1,
["LightInfluence"] = 0,
["MaxDistance"] = 1000,
["PixelsPerStud"] = 100,
["SizingMode"] = Enum.SurfaceGuiSizingMode.PixelsPerStud,
}
local DEFAULT_FRAME_SETTINGS = {
["UpdateRange"] = 100, -- Distance at which the Image is no longer Updated
["ZIndex"] = 0, -- ZIndex of the frame
["Image"] = "rbxassetid://18838056070", -- ImageId
["ImageTransparency"] = 0, -- Transparency of the image when in range
["BackgroundTransparency"] = 1, -- Transparency of the image background when in range
["ImageColor3"] = Color3.fromRGB(255, 255, 255), -- Color of the image
["BackgroundColor3"] = Color3.fromRGB(255, 255, 255), -- Color of the image background
["ResampleMode"] = Enum.ResamplerMode.Default, -- Resampling mode
["ScaleType"] = Enum.ScaleType.Stretch, -- Scaling type
["ImageSize"] = Vector3.new(8, 8, 0), -- Size of the image in studs per tile, dont use Z value, just using V3 cause its more efficient than V2
["PosOffset"] = Vector3.new(0, 0, 0), -- Positional offset for parallax from the face
}
And that’s all! You have my full permission to use this module in your games (credit in the description would be nice tho). I hope you can get some use out of this module. If you have any questions or feedback just send a response to this post!
FYI this is also my first module I’ve created so