How is this effect achieved?

What they did here is tweened a frame's scale back and forth in response to a mouse-over event so that the text it contains goes outside of the fram (isn't visible) when the mouse isn't on the image. Here's an example:

local plr = game:GetService("Players").LocalPlayer

local text = "Test"
local textSize = 50

--Create GUI elements (Not important for the example)
local screen = Instance.new("ScreenGui", plr.PlayerGui)

local mainFrame = Instance.new("Frame", screen)
mainFrame.Position = UDim2.new(.5,0,.5,0)
mainFrame.BackgroundColor3 = Color3.new(1,0,0);

local textElement = Instance.new("TextBox", mainFrame)
textElement.Text = text
textElement.TextSize = textSize
textElement.Position = UDim2.new(0, textElement.TextBounds.Y, 0, 0)
textElement.Size = UDim2.new(0, textElement.TextBounds.X, 0,  textElement.TextBounds.Y)



--Important stuff down here!
local mainFrameSelectedSize = UDim2.new(0, textElement.TextBounds.Y + textElement.TextBounds.X, 0, textElement.TextBounds.Y)
local mainFrameUnselectedSize = UDim2.new(0, textElement.TextBounds.Y, 0, textElement.TextBounds.Y)

mainFrame.ClipsDescendants = true --IMPORTANT - this lets the frame "clip" the text, so that it's not visible.

local imgFrame = Instance.new("Frame", mainFrame)
imgFrame.Size = UDim2.new(0, textElement.TextBounds.Y, 0, textElement.TextBounds.Y);

mainFrame.Size = mainFrameUnselectedSize

imgFrame.MouseEnter:Connect(function()
    mainFrame:TweenSize(mainFrameSelectedSize, nil, nil, .25, true)
end)

imgFrame.MouseLeave:Connect(function()
    mainFrame:TweenSize(mainFrameUnselectedSize, nil, nil, .25, true)
end)

As you can see, all this code does is switch a containing frame between two states - one where it's big enough for the text to be visible, and one where it shrinks to only contain the image frame. I sized all of the elements off of the text element, but the concept stays the same no matter what you decide to actually size each element as. Notice that ClipDecentants has to be set to true on the frame that contains the image and text - this is what actually lets the main frame cut off the text.

I'm pretty sure they used a UI Gradient and messed around with the transparency and offset of it.