Tutorial Membuat Efek Hujan Realistis & Anti Tembus Atap di Roblox Studio

Efek cuaca dinamis—terutama hujan lebat dengan kabut tebal dan kilatan petir—adalah salah satu cara paling efektif untuk mengubah suasana (atmosphere) game Roblox biasa menjadi pengalaman bermain yang hidup, dramatis, dan sangat imersif.

Namun, fatal ketika mencoba menambahkan hujan: mereka membuat satu Part raksasa yang menutupi seluruh map lalu menempelkan ParticleEmitter di atasnya. Akibatnya? Frame rate (FPS) anjlok drastis, memori bengkak, dan perangkat mobile langsung freeze atau crash. Belum lagi masalah klasik: air hujan tetap menembus atap rumah, jembatan, dan gua!

Gambar 1: Konsep visual efek cuaca hujan atmosferik dengan pencahayaan dinamis dan refleksi lantai basah di Roblox.

Dalam panduan ini, kita akan mempelajari arsitektur sistem cuaca modern di Roblox Studio. Kita akan membahas tuntas:

1. Mengapa sistem hujan wajib berjalan di sisi klien (client-side).
2. Cara membuat partikel hujan dan cipratan (splash) yang bergerak dinamis mengikuti hembusan angin (GlobalWind).
3. Logika Roof Detection via Raycasting agar air hujan otomatis berhenti saat pemain berteduh di dalam bangunan.
4. Menghubungkan atmosfer visual (Lighting) dan audio teredam (muffled sound effect).
5. Skrip Luau siap pakai yang ringan dan modular.

---

1. Masalah Utama Part Hujan Statis vs Solusi "Follow-Camera"

Mengapa part hujan raksasa di workspace adalah ide buruk?

• Overdraw Partikel: Me-render puluhan ribu partikel di area kosong yang bahkan tidak dilihat oleh pemain menyia-nyiakan kapasitas komputasi GPU/CPU.
• Beban Server: Jika partikel atau simulasi cuaca dijalankan di Server Script, server Roblox akan mengalami server tick lag, menyebabkan desinkronisasi dan respon input lambat.

Solusi Modern: Follow-Camera Culling

Daripada membasahi seluruh penjuru dunia game sekaligus, kita hanya perlu menempatkan satu Part kecil transparan (misal berukuran 60x60 stud) yang posisinya selalu melayang di atas kamera pemain aktif (CurrentCamera).

Dengan metode ini:

• Partikel hanya digambar di area pandang lokal pemain.
• Jumlah partikel yang dibutuhkan sangat hemat (cukup 100–300 partikel saja per pemain).
• Efek berjalan mulus di semua perangkat, mulai dari PC gaming hingga smartphone low-end.

---

2. Merancang Handcrafted ParticleEmitter (Hujan & Cipratan)

Sistem hujan yang realistis membutuhkan setidaknya dua elemen visual: tetesan air yang meluncur turun (rain streaks) dan cipratan riak air ketika tetesan tersebut menyentuh tanah (ground splash).

A. Konfigurasi Tetesan Hujan (Rain Emitter)

Buat sebuah Part transparan (Transparency = 1, CanCollide = false, Anchored = true) bernama RainEmitterPart, lalu masukkan ParticleEmitter di dalamnya:

• Texture: Gunakan tekstur garis tetesan air semi-transparan (misal: rbxassetid://243660364 atau custom rain streak PNG).
• Rate: 120 - 250 (sesuaikan dengan intensitas badai yang diinginkan).
• Speed: 60 - 90 (air hujan di dunia nyata jatuh dengan cepat akibat gravitasi).
• Lifetime: 0.5 - 1.2 detik (cukup untuk mencapai tanah dari ketinggian ~30 stud).
• EmissionDirection: Bottom (mengarah ke bawah).
• Acceleration: Vector3.new(0, -60, 0).
• LightEmission: 0.2 (agar partikel sedikit menangkap cahaya ambient saat malam).
• Drag: 1 (agar partikel bereaksi mulus terhadap angin).

💡 Tips Angin Dinamis (GlobalWind): Roblox Studio kini memiliki properti bawaan workspace.GlobalWind. Agar tetesan air hujan jatuh miring secara alami saat ada hembusan angin kencang, Anda cukup mengupdate properti Acceleration atau WindAffects pada ParticleEmitter agar searah dengan vektor GlobalWind.

B. Konfigurasi Cipratan Tanah (Ground Splash)

Tambahkan ParticleEmitter kedua untuk efek cipratan air di permukaan lantai:

• Texture: Tekstur lingkaran riak air (water ripple / ring).
• Speed: 1 - 3.
• Lifetime: 0.2 - 0.3 detik.
• Size: Gunakan NumberSequence dari kecil ke besar (misal: 0.2 ke 1.5) agar cipratan terlihat memuai lalu menghilang.

---

3. Diagram Arsitektur & Deteksi Atap (Raycasting)

Berikut adalah bagan alur kerja sistem hujan terpadu: bagaimana kamera pemain diikuti oleh emitter lokal, bagaimana Raycasting memverifikasi apakah pemain berada di luar atau di bawah naungan atap, serta integrasi audio dan lighting:

Gambar 2: Diagram arsitektur sistem hujan Roblox Studio — perbandingan outdoor vs indoor, kalkulasi Raycast, dan adaptasi audio-visual.

---

4. Mengatasi Masalah "Hujan Tembus Atap" (Roof Detection)

Salah satu keluhan terbesar dalam game Roblox adalah ketika pemain masuk ke dalam rumah kayu atau kedai kopi yang hangat, tetapi air hujan tetap turun membasahi kepala mereka.

Untuk menyelesaikannya, kita memanfaatkan Raycasting.

Cara Kerja:

1. Setiap frame (RenderStepped), skrip menembakkan sinar tak kasat mata (Ray) dari posisi kepala pemain atau kamera vertikal ke arah langit (Vector3.new(0, 100, 0)).
2. Jika ada hembusan angin kencang ke arah timur, kita miringkan sudut Ray berlawanan dengan arah angin agar memperhitungkan hujan yang masuk lewat celah balkon.
3. Kita memasukkan karakter pemain ke dalam RaycastParams.FilterDescendantsInstances (tipe Exclude) agar tubuh pemain tidak dianggap sebagai atap.
4. Kondisi:
   • Raycast mengenai part atap / ceiling (hit ~= nil): Pemain berada di dalam ruangan. Matikan RainEmitter.Enabled = false dan turunkan volume audio hujan.
   • Raycast tidak membentur apapun (hit == nil): Pemain berada di area terbuka. Aktifkan RainEmitter.Enabled = true dan naikkan volume audio hujan ke level maksimal.

---

5. Menambahkan Suasana Lighting & Efek Suara (Muffled Sound)

Visual yang bagus tidak akan maksimal tanpa audio dan tata cahaya yang mendukung.

Lighting & Clouds

Saat cuaca berubah menjadi hujan lebat:

• Buat transisi halus menggunakan TweenService pada properti Lighting.Atmosphere.Haze dan Lighting.Atmosphere.Density agar pandangan menjadi sedikit berkabut.
• Jika game Anda menggunakan instance Clouds di bawah workspace.Terrain, naikkan Clouds.Density menjadi 0.85 - 0.95 dan ubah Clouds.Color menjadi abu-abu gelap.

Dynamic Indoor Audio (Muffled Effect)

• Masukkan sebuah Sound loop hujan deras ke dalam SoundService.
• Tambahkan instance EqualizerSoundEffect di dalam Sound tersebut.
• Saat pemain berada di Outdoor, setel HighGain = 0 dan Volume = 1.
• Saat pemain melangkah ke Indoor, gunakan TweenService untuk menurunkan HighGain ke -30 (efek teredam seperti suara hujan yang tertahan dinding dan genteng) serta kurangi volume menjadi 0.25.

---

6. Skrip Luau Siap Pakai (LocalScript)

Berikut adalah skrip lengkap yang bisa langsung Anda gunakan. Letakkan skrip ini di dalam sebuah LocalScript di StarterPlayerScripts:

-- LocalScript: RainSystemController
-- Diletakkan di StarterPlayerScripts

local RunService = game:GetService("RunService")
local TweenService = game:GetService("TweenService")
local Workspace = game:GetService("Workspace")
local Players = game:GetService("Players")

local player = Players.LocalPlayer
local camera = Workspace.CurrentCamera

-- 1. Setup Part Emitter Lokal yang Mengikuti Kamera
local rainPart = Instance.new("Part")
rainPart.Name = "LocalRainEmitter"
rainPart.Size = Vector3.new(70, 2, 70)
rainPart.Transparency = 1
rainPart.CanCollide = false
rainPart.CanTouch = false
rainPart.CanQuery = false
rainPart.CastShadow = false
rainPart.Anchored = true
rainPart.Parent = Workspace

-- 2. Menambahkan ParticleEmitter Hujan
local rainEmitter = Instance.new("ParticleEmitter")
rainEmitter.Name = "RainDrops"
rainEmitter.Texture = "rbxassetid://243660364" -- Ganti dengan Asset ID tekstur hujan Anda
rainEmitter.Rate = 180
rainEmitter.Speed = NumberRange.new(70, 85)
rainEmitter.Lifetime = NumberRange.new(0.6, 0.9)
rainEmitter.EmissionDirection = Enum.NormalId.Bottom
rainEmitter.Size = NumberSequence.new({
    NumberSequenceKeypoint.new(0, 0.15),
    NumberSequenceKeypoint.new(1, 2)    
})
rainEmitter.Transparency = NumberSequence.new({
    NumberSequenceKeypoint.new(0, 0.3),
    NumberSequenceKeypoint.new(1, 0.8)
})
rainEmitter.Acceleration = Vector3.new(0, -70, 0)
rainEmitter.LightEmission = 0.2
rainEmitter.Enabled = true
rainEmitter.Parent = rainPart

-- 3. Konfigurasi Raycast untuk Deteksi Atap
local raycastParams = RaycastParams.new()
raycastParams.FilterType = Enum.RaycastFilterType.Exclude
raycastParams.IgnoreWater = true

-- Perbarui daftar filter saat karakter spawn
local function updateFilterList()
    local ignoreList = {rainPart}
    if player.Character then
        table.insert(ignoreList, player.Character)
    end
    raycastParams.FilterDescendantsInstances = ignoreList
end

player.CharacterAdded:Connect(updateFilterList)
updateFilterList()

-- Ketinggian part di atas kamera
local HEIGHT_OFFSET = 35
local RAY_DISTANCE = 120

-- 4. Main Update Loop (RenderStepped)
RunService.RenderStepped:Connect(function(deltaTime)
    local cameraPos = camera.CFrame.Position
    
    -- Posisikan Part Emitter selalu di atas kepala kamera
    rainPart.CFrame = CFrame.new(cameraPos.X, cameraPos.Y + HEIGHT_OFFSET, cameraPos.Z)
    
    -- Menghitung vektor kemiringan angin (GlobalWind)
    local wind = Workspace.GlobalWind
    rainEmitter.Acceleration = Vector3.new(wind.X * 1.5, -70, wind.Z * 1.5)
    
    -- Tembakkan Ray ke arah atas untuk cek atap
    -- Menghitung arah terbalik angin jika ada hembusan kuat
    local rayDirection = Vector3.new(0, RAY_DISTANCE, 0)
    local rayResult = Workspace:Raycast(cameraPos, rayDirection, raycastParams)
    
    if rayResult then
        -- Ada atap/penghalang di atas pemain (Indoor)
        if rainEmitter.Enabled then
            rainEmitter.Enabled = false
        end
    else
        -- Langit terbuka (Outdoor)
        if not rainEmitter.Enabled then
            rainEmitter.Enabled = true
        end
    end
end)

---

7. Optimasi Tambahan untuk Mobile & Low-End Devices

Untuk memastikan game Anda tetap dapat dimainkan oleh jutaan pemain Roblox yang menggunakan smartphone:

1. Gunakan UserGameSettings.SavedQualityLevel: Anda dapat membaca tingkat kualitas grafis pemain melalui UserSettings():GetService("UserGameSettings"). Jika pemain mengatur slider grafis di bawah level 3, turunkan properti Rate partikel dari 180 menjadi 60.
2. Hindari Physics Collision pada Partikel: Pastikan tidak mengaktifkan simulasi fisika benturan (CollisionMode) pada ParticleEmitter, karena ini membebani perhitungan CPU secara masif.
3. Culling Suara: Nonaktifkan audio hujan jika posisi pemain berada sangat jauh di dalam dungeon atau gua bawah tanah tanpa bukaan udara.

---

Kesimpulan

Membangun sistem cuaca hujan yang imersif dan optimal di Roblox Studio tidak harus rumit atau membuat game menjadi lag. Dengan memindahkan kalkulasi ke sisi klien (client-side follow-camera), mengintegrasikan GlobalWind, dan menerapkan Raycast Roof Detection, Anda mendapatkan efek cuaca kelas konsol yang tetap ramah untuk semua jenis perangkat.

Selamat mencoba dan mengaplikasikannya ke dalam proyek game Anda!

---

Butuh Jasa Custom Roblox Game Development?

Di Rizani Digital Tech, kami siap membantu merealisasikan visi game Anda secara profesional.

Tertarik bekerja sama? Hubungi kami langsung melalui kontak WhatsApp di +6283892678609 atau melalui transaksi aman dan bergaransi via Fastwork Escrow!