“Verlet, Fransa’daki Verlet bölgesinden geliyorsa Verlet’tir; değilse sadece köpüklü Euler’dir” şakası harika
Web geliştirme, Gradle ve Java bilgisinden böyle bir şeyi yapma aşamasına nasıl geçildiğini merak ediyorum
Bilgisayar bilimi lisansı okumadığım için, ne kadar programlama dili öğrenirsem öğreneyim böyle şeyleri asla anlayamayacakmışım gibi hissettiğim oluyor. OPENLY, LIBGDX, GODOT ve Unity ile biraz uğraştım ama kumaş simülasyonunu sıfırdan yapmak gerçekten göz korkutucu
Düşündüğünden çok daha basit. Bu başlığın başka bir yerinde bağlantısı verilen “yırtılan kumaş” demosunu, yazılım mühendisi kariyerime başlamadan önce yapmıştım
Burada temel Verlet integrasyonu kullanılıyor: Bir ızgarayı oluşturan 2D vektörler, mevcut konum ve önceki konuma göre güncelleniyor; hemen komşu noktalarla belirli bir mesafeyi koruyacak şekilde kısıtlanıyor. O noktaların arasına çizgi çekince kumaş oluyor. Fizik simülasyonlarına kapılıp araştırırken, uygulanması en kolay şeylerden biri olduğu için ilk onunla karşılaşmıştım; harcanan emeğe göre sonuç çok iyiydi. Tabii sonrası çok daha karmaşıklaşıyor
Fizik simülasyonu öğrenmek istediğimde benzer şekilde hissetmiştim. Zamanla, fizik gibi bilgi alanları ile bunları uygulamak için kullanılan programlama araçlarını ayrı düşünmek gerektiğini öğrendim
Özellikle oyun geliştirmeyle başlayınca, katı cisim, kumaş, yay, akışkan gibi başlıca simülasyonların her biri için doğal ve idiomatik bir programlama yolu varmış gibi geliyor. Başta akışkan simülasyonunun da bir ızgara oluşturup her zaman adımında güncelleme kuralları seçmek gibi, dilin içinde doğal biçimde ifade edileceğini sanmıştım. Ama gerçekte olan, problemi matematik ve fizikle modelleyip sonra bunu dile ve araçlara eşlemek; o araçlar da bunu her zaman idiomatik biçimde ifade etmeyebiliyor
Parçacık konumları ve yay tabanlı kumaş simülasyonu gibi kolayca koda aktarılabilen algoritmalar var, ama daha ileri gitmeye çalıştığımda bu bende tersine yanlış bir izlenim yarattı. Sonuçta fiziğe ve sayısal analize daha derin girmem, ardından problemi koda dökmem gerekti; ortaya çıkan kod da kaba ve bol sihirli sayılı olabiliyor
Web geliştirme Java ile sınırlı değildir ve genellikle bileşen entegrasyonu sorunları baskındır. Çok yapı, az içerik vardır; hesaplama kütüphanelere devredilir, derleme zamanında entegrasyon karmaşıklığı, çalışma zamanında ise dağıtık sistem ölçeği sorun olur
Buna karşılık simülasyon yazmak hesaplama ağırlıklıdır, bu yüzden kodun büyük kısmı gerçekten içeriktir. Web geliştirme heterojen şeylerin birleşimiyse, simülasyon daha homojendir. Sorun, saniyedeki kare sayısının belirlediği zaman bütçesi içinde tek süreç performansıyla sınırlı olmaktır
Bu yüzden tek bir çalışma ortamına odaklanabilirsiniz. Dağıtım sorununu çözen tarayıcıyı öneririm. Ganja[1] muhtemelen “yapı değil içerik” tarafına yakın, nihai simülasyon projesi olabilir. Çok sıra dışı ve anlaşılması zor olduğu için bakımı durmuş, ama çalışıyor. Biraz daha yapılandırılmış tarafta D3 var; yazarları kuvvet tabanlı grafikler[2] gibi güncel görselleştirme/yerleşim algoritmalarını zaten hazırlamış. Daha tanıdık bir başlangıç noktası Processing[3] ailesi olabilir; Java’da başlayıp Python ve JavaScript gibi dillere taşındı
Yine de tek bir kumaş simülasyonu, oyun motoru benzetmesiyle bir farenin tek bir hücresi düzeyinde kalır. Oyun motorları çok büyüktür ve orada da doğrudan simülasyon yazmaktan çok, birçok iç entegrasyon yaparsınız
1 - https://github.com/enkimute/ganja.js/blob/master/ganja.js
2 - https://github.com/d3/d3-force/tree/main/src
3 - https://processing.org/
Sonuçta hepsi matematik ve fizik
Özellikle oyun geliştirmeyi sormadın, ama grafik, matematik, aydınlatma ve fizik gibi bilgiler genellikle o alana epey yayılmış durumda. Kumaş simülasyonu gibi niş bir konuyu tek başına aramaya çalışırsan, oyun geliştirme kaynaklarıyla bağlantılı olmayan bilgi bulmak zor olabilir
Bugün https://alextardif.com/LearningGraphics.html okudum; birçok yönde yol gösterici olabilir. https://learnopengl.com/ Vulkan, Metal, DX12 gibi daha yeni API’lerin olduğu bugün bile düzenli olarak iyi değerlendiriliyor. Yine de API’yi çözülecek problemin yaklaşık %5’i olarak görmek gerek. Açıkçası daha az bile olabilir, ama Vulkan duyduğumdan da daha ağır
C/C++ öğrenmek istemiyorsan WebGL topluluğu büyük; ilgili subreddit’lerden veya forumlardan başlayabilirsin. Yine de API ve platform, asıl fizik simülasyonu denen etkileyici ve yeni kısmı saran bir kabuk gibi
Kaynağımı eklemek gerekirse: Web geliştirme/Gradle/Java geliştiricisiyim ve birkaç yıl önceki denemeden sonra boş zamanlarımda yeniden bir oyun motoru yapıyorum
O kadar zor değil. JavaScript’te her noktayı (x,y,z) olarak temsil edip bir kütle verirsin; sonra her karede yerçekimini uygular, gerekirse biraz gürültü eklersin
Parçacık her hareket etmeye çalıştığında, kuvveti trigonometriyle kenarlar üzerinden diğer noktalara aktarırsın ve kontrolden çıkmaması için biraz sönümleme eklersin. Kütle, sonrasında her noktanın kuvvetlerden ne kadar etkileneceğini belirler. 3D gözünü korkutuyorsa önce 2D ile başlayabilirsin
Videoda yeterince vurgulanmayan nokta, kumaşın işlevsel bir amaca da sahip olması. Kumaş, düşmanın formunu gizleyerek modeli ayırt etmeyi zorlaştırıyor
FromSoft oyunlarının belki de en yenilikçi yönlerinden biri olan hassas hitbox mantığı ve yakın dövüşün merkezde olduğu bir oyunda, serbestçe akan kumaş yüzünden saldırıyı tutturmak için karaktere ne kadar yaklaşmanız gerektiğini ya da isabet almamak için ne kadar uzak durmanız gerektiğini kestirmek zorlaşıyor. Buna öngörmesi zor hareketler ve saldırı kalıpları da eklenince zorluk daha da artıyor ve her dövüş kendine özgü hâle geliyor
Gerçek dünyada da kumaş aynı özelliğe sahip. Cübbe ya da pelerin giymiş bir düşman çok daha tehditkâr ve başa çıkması zor olur
Oynanış döngüsü nedeniyle kişisel olarak FromSoft oyunlarından keyif almıyorum, ama tasarım açısından tarihin en iyi yapılmış video oyunlarından bazıları olduklarını düşünüyorum
Benim 14 yıl önce yaptığım bir sürüm de var: https://www.youtube.com/watch?v=G05M_Y6NQVM
Bu temel yapının uygulanmasının çok basit olduğuna ve sonucun gerçekten harika göründüğüne katılıyorum
Onu ben yaptım. Codepen’e koyduğum özgün sürüm yaklaşık 13 yıl önceydi
Ben de inanamıyorum; ama ilk programlama işimi almadan önce olduğunu düşününce gerçekten çok eski geliyor
2000 yapımı Hitman oyununda da kumaş vardı, 2008 yapımı Mirror's Edge’de ise yırtılabilen kumaş vardı. Muhtemelen ikisi de ilk değildi
Bu tür kumaş simülatörleri bana hep bir ölçüde kararsız geliyor. Grid kumaş oluşturunca zıplamaya ve rastgele hareket etmeye başlıyor
Bunun IEEE 754 kayan nokta hatalarının birikmesinden mi kaynaklandığını merak ediyorum
Fizik simülasyonu ya da oyun motoru bağlamında sayısal integrasyon konusuna bakmak iyi olur. Başlangıç noktası olarak https://en.wikipedia.org/wiki/Numerical_methods_for_ordinary... görülebilir
Anladığım kadarıyla mesele yalnızca basit kayan nokta hatası değil; sürekli fonksiyonları basit ayrık adımlarla yaklaşık olarak temsil etmenin doğasından kaynaklanıyor. Bağlantı verilen Vikipedi maddesinde de büyük adımlarda, kayan nokta hassasiyeti sorun olmaya başlamadan çok önce hataların biriktiğini gösteren bir grafik var
Farklı sayısal integrasyon tekniklerinin farklı ödünleşimleri var. Euler yöntemi, Verlet, Runge-Kutta gibi yöntemler var; bazı yöntemler toplam enerjinin birikmesine eğilimliyken bazıları enerjinin kaybolmasına eğilimli, ikisi de yanlış davranış. Daha karmaşık yöntemler biraz daha iyi çalışma eğiliminde, ancak her adımın karmaşıklaşmasından elde edilen kazancın, daha basit ve hızlı bir algoritmayı daha çok yinelemekten iyi olup olmadığını tartmak gerekiyor
Fizik simülasyonunda enerji korunumu, açıkça kodlanmadıkça varsayılan olarak işlemez. Örneğin periyodik olarak doğrudan düzeltme yapmak gerekir
Nedeni yalnızca yuvarlama hataları değil; zamanın kuantalanması ve matematiksel modelin kendisinden gelen başka küçük hatalar da var
Hata sönümleme yönündeyse, gerçek hayattaki gibi enerji dağılır ve hareket sonunda durur; ivmelenme yönündeyse simülasyon kontrolden çıkar
Bu sitenin yazarına iyi iş çıkardığını söylemek isterim. Harici JavaScript olmadan olduğu gibi çalışıyor ve mobilde de işliyor
Günümüzde metin tabanlı web sitelerinin çoğu için bunu söylemek zor
Gerçekten etkileyici bir çalışma. Basit ama kendini izlettiriyor ve Verlet integrasyonunun doğal ve inandırıcı bir kumaş simülasyonu üretmekte ne kadar güçlü olduğunu iyi gösteriyor
İlginizi çekerse Hitman oyun motorundan çıkan Jakobsen makalesini de öneririm. Klasik bir kaynaktır
Bu tür şeylerin nasıl çalıştığına dair gerçekten zor sorular sorulduğunu görmek güzel. Her şeyin yıllar boyunca biriken sayısız küçük adımdan oluştuğu hissini bana her seferinde veriyor
Matematiğin duvar gibi hissettirdiği noktaya çarpıp çarpmadığını, yoksa anlayana kadar vurmaya devam edip etmediğini merak ediyorum
Sadece birkaç parametre ve kısıt ayarlayınca bu kadar gerçekçi hareketlerin ortaya çıkması en ilginç tarafı
Belki de çevremizdeki dünya da yalnızca gizli modeller ve kuvvetler kümesidir; bizim işimiz de onları keşfedip simüle etmektir diye düşündürüyor. Güzel bir çalışma
1 yorum
Hacker News yorumları
Tarayıcıda görülebilecek başka bir örnek: https://oimo.io/works/cloth/
Marian Pekár’ın yazısını okuyup Verlet integrasyonunu anlayarak kendi kumaş simülasyonumu yapabildim: https://pikuma.com/blog/verlet-integration-2d-cloth-physics-...
Web geliştirme, Gradle ve Java bilgisinden böyle bir şeyi yapma aşamasına nasıl geçildiğini merak ediyorum
Bilgisayar bilimi lisansı okumadığım için, ne kadar programlama dili öğrenirsem öğreneyim böyle şeyleri asla anlayamayacakmışım gibi hissettiğim oluyor. OPENLY, LIBGDX, GODOT ve Unity ile biraz uğraştım ama kumaş simülasyonunu sıfırdan yapmak gerçekten göz korkutucu
Burada temel Verlet integrasyonu kullanılıyor: Bir ızgarayı oluşturan 2D vektörler, mevcut konum ve önceki konuma göre güncelleniyor; hemen komşu noktalarla belirli bir mesafeyi koruyacak şekilde kısıtlanıyor. O noktaların arasına çizgi çekince kumaş oluyor. Fizik simülasyonlarına kapılıp araştırırken, uygulanması en kolay şeylerden biri olduğu için ilk onunla karşılaşmıştım; harcanan emeğe göre sonuç çok iyiydi. Tabii sonrası çok daha karmaşıklaşıyor
Özellikle oyun geliştirmeyle başlayınca, katı cisim, kumaş, yay, akışkan gibi başlıca simülasyonların her biri için doğal ve idiomatik bir programlama yolu varmış gibi geliyor. Başta akışkan simülasyonunun da bir ızgara oluşturup her zaman adımında güncelleme kuralları seçmek gibi, dilin içinde doğal biçimde ifade edileceğini sanmıştım. Ama gerçekte olan, problemi matematik ve fizikle modelleyip sonra bunu dile ve araçlara eşlemek; o araçlar da bunu her zaman idiomatik biçimde ifade etmeyebiliyor
Parçacık konumları ve yay tabanlı kumaş simülasyonu gibi kolayca koda aktarılabilen algoritmalar var, ama daha ileri gitmeye çalıştığımda bu bende tersine yanlış bir izlenim yarattı. Sonuçta fiziğe ve sayısal analize daha derin girmem, ardından problemi koda dökmem gerekti; ortaya çıkan kod da kaba ve bol sihirli sayılı olabiliyor
Buna karşılık simülasyon yazmak hesaplama ağırlıklıdır, bu yüzden kodun büyük kısmı gerçekten içeriktir. Web geliştirme heterojen şeylerin birleşimiyse, simülasyon daha homojendir. Sorun, saniyedeki kare sayısının belirlediği zaman bütçesi içinde tek süreç performansıyla sınırlı olmaktır
Bu yüzden tek bir çalışma ortamına odaklanabilirsiniz. Dağıtım sorununu çözen tarayıcıyı öneririm. Ganja[1] muhtemelen “yapı değil içerik” tarafına yakın, nihai simülasyon projesi olabilir. Çok sıra dışı ve anlaşılması zor olduğu için bakımı durmuş, ama çalışıyor. Biraz daha yapılandırılmış tarafta D3 var; yazarları kuvvet tabanlı grafikler[2] gibi güncel görselleştirme/yerleşim algoritmalarını zaten hazırlamış. Daha tanıdık bir başlangıç noktası Processing[3] ailesi olabilir; Java’da başlayıp Python ve JavaScript gibi dillere taşındı
Yine de tek bir kumaş simülasyonu, oyun motoru benzetmesiyle bir farenin tek bir hücresi düzeyinde kalır. Oyun motorları çok büyüktür ve orada da doğrudan simülasyon yazmaktan çok, birçok iç entegrasyon yaparsınız
1 - https://github.com/enkimute/ganja.js/blob/master/ganja.js
2 - https://github.com/d3/d3-force/tree/main/src
3 - https://processing.org/
Özellikle oyun geliştirmeyi sormadın, ama grafik, matematik, aydınlatma ve fizik gibi bilgiler genellikle o alana epey yayılmış durumda. Kumaş simülasyonu gibi niş bir konuyu tek başına aramaya çalışırsan, oyun geliştirme kaynaklarıyla bağlantılı olmayan bilgi bulmak zor olabilir
Bugün https://alextardif.com/LearningGraphics.html okudum; birçok yönde yol gösterici olabilir. https://learnopengl.com/ Vulkan, Metal, DX12 gibi daha yeni API’lerin olduğu bugün bile düzenli olarak iyi değerlendiriliyor. Yine de API’yi çözülecek problemin yaklaşık %5’i olarak görmek gerek. Açıkçası daha az bile olabilir, ama Vulkan duyduğumdan da daha ağır
C/C++ öğrenmek istemiyorsan WebGL topluluğu büyük; ilgili subreddit’lerden veya forumlardan başlayabilirsin. Yine de API ve platform, asıl fizik simülasyonu denen etkileyici ve yeni kısmı saran bir kabuk gibi
Kaynağımı eklemek gerekirse: Web geliştirme/Gradle/Java geliştiricisiyim ve birkaç yıl önceki denemeden sonra boş zamanlarımda yeniden bir oyun motoru yapıyorum
Parçacık her hareket etmeye çalıştığında, kuvveti trigonometriyle kenarlar üzerinden diğer noktalara aktarırsın ve kontrolden çıkmaması için biraz sönümleme eklersin. Kütle, sonrasında her noktanın kuvvetlerden ne kadar etkileneceğini belirler. 3D gözünü korkutuyorsa önce 2D ile başlayabilirsin
Elden Ring’in olağanüstü kumaş tasarımını analiz eden Polygon videosu aklıma geldi: https://youtu.be/wSSqx-Dh6ko
FromSoft oyunlarının belki de en yenilikçi yönlerinden biri olan hassas hitbox mantığı ve yakın dövüşün merkezde olduğu bir oyunda, serbestçe akan kumaş yüzünden saldırıyı tutturmak için karaktere ne kadar yaklaşmanız gerektiğini ya da isabet almamak için ne kadar uzak durmanız gerektiğini kestirmek zorlaşıyor. Buna öngörmesi zor hareketler ve saldırı kalıpları da eklenince zorluk daha da artıyor ve her dövüş kendine özgü hâle geliyor
Gerçek dünyada da kumaş aynı özelliğe sahip. Cübbe ya da pelerin giymiş bir düşman çok daha tehditkâr ve başa çıkması zor olur
Oynanış döngüsü nedeniyle kişisel olarak FromSoft oyunlarından keyif almıyorum, ama tasarım açısından tarihin en iyi yapılmış video oyunlarından bazıları olduklarını düşünüyorum
Bu tür kumaş animasyonlarını hep sevmişimdir. İlk gördüğüm muhtemelen dissimulate’in Codepen’deki yırtılabilen kumaş demosuydu; o kodun 9 yıl önce yazılmış olduğuna inanmak zor
[1] - https://codepen.io/dissimulate/pen/eZxEBO
[2] - https://github.com/Dissimulate/Tearable-Cloth
Bu temel yapının uygulanmasının çok basit olduğuna ve sonucun gerçekten harika göründüğüne katılıyorum
Ben de inanamıyorum; ama ilk programlama işimi almadan önce olduğunu düşününce gerçekten çok eski geliyor
Bu tür kumaş simülatörleri bana hep bir ölçüde kararsız geliyor. Grid kumaş oluşturunca zıplamaya ve rastgele hareket etmeye başlıyor
Bunun IEEE 754 kayan nokta hatalarının birikmesinden mi kaynaklandığını merak ediyorum
Anladığım kadarıyla mesele yalnızca basit kayan nokta hatası değil; sürekli fonksiyonları basit ayrık adımlarla yaklaşık olarak temsil etmenin doğasından kaynaklanıyor. Bağlantı verilen Vikipedi maddesinde de büyük adımlarda, kayan nokta hassasiyeti sorun olmaya başlamadan çok önce hataların biriktiğini gösteren bir grafik var
Farklı sayısal integrasyon tekniklerinin farklı ödünleşimleri var. Euler yöntemi, Verlet, Runge-Kutta gibi yöntemler var; bazı yöntemler toplam enerjinin birikmesine eğilimliyken bazıları enerjinin kaybolmasına eğilimli, ikisi de yanlış davranış. Daha karmaşık yöntemler biraz daha iyi çalışma eğiliminde, ancak her adımın karmaşıklaşmasından elde edilen kazancın, daha basit ve hızlı bir algoritmayı daha çok yinelemekten iyi olup olmadığını tartmak gerekiyor
Nedeni yalnızca yuvarlama hataları değil; zamanın kuantalanması ve matematiksel modelin kendisinden gelen başka küçük hatalar da var
Hata sönümleme yönündeyse, gerçek hayattaki gibi enerji dağılır ve hareket sonunda durur; ivmelenme yönündeyse simülasyon kontrolden çıkar
Bu sitenin yazarına iyi iş çıkardığını söylemek isterim. Harici JavaScript olmadan olduğu gibi çalışıyor ve mobilde de işliyor
Günümüzde metin tabanlı web sitelerinin çoğu için bunu söylemek zor
Gerçekten etkileyici bir çalışma. Basit ama kendini izlettiriyor ve Verlet integrasyonunun doğal ve inandırıcı bir kumaş simülasyonu üretmekte ne kadar güçlü olduğunu iyi gösteriyor
İlginizi çekerse Hitman oyun motorundan çıkan Jakobsen makalesini de öneririm. Klasik bir kaynaktır
Bu tür şeylerin nasıl çalıştığına dair gerçekten zor sorular sorulduğunu görmek güzel. Her şeyin yıllar boyunca biriken sayısız küçük adımdan oluştuğu hissini bana her seferinde veriyor
Matematiğin duvar gibi hissettirdiği noktaya çarpıp çarpmadığını, yoksa anlayana kadar vurmaya devam edip etmediğini merak ediyorum
Sadece birkaç parametre ve kısıt ayarlayınca bu kadar gerçekçi hareketlerin ortaya çıkması en ilginç tarafı
Belki de çevremizdeki dünya da yalnızca gizli modeller ve kuvvetler kümesidir; bizim işimiz de onları keşfedip simüle etmektir diye düşündürüyor. Güzel bir çalışma