플립북을 활용한 Roblox UI 이펙트

ParticleEmitter는 3D 월드에 표시되지만, 보상, 버튼, 배지는 ScreenGui에 표시됩니다. 같은 플립북 PNG도 여기서 재생할 수 있습니다. ImageLabel은 한 번에 프레임 하나를 표시하며, ImageRectSize(프레임의 픽셀 크기)와 ImageRectOffset(왼쪽 위를 기준으로 한 프레임의 시작 위치)을 사용하고, LocalScript가 프레임을 넘깁니다.

인터페이스용 이펙트

업적 달성퀘스트 완료희귀도 프레임보상 받기 버튼알림 배지 팝업재사용 대기 완료탭 글리터 리플신규 아이템 반짝임

ImageLabel에서 플립북 재생하기

프레임은 왼쪽 위부터 행 단위로 재생됩니다. 격자와 텍스처 크기는 파일 이름에 표시됩니다(기본적으로 -roblox-8x8.png는 1024 px 텍스처에 8x8 프레임입니다). 재생 시간은 이펙트 페이지의 Lifetime입니다.

-- LocalScript inside an ImageLabel
local RunService = game:GetService("RunService")

local label = script.Parent
local GRID, SIZE, SECONDS = 8, 1024, 2.8 -- from the file name and the effect page
local cell = SIZE / GRID

label.Image = "rbxassetid://123456789" -- your uploaded flipbook
label.ImageRectSize = Vector2.new(cell, cell)

local start = os.clock()
RunService.RenderStepped:Connect(function()
	local t = (os.clock() - start) / SECONDS
	local i = math.floor((t % 1) * GRID * GRID)
	label.ImageRectOffset = Vector2.new((i % GRID) * cell, (i // GRID) * cell)
end)

이 코드는 플립북을 무한 반복합니다. 준비된 모델에는 같은 기능을 비롯해 더 많은 기능을 제공하는 ModuleScript UIFlipbook.luau가 포함되어 있습니다. UIFlipbook.play(label, { image, grid, seconds, loop, size, pixelated })는 한 번 재생한 뒤 loop가 false이면 레이블을 숨기고, 픽셀 아트에 Pixelated 리샘플링 모드를 설정하며, stop() 함수를 반환합니다.

원하는 모양으로 조정하기

• 레이블을 정사각형으로 유지하세요. 각 프레임은 정사각형 셀입니다. ImageLabel에 AspectRatio가 1인 UIAspectRatioConstraint를 추가해 프레임이 늘어나지 않도록 하고, BackgroundTransparency를 1로 설정하세요.
• 와이드 배너: 높이보다 너비가 긴 이펙트는 정사각형 셀 안에 맞춰지므로, 와이드 배너는 셀의 일부만 사용합니다. 스튜디오에서 내보낼 때 4x4 또는 2x2 격자를 선택하면 프레임마다 256 또는 512 px를 사용할 수 있습니다.
• 글로우: ImageLabel은 PNG를 일반 이미지처럼 표시합니다. 월드에서 LightEmission 1을 설정했을 때처럼 빛이 추가되지는 않습니다. 발광 이펙트는 어두운 패널 위에서 가장 잘 보입니다.
• 픽셀 아트: ImageLabel의 ResampleMode를 Pixelated로 설정하면 크기를 조정해도 픽셀 이펙트가 선명하게 유지됩니다.
• 월드에서 사용: 같은 스크립트를 BillboardGui의 ImageLabel(NPC나 펫 위의 아이콘) 또는 SurfaceGui의 ImageLabel(Part에 붙은 표지판이나 화면)에서도 사용할 수 있습니다.

플립북 PNG는 무료입니다. 각 이펙트 페이지의 ROBLOX 버튼은 계정 없이 사용할 수 있고, 무료 계정으로 스튜디오에서 원하는 그리드와 텍스처 크기를 선택해 내보낼 수도 있습니다(하루 3개 이펙트). 이미터가 설정되어 있고 재생 스크립트가 포함된 .rbxmx 준비 모델과 UI용 UIFlipbook.luau는 월 $7.99부터 모든 플랜에서 제공됩니다.