Devlog 2: It’s all a simulation

That’s right, I got physics working! Using the link I saved in the last devlog, I worked out how to use Jolt properly with Three.js. I also built a scene in Blender and set up lighting.

Baking with Blender

To create this simple test scene, I hopped into Blender and spawned in a few different objects. I didn’t want to make anything too fancy as I just wanted to test physics collisions. As I worked on it, I would export to a USD scene and import that into Three. I thought about how game engines normally do lighting and I remembered about baked lighting. It took a while but I made it so dynamic objects with mesh names starting with “D_” will have real-time shadows but static objects (like the floor and floating boxes) will have baked shadows. This means that shadows are much less expensive to render.

Decentralisation

A problem I had with my original code is that it was all in one spaghetti file. I split up the code into different files like input, lighting and physics. These are then called from the main file. This creates more organisation so when I add more features later it doesn’t become impossible to read.

Taking action

I set up input actions to be much easier to work with. A list of actions is set up as a key value pair. I save the keys that are pressed and remove them when released from a separate key value list. I then set it up to create CustomEvents for each keybind. These are then used with EventListeners to send signals to the other parts of code to run.

Deployment issues

I also had a couple issues with my code that caused problems with the deployed site. The first was setting the base in the Vite config to “/FPS-OS/” and not “/fps-os/”. It meant you had to use capital letters in the URL to load the site. The other issue was that the objects were trying to get physics before Jolt had been initialised. It seemed to be a race condition that happened sometimes. Luckily it is fixed now.

What’s next?

Next, of course I need to get player movement working so you can actually walk and jump around.
Then I need to follow the requirements of the WebOS 1 mission. It looks like all I need to do is add draggable windows. This OS isn’t exactly going to have windows though. At least not as they are normally. Also I need to add a welcome screen, “desktop” environment, app shop and toolbelt. And all of those require the main room components to be modelled and textured.

New update released

Go to cookistudios.com/fps-os/ to try out the latest features before I’ve even written devlogs on them. See you later!

Devlog 1: Setting the scene

I started the project by initialising it from Vite using Bun (I would use Deno but Bun is just so fast). I imported Three.js to use for everything 3D and used the default cube scene from the documentation. I also added in the PointerLockControls to let you look around as the camera.

Issues arised

You can’t move yet because I tried adding different kinds of movement with all the different physics libraries but it kept causing the player to fall over or not move and then suddenly zip around. I think I’ve decided to use Jolt Physics (but not the built-in Three.js one!) as this site showcases some simple code to get physics working.

Next steps

I have come up with plans for the OS like how the text editor will be an actual notepad you have to pick up and how you’ll be able to build out the space with different floor tiles and furniture.
I also want to add CS:GO/Momentum Mod style movement as an option just because I find it fun to bhop around everywhere.
It also looks like Jolt has a built in class called CharacterVirtual that I hope is similar to CharacterBody3Ds in Godot. Once I have the movement set up I will start modelling some assets to add. I would also like to try using the new HTML-to-Canvas API but it is experimental so it’s not best to use it in a production build that anyone could be running on any device.

See you soon!

This project might take a while to start looking user-friendly but if you want to test it out any time, head on over to: cookistudios.com/FPS-OS