Hello three.js community! It’s time for me to share a project for the first time here. Quite some time ago (October 2019, to be precise) I started to work on a prototype to prove myself that web was capable of PS2 / early PS3 graphics.
Spoiler
Of course it was and of course it's even better now.Over time I also used that project as a playground to experiment, learn and test new tools and techniques, this is how I introduced gamepad support; positional audio; bullet hole decals; FBM based volumetric fog and a lot more. Now, I have this thing where I get bored of a project pretty soon, so after several pauses, the one that never ended began in March of 2023. In the last couple of weeks I forced myself to create a video of what I was able to achieve until 03/23 in order to archive this project and move on to something new. This is how it went:
Today this project is considered pretty old, last time three.js version was updated, it was to r0.152.2
, so I’m pretty sure it could look waaay cooler today, especially with a new WebGPU back-end, but still, I would also like to share a list of of features and enhancements in order (of priority) that I wish I had worked on, but I’m now sure I won’t. Just in case someone finds it cool enough to spend some time improving it:
- Use state machines for characters’ behavior; this will fix some animation bugs and make the code less messy and more robust, especially in the
Enemy
class. - Improve or remove FBM based volumetric fog since I’m not sure it’s implemented correctly.
- Move to the newest
three.js
andthree-mesh-bvh
versions. - Add UI health bar and ammo indicators.
- Add player footsteps sounds and background music.
- Add gamepad support which was introduced in the original prototype.
- Add blood particles when hitting an enemy.
- Maybe replace Electron with Tauri.
- Mobile support through PWA or Tauri build.
Thanks to all the community for working on this awesome library, for your support and for answering my dumb questions on this forum.
Cheers!