Terus ke tutorial
TUTORIAL BERGAMBAR · P0

Overlay dan Simulation tanpa perlu LIVE.

Overlay ialah visual yang muncul di atas video OBS apabila event berlaku. Simulation menghantar event ujian supaya anda boleh menyusun saiz, posisi dan animasi dalam OBS sebelum penonton masuk LIVE.

Sebelum mula
  • Jalankan SKFINITY dan OBS pada PC host yang sama untuk URL localhost.
  • Untuk ujian scene routing, pastikan OBS WebSocket sudah connected.
  • Pilih scene ujian atau duplicate scene sebelum LIVE supaya preview production tidak terganggu.
01

Pilih event dalam Simulation

Di sidebar SKFINITY klik Simulation. Pilih kad seperti Chat Events, Like, Gift by Viewers, Follow atau Song Notification. Setiap kad mempunyai Copy Link untuk URL overlay dan Simulate untuk event ujian. Overlay Custom membuka editor template; Hold Sim mengekalkan overlay simulasi semasa menyusun komposisi.

Rekreasi demo Simulation · Akaun, masa dan preview bukan data pengguna sebenar.
02

Copy URL overlay yang tepat

Klik Copy Link pada event yang anda mahu paparkan. SKFINITY membina URL berdasarkan event tersebut dan origin runtime semasa, contohnya http://localhost:3001/tiktok-connector.html?overlay=like_overlay. Jangan taip URL contoh secara manual atau tukar nama parameter overlay. Copy satu URL bagi setiap Browser Source yang berlainan. Pastikan SKFINITY terus berjalan semasa OBS menggunakan URL lokal itu.

URL lokal bukan link web awam

localhost merujuk kepada PC yang menjalankan OBS. Jika OBS berada di PC lain, URL ini tidak automatik menunjuk ke SKFINITY pada PC host; konfigurasi network berasingan diperlukan. Jangan dedahkan local service ke internet semata-mata untuk overlay.

03

Tambah Browser Source dalam OBS

Dalam scene OBS yang ingin menerima overlay, buka panel Sources → + → Browser. Pilih Create new dan beri nama jelas seperti SKFINITY-LIKE; atau pilih Add Existing jika sengaja mahu berkongsi source yang sama antara scene. Pastikan source visible dan tekan OK. Browser Source yang dikongsi boleh memberi kesan pada semua scene yang menggunakan source sama, jadi gunakan source baharu jika URL atau saiznya berbeza.

OBS Studio 31.1.1 · Sources → + → Browser. Paparan versi lain mungkin sedikit berbeza.
04

Paste URL dan tetapkan canvas

Dalam Properties, biarkan Local file tidak dipilih, paste URL daripada Copy Link ke field URL, kemudian set Width dan Height. Contoh OBS menggunakan 800 × 600; pilih ukuran yang sesuai dengan layout anda. Tekan OK, letak source di atas latar/video dalam senarai Sources, dan drag/resize pada OBS preview. Browser Source boleh kelihatan kosong sementara tiada event—itu normal untuk overlay sementara.

Rekreasi demo OBS Properties · URL dan ukuran ialah contoh; gunakan Copy Link sebenar dari SKFINITY.
05

Uji posisi tanpa pergi LIVE

Pastikan scene ujian dipilih dalam OBS, kemudian tekan Simulate pada kad event yang sepadan. Sesetengah event seperti gift, song notification atau special join meminta data contoh dahulu. Lihat OBS preview, betulkan posisi, saiz, z-order dan ruang yang tidak menutup wajah/caption penting. Jika perlu masa lebih panjang untuk menyusun, hidupkan Hold Sim: ON; matikan semula ke OFF untuk menghantar clear kepada overlay simulasi.

HASIL YANG DIJANGKAOverlay ujian muncul pada OBS preview di tempat yang disusun, tanpa TikTok LIVE dan tanpa event penonton sebenar.
06

Customise di Overlay Studio

Buka Overlay Studio atau butang Overlay Custom. Pilih template event seperti Chat, Likes, Follow atau Gift. Hidupkan Enable Custom Template untuk template itu, laraskan canvas, show time, font, animation dan elemen pada Live Preview, kemudian tekan Save Settings. Gunakan Replay Animation untuk semak gerakan. Jika custom template dimatikan, overlay fallback kepada template default; jangan anggap preview yang belum disimpan sudah menjadi setting LIVE.

Rekreasi demo Overlay Studio · Avatar dan nama viewer adalah rekaan.
JIKA HASIL BERBEZA

Diagnosis cepat

Browser Source kosong selepas Simulate +

Semak SKFINITY masih berjalan, URL tidak terpotong, event pada Browser Source sama dengan event yang disimulasikan, dan socket Simulation connected. Cuba Refresh cache of current page dalam OBS Properties selepas URL diperbetulkan.

Overlay muncul tetapi tersorok +

Naikkan Browser Source dalam senarai Sources dan semak ikon mata visible. Source lebih tinggi dalam senarai OBS muncul di atas source lain.

Ukuran salah atau terpotong +

Semak Width/Height viewport Browser Source dan transform pada OBS preview. Saiz 800 × 600 hanyalah contoh, bukan syarat SKFINITY.

Perbezaan OBS versi +

Screenshot diambil/direka berdasarkan OBS 31.1.1. Label atau posisi menu versi lain mungkin berbeza sedikit. Rujuk Browser Source dan Sources Guide rasmi OBS.

SELEPAS VISUAL SIAP

Jadikan event TikTok menukar OBS Scene atau Source secara automatik.

Buka tutorial Event Routing