Help with TweenService

Help and Feedback Scripting Support
#1

How can i make this puzzle-like fading effect shown in video?

#2

It’s just PNG stripes in order with no gaps tweened

#3

Yeah, it wouldn’t be possible to make this with TweenService. I believe it’s just a bunch of decals put together with a script to make a smooth animation.

1 Like
#4

It is possible? UIGradient with offset, very possible.

2 Likes
#5

Wait I didn’t think about that

1 Like
#6

Ah, im really confused, I’ve seen these kind of animations before and I’ve always wondered how can i make something like this, can you give an example, sir? I mean i dont even know how it is possible to make something like this with UIGradient.Offset :frowning:

1 Like
#7

I mean yeah i can create a tiled frame with ugly tiles but still the animation with TweenService looks bad

function makePuzzle(HAmount,par)
  local XSize=(par.AbsoluteSize.X)/HAmount
  for i=1,HAmount,1 do
    local frame=Instance.new'Frame'
    frame.Size=UDim2.new(0,XSize,1,0)
    local pos=par:FindFirstChildOfClass'Frame' and UDim2.fromOffset(XSize*(i-1),0) or UDim2.fromScale(0,0)
    frame.Position=pos
    frame.BackgroundColor3=Color3.fromRGB(math.random(255),math.random(255),math.random(255))
    frame.Parent=par
  end
end
local S=Instance.new('ScreenGui',game:GetService'Players'.LocalPlayer:WaitForChild'PlayerGui')
local frame=Instance.new'Frame';frame.Size=UDim2.fromScale(.4,.2);frame.Position=UDim2.fromScale(.5,.5);frame.AnchorPoint=Vector2.new(.5,.5);frame.Parent=S
makePuzzle(10,frame)
#8

let me make it for u im bored to explain

#9

Like this?

local ts=game:GetService'TweenService'
function makePuzzle(HAmount,par)
  local XSize=(par.AbsoluteSize.X)/HAmount
  for i=1,HAmount,1 do
    local frame=Instance.new'Frame'
    frame.Size=UDim2.new(0,XSize,1,0)
    local pos=par:FindFirstChildOfClass'Frame' and UDim2.fromOffset(XSize*(i-1),0) or UDim2.fromScale(0,0)
    frame.Position=pos
    frame.BackgroundColor3=Color3.fromRGB(math.random(255),math.random(255),math.random(255))
    frame.BorderColor3=frame.BackgroundColor3
    frame.Parent=par
  end
  par.BackgroundTransparency=1
  for i,v in next,par:GetChildren() do
    game:GetService'Players'.LocalPlayer.Chatted:Connect(function()
      local color=ts:Create(v,TweenInfo.new(1.25,Enum.EasingStyle.Sine,Enum.EasingDirection.Out,0,false,0),{BackgroundColor3=Color3.fromRGB(231,197,142)})
      color:Play()
      local color2=ts:Create(v,TweenInfo.new(1.25,Enum.EasingStyle.Sine,Enum.EasingDirection.Out,0,false,0),{BorderColor3=Color3.fromRGB(231,197,142)})
      color2:Play()
      color.Completed:Wait()
      task.wait(1)
      local Rand=math.random(10);Rand=Rand<5 and {Size=UDim2.new(0,XSize,0,0),Position=UDim2.new(0,v.Position.X.Offset,1,0)} or Rand>=5 and {Size=UDim2.new(0,XSize,0,0)}
      local size=ts:Create(v,TweenInfo.new(math.random(3),Enum.EasingStyle.Sine,Enum.EasingDirection.Out,0,false,0),Rand)
      size:Play()
      size.Completed:Wait()
      ts:Create(v,TweenInfo.new(.1,Enum.EasingStyle.Sine,Enum.EasingDirection.Out,0,false,0),{BorderSizePixel=0}):Play()
    end)
  end
end
local S=Instance.new('ScreenGui',game:GetService'Players'.LocalPlayer:WaitForChild'PlayerGui')
local frame=Instance.new'Frame';frame.Size=UDim2.fromScale(.4,.2);frame.Position=UDim2.fromScale(.5,.5);frame.AnchorPoint=Vector2.new(.5,.5);frame.Parent=S
makePuzzle(20,frame)

Bro could you tell me one thing… when i tween the tile’s size to 0 , it’s border doesn’t disappear when the size of the tile is 0… this makes the animation look bad if i want to set the BorderSizePixel to 0 after the main tween.

#10

You’re not even using UIGradient as i told to?

#11

I mean it is vertical bro uh im lazy can you do it with UIGradient and record a video about it please?

#12

effect.rbxm (9.8 KB)

edit to your preferences, speed, stripe thickness via photoshop etc

#13

Bro im not on pc right away :sob: can you show a video instead.

#14

I have a trash pc to record, won’t look good in a video

#15

It doesn’t matter i dont care about the quality of the video.

#16

EffectStripes.rbxm (10.3 KB)

Heres a better version for fixed frame size

#17

Guess i have no choice instead of using the laptop, let me use it.

#18

this exactly was what i wanted, ty brother.

#19

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.