How could I achieve the following effect?

I have a tic tac toe looking grid that’s made of parts that are 0.05 by 0.05 by 3.
Is it possible to where the mouse is (via raycast?) that the surroundings get highlighted/amplified?

The dark green represents fully transparent (1), while the yellow green represents fully opaque (0).
And it’s a gradient in between the fully transparent and completely opaque.

I have tried with SurfaceGui’s > Frames > UiGradients, but you can see them through other parts (annoying) and I have not a clue on how to even script them.

Any suggestions?
Thanks!

2 Likes

Anything?

I’ve been messing around for a bit trying to replicate this effect. I’ve done a little bit of research, but for now this is my only solution.

So what I’ve done is I made a part with a texture with black squares and a cutout of the grid. Below it, I put a part that follows the mouse cursor and that has a BillboardGui in it with a glow texture. And below all of that I put a green part that will be the normal color of the grid. I also but black parts around the grid to hide the glow if it comes too close to the edge of the grid. It looks something like this:


b
Now, I know that this is kinda a weird setup that works only if the camera is directly on top of the grid, but as I said, this is the only solution I have so far and maybe the best one that you could use.

Here’s a showcase of it in action!

1 Like

Also, here’s quick code I wrote for the glow part that follows the mouse cursor.

local RS = game:GetService("RunService")

local player = game.Players.LocalPlayer
local mouse = player:GetMouse()
local part = workspace:WaitForChild("Glow")

RS.RenderStepped:Connect(function()
	
	local hit = mouse.Hit
	local target_pos = Vector3.new(hit.Position.X, 2.5, hit.Position.Z)
	part.Position = target_pos
	
end)

I put the number 2.5 in the vector’s y position so it locks there and doesnt go on top of everything.
I made it just for this example so you can modify it for your needs.

Man! Thank you for your effort, and it looks great! but I don’t think you’ve read the entire post…

Yes, sorry I saw the picture and skipped the text…
Anyway, you can just change the green color to black and it will work fine

I changed the bottom green part to a black color and I got this:
c
Is this what you’re looking for?

Again, I want to thank you so much for your time and effort, but unfortunately not.

This is my use:

I will definitely find what you’ve made useful in the future though!

1 Like