1.Jika Anda menginginkan sesuatu yang dekat dengan mockup Anda, saya akan menggunakan partikel (Itu tidak harus menjadi sistem partikel sepenuhnya meledak).
Render partikel Anda dalam bentuk poligon pada RenderTexture. Pastikan untuk menggunakan campuran aditif pada partikel. Partikel-partikel di dalam poligon akan saling berbaur dengan lancar sementara partikel di luar akan memberikan tepi lembut yang Anda inginkan. (Contoh efeknya dapat ditonton dalam video youtube ini: Video Partikel Aditif
Sekarang render RenderTexture ke layar utama Anda dan Anda selesai. RenderTexture diperlukan agar partikel tidak menyatu dengan latar belakang Anda.
Anda bisa mencoba meletakkan segitiga langsung ke tekstur partikel dan lihat bagaimana hasilnya. Kalau tidak, render di atas "sup partikel" Anda sebagai lapisan terpisah.
Membuat mockup cepat dalam jsfiddle yang diperbarui yang terlihat seperti ini.
Anda dapat menemukan demo yang diperbarui di sini
2. Setiap partikel memiliki kecepatan dan asal. Ketika pemain Anda menyentuh poligon, Anda mengubah kecepatan setiap partikel sebanding dengan kecepatan pemain. Semakin jauh sebuah partikel menjauh dari pemain Anda, semakin sedikit itu dipengaruhi oleh kecepatan pemain.
Rumus untuk menghitung kecepatan partikel akan menjadi seperti ini:
//player.velocity and particle.velocity are vectors
//k is a factor to enhance or weaken the influence of players velocity
var distanceToPlayer = (player.position - particle.position).length();
particle.velocity = particle.velocity + ((k * player.velocity) + particle.velocity) * (1/distanceToPlayer);
Untuk menghitung posisi partikel Anda menempatkan ini dalam metode pembaruan Anda:
var speedY = -(springConstant * (particle.position.y - particle.origin.y)) - (dampingFactor * particle.velocity.y);
var speedX = -(springConstant * (particle.position.x - particle.origin.x)) - (dampingFactor * particle.velocity.x);
particle.position.y = particle.position.y + speedY;
particle.position.x = particle.position.x + speedX;
particle.velocity.x = particle.velocity.x + speedX;
particle.velocity.y = particle.velocity.y + speedY;
Ini akan memberi Anda "cairan" di mana setiap partikel mengayunkan asalnya ketika pemain mengaduk cairan. SpringConstant mengubah seberapa banyak partikel berayun dari asalnya dan faktor peredam seberapa cepat partikel itu beristirahat. Anda mungkin harus mengubah kode karena versi modifikasi dari simulasi 1d yang saya gunakan dalam permainan saya.
Sekarang dengan demo: Demo.
Hanya men-tweak 3 konstanta di atas sampai cairan berperilaku seperti yang Anda inginkan.