Turbulence effect creator with RGB ,grid and Perlin Noise

Please consider using the “What are you working on currently?” topic!
I have thought ChatGPT is even more smarter than the most scientifics of Roblox , iasked him to make something cool and this it what it does
And this script to build an grid of parts making a turbulence effect of RGB random colors and extra options:

-- Settings
local partSize = Vector3.new(.4, .4, .1) -- Size of each part
local gridSize = 200 -- Number of parts along one side of the grid
local gridCenter = Vector3.new(0, 0, 0) -- Center of the grid
local noiseScale = 0.1 -- Scale of Perlin noise for turbulence smoothness
local turbulenceScale = 1 -- Intensity of the turbulence
local colorSpeed = 0.8 -- Speed of color changes
local movementSpeed = 0.5 -- Speed of turbulence pattern movement
local parentModelName = "FlowingTurbulenceGrid" -- Name of the Model to group the parts

-- Create a parent model to hold the parts
local model = Instance.new("Model")
model.Name = parentModelName
model.Parent = workspace

-- Function to generate turbulence-like RGB colors
local function turbulenceToColor(x, y, timeOffset)
	-- Create a turbulence effect by combining multiple noise values
	local offsetX = math.noise(x * noiseScale, y * noiseScale, timeOffset * movementSpeed) * turbulenceScale
	local offsetY = math.noise(x * noiseScale + 10, y * noiseScale, timeOffset * movementSpeed) * turbulenceScale

	-- Compute the Perlin noise for RGB using turbulence offsets
	local r = math.noise(x * noiseScale + offsetX, y * noiseScale + offsetY, timeOffset * colorSpeed)
	local g = math.noise(x * noiseScale + offsetY, y * noiseScale - offsetX, timeOffset * colorSpeed)
	local b = math.noise(x * noiseScale - offsetX, y * noiseScale - offsetY, timeOffset * colorSpeed)

	-- Map values from [-1, 1] to [0, 1]
	r = math.clamp((r + 1) / 2, 0, 1)
	g = math.clamp((g + 1) / 2, 0, 1)
	b = math.clamp((b + 1) / 2, 0, 1)
	return Color3.new(r, g, b)
end

-- Calculate half grid size for centering
local halfGridSize = (gridSize - 1) * partSize / 2

-- Store parts for animation
local parts = {}

-- Generate the grid of parts
for x = 0, gridSize - 1 do
	for y = 0, gridSize - 1 do
		-- Calculate part position
		local posX = gridCenter.X + (x * partSize.X - halfGridSize.X)
		local posY = gridCenter.Y + (y * partSize.Y - halfGridSize.Y)
		local posZ = gridCenter.Z -- Flat 2D grid on the Z-axis
		local position = Vector3.new(posX, posY, posZ)

		-- Create and configure the part
		local part = Instance.new("Part")
		part.Size = partSize
		part.Position = position
		part.Anchored = true
		part.Parent = model
		table.insert(parts, {Part = part, GridX = x, GridY = y})
	end
end

-- Animate the colors for flowing turbulence effect
game:GetService("RunService").Heartbeat:Connect(function(deltaTime)
	local time = wait() * movementSpeed -- Use `tick()` to create a time offset
	for _, data in pairs(parts) do
		local part = data.Part
		local x = data.GridX
		local y = data.GridY
		-- Assign dynamic color based on turbulence-like noise
		part.Color = turbulenceToColor(x, y, time)
	end
end)

And the version for UI , had a Surface UI with the Script and a Frame

-- Settings
local gridSize = 200 -- Number of Frames along one side of the grid (fixed size)
local frameSize = UDim2.new(0, 10, 0, 10) -- Size of each Frame (can be smaller for higher resolution)
local gridSpacing = UDim2.new(0, 0, 0, 0) -- Spacing between Frames (0 for seamless turbulence)
local noiseScaleX = 0.1 -- Perlin noise scale for X-axis resolution
local noiseScaleY = 0.1 -- Perlin noise scale for Y-axis resolution
local turbulenceScale = 5 -- Intensity of the turbulence effect
local colorSpeed = 0.8 -- Speed of color changes
local movementSpeed = 0.5 -- Speed of turbulence pattern movement
local parentFrameName = "Frame" -- Name of the parent Frame holding the grid

-- Find the parent Frame in the UI
local parentFrame = script.Parent:FindFirstChild(parentFrameName)
if not parentFrame or not parentFrame:IsA("Frame") then
	error("Parent Frame with the name '" .. parentFrameName .. "' not found or is not a Frame!")
end

-- Calculate grid layout size
local totalSizeX = gridSize * frameSize.X.Offset + (gridSize - 1) * gridSpacing.X.Offset
local totalSizeY = gridSize * frameSize.Y.Offset + (gridSize - 1) * gridSpacing.Y.Offset
local gridStartPos = UDim2.new(0.5, -totalSizeX / 2, 0.5, -totalSizeY / 2) -- Center the grid

-- Store frames for animation
local frames = {}

-- Function to generate turbulence-like RGB colors with pattern movement
local function turbulenceToColor(x, y, timeOffset)
	-- Generate Perlin noise with different scaling for X and Y for a higher resolution pattern
	local offsetX = math.noise(x * noiseScaleX, y * noiseScaleY, timeOffset * movementSpeed) * turbulenceScale
	local offsetY = math.noise(x * noiseScaleX + 10, y * noiseScaleY, timeOffset * movementSpeed) * turbulenceScale

	-- Compute the Perlin noise for RGB using turbulence offsets
	local r = math.noise(x * noiseScaleX + offsetX, y * noiseScaleY + offsetY, timeOffset * colorSpeed)
	local g = math.noise(x * noiseScaleX + offsetY, y * noiseScaleY - offsetX, timeOffset * colorSpeed)
	local b = math.noise(x * noiseScaleX - offsetX, y * noiseScaleY - offsetY, timeOffset * colorSpeed)

	-- Map values from [-1, 1] to [0, 1]
	r = math.clamp((r + 1) / 2, 0, 1)
	g = math.clamp((g + 1) / 2, 0, 1)
	b = math.clamp((b + 1) / 2, 0, 1)
	return Color3.new(r, g, b)
end

-- Create the grid of Frames
for x = 0, gridSize - 1 do
	for y = 0, gridSize - 1 do
		-- Calculate frame position
		local posX = gridStartPos.X.Offset + x * (frameSize.X.Offset + gridSpacing.X.Offset)
		local posY = gridStartPos.Y.Offset + y * (frameSize.Y.Offset + gridSpacing.Y.Offset)
		local position = UDim2.new(0, posX, 0, posY)

		-- Create and configure the Frame
		local frame = Instance.new("Frame")
		frame.Size = frameSize
		frame.Position = position
		frame.BackgroundColor3 = Color3.new(0, 0, 0) -- Default color
		frame.BorderSizePixel = 0 -- No border for seamless grid
		frame.Parent = parentFrame
		table.insert(frames, {Frame = frame, GridX = x, GridY = y})
	end
end

-- Animate the colors for flowing turbulence effect
game:GetService("RunService").Heartbeat:Connect(function(deltaTime)
	local time = wait() * movementSpeed -- Use `tick()` to create a time offset
	for _, data in pairs(frames) do
		local frame = data.Frame
		local x = data.GridX
		local y = data.GridY
		-- Assign dynamic color based on turbulence-like noise
		frame.BackgroundColor3 = turbulenceToColor(x, y, time)
	end
end)

Note : I used ChatGPT to do it because im noob at programming ,also i made it when i was bored , i thought is a good idea for Dream Core games and ok i have tips to do if this script could power Roblox Imagitacion as the tagline says

To-Do List for Future Updates:

  • Test grid scaling and resolution across different screen sizes.
  • Add performance optimization for larger grid sizes or lower-end devices.
  • Implement UI sliders for real-time adjustments of gridSize, frameSize, movementSpeed, and colorSpeed.
  • Add custom color gradients for more control over the turbulence pattern colors.
  • Implement other noise types (e.g., Simplex or Value Noise) to create smoother, more visually appealing transitions.
  • Experiment with interactivity (e.g., mouse click interactions, animations) to make the grid more engaging.
  • Add debugging features to visualize current parameters and performance.

Oh oooh, also replace tick() with wait() in one of these codes to make it animated i’ve forgor that

1 Like

Also this is my first Topic , ill feature it
And the map i was experimenting with these cool codes
Experimental Place.rbxl (383.8 KB)

it would be cool if the UI version ,the grid should be scaled with Scale instad of Offset ,and the both versions ,animated turbulences for sensory games

Requesting this:

  • Compatiblity ,with EditableImages
  • More effects
  • 3D Turbulences ,as sensorial is better for autistic games
1 Like

It runs perfectly in my PC at the max graphics also isn’t lagging with a 100px resolution of grid at 165 fps from my monitor ,but it LAG HORRIBLY with 500px of grid

This is my PC specs:

  • GPU 0 : AMD Ryzen 5 4600G with Radeon Graphics
  • GPU 1 : NVIDIA GeForce RTX 3050
  • Hard Disk : KINGSTON SNV2S1000G 932 GB SSD
  • RAM : 16GB Ram DDR4 or DDR5

And then my monitor specs:

  • Resolution : 1920x1080
  • Frame Rate : 165hz
  • Monitor : Samsung Gaming Odyssey G3 24" FHD
1 Like

Note that i have an error with the UI version , when the gridSize is 400 ,image cannot be generated

i have no idea what this does so a video would be nice