JavaScript ile yazdığım ilk oyunlarım
Merhaba, ben Servet. Size ilk oyunlarımı yazarken kazandığım tecrübelerimi anlatacağım.
Oyun yapmayı öğrenmeye 2021 yılının sömestr tatilinde başladım. Aslında bundan önce de oyun yapma denemelerim oldu. Ancak onlar Unity ile değil de JavaScript ile yaptığım oyunlar. Oyun programlamayı çok istiyordum ve JavaScript de bildiğim için sadece HTML canvas kullanarak ilk oyunlarımı yaptım. Aslında bu oyunlar zaten var olan oyunlardı. İzlediğim bir YouTube videosunda Bilgem Çakır bu basit oyunları yaparak oyun programlamanın temelini öğrenilebileceğini söylemişti. Ben de ilk başta bir yılan oyunu yapmaya çalıştım.
Yılan Oyunu
Bir yılan oyunu bile yazmak bana çok zor gelmişti. Şimdi ne kadar uğraştığımı hatırlamıyorum ama birçok kez sil baştan yapmayı denemiştim. En sonunda çalışan bugsız bir yılan oyunu yapmayı başarmıştım. Yaptığım oyunları bir site üzerinde paylaşıp arkadaşlarıma oynatırdım. Buradan yazdığım yılan oyununa ulaşabilirsiniz.
Bu oyunu yaparken öğrendiğim en önemli bilgi FPS kontrolüydü. FPS yani “frame per second”. Diğer bi deyişle bir saniyede ekranın yenilenme sayısı. FPS’i uygulamayı kolaylıkla anlamıştım ancak sadece sabit bir değer olarak atayabiliyordum. Hâlâ daha sabit bir değer olmadan nasıl FPS üreteceğimi bilmiyorum ki şimdilerde Unity kullandığım için buna gerek yok.
Bir de FPS’i artırınca oyunun hızında bir değişiklik olmaması gerekiyor. Bunu da sağlamak için yılan hızını FPS’e böldüm ve böylece FPS ne kadar artarsa artsın yılanın hızında bir değişiklik olmayacaktı.
Her karede (saniyede FPS kadar) yılan kendi hızı kadar ilerleyeceği için onu FPS ile çarpmalıyız ki FPS ne kadar farklı olursa olsun yılanın 1 saniye içinde gittiği yol hep aynı olsun.
Yılan oyununu yapmayı başarınca hemen farklı oyunlara yönelmek istedim. Sıradaki oyunumuz Tetris.
Tetris Oyunu
Tetris için yaklaşık 2 hafta harcadığımı hatırlıyorum. Halbuki ne kadar basit bir oyun. 2D arrayler ile ilk defa bu kadar haşır neşir olmuştum ve onları kontrol etmek çok zor geliyordu. İnternetten hazır aldığım sprite sheetleri kullandım.
Sprite sheet mantığını anlamıştım ve çok mantıklı gelmişti. Birçok görsel yerine tek bir görsel kullanarak tüm parçalara kolaylıkla ulaşmak çok pratikti.
Tetris oyununda en çok zorlandığım kısım belli bir karenin o an dolu olup olmadığını anlamaktı. Ki bu kısımda bol bol 2D array kullanmak gerekiyordu.
Solda görüldüğü gibi kare olan indexlere 1, boş olan indexlere ise 0 atadım. Böylece bir karenin boş olup olmadığını bilebilecektim. Ancak 2D arrayin yönlerini karıştırdım. y koordinatlarını x gibi, x koordinatlarını alıyormuşum hep. Bunu çok sonradan fark ettim. Array sorununu çözünce geriye bir şey kalmamıştı.
Aslında şu an bile oyunda biraz bug var. Sağ ve ya solda olunca bazen döndüremiyoruz. Aslında bu olması gereken bir şey ama dönmesi gereken yerlerde var ve oyunu oynarken çok sinir bozucu olabiliyor.
Tetris oyunu çok zamanımı almasına rağmen 2D arrayleri kullanma konusunda bana çok şey öğretti.
Tetris oyununa buradan , kodlara ise buradan ulaşabilirsiniz.
Multiplayer Machine Game
Adını hala sevmediğim ama kendisini çok sevdiğim oyun. Tetris ve Snake’ten sonra artık daha eğlenceli, hatta arkadaşlarımla oynayabileceğim bir oyun yapmaya karar verdim. 80'li 90'lı yılların pixel art oyunları çok hoşuma gidiyordu ve ona benzer bir oyun yapmayı düşündüm.
İşte karakterimiz burada. Yapması yaklaşık 1 dakika sürse de daha iyi bir “makine” olamazdı. Adına neden makine dediğimi hâlâ bilmiyorum 😅
Makinemizin özellikleri hareket etmek ve ateş etmek. Oyun alanından da bahsetmek gerekirse 1920x1080 bir dikdörtgen, bu sınırları aşamıyoruz. Her makinenin belli bir canı var ve mermi yedikçe canımız düşüyor.
Socket.io… Öğrenebilmek için günlerimi verdim. Socket.io hakkında tek izlediğim video buydu ve bu videodan sadece temelini öğrendim. express.js gibi frameworkler kullanarak server kurdum. Ben normalde oyunlarımı bir site üzerinde yayınlamak için Netflify kullanıyordum. Ancak Netlify express.js ile çalışmıyormuş. Ben de Github Student Pack’im olduğu için Heroku kullanmaya karar verdim.
Daire, oyuncunun menzilini gösteriyor. Bu menzil para biriktirilerek artırılabilir. Para birikmesi için de diğer oyunculara lazer isabet ettirmek gerekiyor.
Aynı şekilde lazer sayısı da artırılabilir.
Oyuncuların birbiriyle konuşabileceği bir mesajlaşma yeri de ekledim. Bir database’e gerek duymadan mesajlaşmayı da direkt olarak socket.io ile yazdım.
Bu oyunu arkadaşlarımla keyifle oynadık. Hele 10–15 kişi olunca çok daha eğlenceli oluyor. Hâlâ serverla alakalı bir takım sorunlar var ama yine de oynanabilir bir oyun oldu. Buradan bakabilirsiniz.
Genel olarak ilk oyun tecrübelerim bu şekildeydi. Sorularınız olursa bana instagramdan ulaşabilirsiniz.
Yakın yeni çıkardığım mobil oyun için de bir blog yazmayı düşünüyorum.
