Bloga Geri Dön
Tutorial3 dk. okuma

Özel FiveM Yükleme Ekranı: Adım Adım Kendinizinkini Oluşturun

HTML, CSS ve video ile özel bir FiveM yükleme ekranı oluşturun. İlk izlenimi güçlendirmek için müzik, kurallar, sunucu bilgileri ve profesyonel ipuçları.

Agency Scripts

Agency Scripts Kurucusu ve Baş Geliştiricisi

Özel Yükleme Ekranları Neden Önemlidir?

Yükleme ekranı, oyuncuların FiveM sunucunuza bağlanırken gördükleri ilk şeydir; bu da daha oyun başlamadan önce beklentileri belirleme ve marka kimliği oluşturma fırsatınızdır. Profesyonel bir yükleme ekranı sunucunuzun iyi bakıldığını ve kalite konusunda ciddi olduğunu gösterirken, varsayılan yükleme ekranı veya kötü tasarlanmış özel bir ekran detaylara özen gösterilmediğini düşündürür. Estetiğin ötesinde yükleme ekranları; uzun sürebilen bir bağlantı sürecinde oyuncuları bilgilendiren sunucu kurallarını, yama notlarını, topluluk bağlantılarını ve yükleme ilerleme bilgilerini görüntüleyerek pratik amaçlara da hizmet eder. Çok miktarda özel içeriğe sahip sunucularda yükleme süreleri birkaç dakikayı bulabilir, bu da yükleme ekranı deneyimini ilk bağlantı sırasında oyuncuları elde tutmak açısından özellikle önemli kılar.

HTML, CSS ve JavaScript ile Geliştirme

FiveM yükleme ekranları, NUI tarayıcı motoru tarafından işlenen standart web sayfalarıdır; yani bunları herhangi bir web sitesi için kullanacağınız HTML, CSS ve JavaScript ile oluşturursunuz. Şu dosyayı içeren yeni bir resource klasörü oluşturun: index.html giriş noktası olarak dosya, stil için bir CSS dosyası ve isteğe bağlı olarak etkileşimli öğeler için JavaScript. Yükleme ekranı resource'u özel bir loadscreen yönergesi şunun içinde: fxmanifest.lua normal ui_page bildirimi yerine. HTML içeriğiniz görseller, videolar, animasyonlar ve istediğiniz her türlü web içeriğini içerebilir, ancak yükleme ekranı internet bağlantısı kurulmadan önce yüklendiğinden tüm varlıkların resource içinde yerel olarak bulunması gerektiğini unutmayın. Oyuncular çok çeşitli monitör yapılandırmalarından bağlandığı için tasarımınızın farklı ekran çözünürlüklerinde ve en boy oranlarında iyi görünmesini sağlamak adına duyarlı (responsive) CSS kullanın.

Müzik ve Ses Ekleme

Arka plan müziği, yükleme deneyimini statik bir beklemeden sunucunuza atmosferik bir girişe dönüştürür. HTML5 audio yükleme ekranı görünür görünmez başlayan müzikleri oynatmak için autoplay ve loop özniteliklerine sahip öğe. Yükleme sırasında sessizliği tercih eden oyuncuların hızla ayarlayabilmesi için bir sessize alma düğmesi veya ses düzeyi kaydırıcısı ekleyin. Dikkat dağıtıcı veya rahatsız edici olmadan sunucunuzun temasına ve atmosferine uyan müzikler seçin. Telifsiz müzik kütüphaneleri, yükleme ekranları için harika olan bol miktarda ambient, lo-fi ve sinematik parça sunar. Yükleme ekranı ses dosyaları ilk bağlantı sırasında indirilmesi gereken toplam içeriğe eklendiğinden, MP3 veya OGG gibi sıkıştırılmış formatları orta düzeyde bit hızlarında kullanarak ses dosyası boyutlarını makul tutun. Her bağlantıda rastgele dönen birden fazla parça, geri dönen oyuncular için deneyimi taze tutar.

İlerleme Çubukları ve Sunucu Bilgileri

FiveM, yükleme ekranınızın gerçek yükleme ilerlemesini göstermesini sağlayan JavaScript handler'ları sunar. İlgili window.addEventListener('message'...) handler; indirilen dosya sayısı, yüklenecek toplam dosya sayısı ve o anda yüklenen resource'un adı dahil olmak üzere yükleme durumu verilerini içeren event'leri alır. Oyunculara yükleme sürecinin tam olarak neresinde olduklarını gösteren bir ilerleme çubuğu, yüzde sayacı veya resource listesi oluşturmak için bu verileri kullanın. Yükleme ilerlemesinin ötesinde: oyuncu sayısı, Discord davet bağlantısı, sunucu kuralları özeti, son güncellemeler ve yetkili iletişim bilgileri gibi faydalı sunucu bilgilerini gösterin. Bazı sunucular, yükleme sırasında dönen ekran görüntüleri veya tanıtım görsellerinden oluşan bir slayt gösterisi sunarak görsel deneyimi ilgi çekici tutar. Canlı saat, rastgele ipuçları veya yükleme bilgi yarışması gibi dinamik öğeler, daha uzun yükleme sürelerinde oyuncuların ilgilenebileceği içerikler sunar.

Optimizasyon ve En İyi Uygulamalar

Loading screen performansı önemlidir çünkü diğer tüm sunucu içerikleriyle birlikte yüklenir ve ağır bir loading screen bağlantı sürecini yavaşlatabilir. Görselleri makul dosya boyutlarına sıkıştırarak ve desteklenen yerlerde WebP gibi modern formatlar kullanarak optimize edin. Yüksek oranda sıkıştırılmadıkça arka plan olarak büyük video dosyaları eklemekten kaçının, çünkü aynı anda indirilen sunucu kaynaklarıyla bant genişliği için yarışırlar. Animasyonların düşük segment sistemlerde sorunsuz çalıştığından emin olmak için loading screen'inizi farklı donanım yapılandırmalarında test edin. Toplam loading screen kaynak boyutunu mümkünse 10 MB'ın altında tutun, 5 MB veya daha azı idealdir. Donmuş gibi gösteren ilerleme öğelerinden kaçınarak tasarımınızın son derece uzun yükleme süreleri gibi istisnai durumları sorunsuz yönetmesini sağlayın ve beklenenden uzun sürerse oyunculara yükleme sürecinin hala aktif olduğunu belirten bir mesaj eklemeyi düşünün.

Eşleşen script

Sunucunuz için hazır, güncellemeler dahil.

Başlamaya Hazır mısınız?

Scriptleri mağazamızdan edinin veya destek, güncellemeler ve gelecek yeniliklere göz atmak için Discord'a katılın.