rtay.io/blog/post

Switch to dark mode

Kahootz - Map Explorer

Hey everyone, now that I’ve finished exams I should be able to get back to making things for the next few months.

I’ve begun working on the very basics of a level loader and sort of map explorer for kahootz.club, which allows you to navigate the levels in a similar fashion to this noclip prototype I released about a year ago.

For this, I decided to use threejs’s GLTF support for the models. GLTF has a relatively small filesize and is ready to render, making it useful for web. Luckily for me, Blender recently added a .GLTF exporter.

However since I’m not familiar with the format and blender’s export behaviour I had some strange issues with textures not loading:

Screenshot of abstract kahootz level with white spheres instead of coloured spheres

I managed to resolve this by going through each mesh and removing all associations to textures not part of that mesh, which seems to have fixed it. I then loaded it into threejs and everything worked properly without issue.

I had to write a small amount of javascript so that backface culling would be enabled, and I was also able to import a couple of the other abstract levels I had extracted:

Computery looking scene with lots of colourful strips in the foreground and blue squares in the background Trippy hexagonal structure lined with colourful tiles

Unfortunately for now, all the levels are static and don’t have the usual animations that would accompany them in kahootz, due to my limited ability to extract animations with the 3d models. I’ll be looking into manually doing a lot of the animations in the future, but until then all the models and scenes will have to remain static.

I’ve added a simple select element to the html so you can switch between the scenes, and I’ll be working on a more detailed UI in the future to accompany this. Hopefully I can figure out a good way to be able to import different assets into the scenes and eventually add the ability to animate them.

You can see all these things added over at kahootz.club!

Have a play around with it and tell me what you think, more maps are coming soon.


A post by @rtaylz