tinystudio
- 24 Devlogs
- 46 Total hours
a 3D fantasy console like game engine where you can make anything :)
a 3D fantasy console like game engine where you can make anything :)
There’s now a model tab, also I made some more animations and things to make the app more fun to use. I’m also in the process of rebuilding the data types and completely redoing the reusable Renderer component since it was an absolute disaster before.
I really tried making the UI look a lot nicer than the generic UI it was before, and I think it looks pretty nice. I might need to simplify some stuff, but I spent a long time trying to make the UI more welcoming and easy to use and for the UI to seem more playful in a way I guess, than the more mono font boring gray it was last time.
I also have started on completely refactoring the engine. The previous data stores and data types were too limiting and I made some bad decisions early on so starting from scratch is kind of necessary
Added constraints, which took a while because the way I store objects just isn’t sustainable
I’m going to redo the entire architechure of this app, mostly the backend because it’s just such a mess. I’ve been piling on features and the technical debt and poor early decisions are catching up to me and it’s making development slower so I’m going to start refactoring a lot of stuff. This should mean everything will be less buggy and make it faster for me to develop new features
Now that I know how the app will be I can make smarter decisions
Reworked script system for better and easier scripting and added some basic part modification functions
Basically, before you would need to type something like find(“stud”):setVelocity({10, 10, 10}) or something like that, but with metatables
Metatables are kind of weird, but they basically let me return a special object from the find() function, and modify that object to override functions and add new ones. For example, you can override the metatable of custom Vector3 objects to handle addition, so you can do v1 + v2 instead of addVectors(v1, v2) and it’s a lot cleaner and straightforward.
This means injecting a bunch of Lua code to set these metatables, and exposing global functions from JS to handle the metatable calls.
I also added some event handling (very basic for now) but you can see in the video the part moving from me using WASD
You can also see a ton of errors, and I’m trying to fix those right now. I really don’t know why they are here
Part sidebar shows parent/child relationships now (also had to change backend)
I also got save data to serialize, but loading seems to break the other components that rely on the state
I also added the cool little part add thing. I changed the font of the app too and stuff. I tried different search things but this one from shadcn-svelte seemed to work the best. I also picked the Lyra theme from shadcn-svelte
It’s been a while, I kind of forgot to log in the middle
I reimplemented parts of the backend to support play testing and handling the state of the current game, keeping track of parts and bodies and scripts
Added physics engine (Rapier), requiring keeping track of colliders and physics bodies. Right now only convex meshes for performance meaning concave colliders might be a little broken for now so I plan to add something like VHACD or a more modern alternative to split up complicated meshes into smaller convex and simplified colliders.
Added Wasmoon (Lua interpreter) and CodeMirror 6 (code editor component) and some old language parser for Lua to be supported properly, this was also a challenge because Wasmoon just wants to run all the code in one go, so instead there has to be a coroutine setup where the code returns back out temporarily (with a custom wait function that utilized the coroutine function) where then my code ticks every frame to tick the code (while loop) again and also adds the delay if applicable
The renderer also needed a few tweaks to get this to work properly
Also something kind of weird was I couldn’t get the playTest state to update and propagate throughout the application (thats why the top bar button doesn’t work for now) and honestly I have no idea why and I spent a lot of time debugging it
Can now apply textures to objects with a new Texture Studio tab :)
It’s still really buggy and doesn’t work on CSG objects. It also ignores the coplanar face detection I have right now for simplicity so it only works on ThreeJS primitive face groups as of right now.
I added the framework of a UV atlas editor, and also the painting studio for the texture editor
I’m working on the texture system. I’m still working on UVs. It’s honestly really complicated, I have no idea so far how to make it intuitive for users. Auto unwrapping it would not give easy to use results because most assets in this engine are going to be simple. Showing all the vertices on a single atlas also would be very overwhelming. I’m trying to figure something out. It could be determined on a face by face basis, but some faces could be super super weird due to imported meshes or weird CSG operations, which would lead to a mess of a UV unwrap
I’m also going to make an editor to assemble the texture atlases by stitching together the individual smaller textures.
Finally got the world studio to work properly, it was because I didn’t assign an ID to the spawned objects
And I added the premade things in the scene also be added to the store
I finally got model saving to sort of work. This required revamping the backend stores to support multiple tabs, and updating the sidebar to actually use the correct tab state data.
Moved 3D rendering code to be shared between both studios via creating a component that applies the shading and stuff and exposing the scene for the individual studios to add objects
And added an isolation mode that allows the user to focus a single object or group of objects (whatever the user is selecting) and pressing i to toggle. Useful for like creating constraints and stuff more easily
Transform controls (now can switch to rotate and scale)
And basic undo/redo system that basically just takes the ThreeJS properties and saves it and reapplies it back on undo
And delete
Face selection (took so long) and with face selection I added constraint creation system that just creates a constraint in the center of the faces selected
I had to add another face renderer, and then also refactor the stores and how I stored data to get this to work and to keep track of faces selected and stuff which took a long time
The CSG works really well now. Union operations now maintain materials by keeping track of the mesh IDs and then reassigning the materials afterwards manually. Also some clean up and general improvement
I’ve fixed the face selection code to check the dot product of the faces to make sure they are actually coplanar.
I also added some cleanup functions to perform after the CSG operations to clean up geometry to make it more usable
Face detection and highlighting working
This was pretty complicated because 3D objects are made up of triangles, but the user probably does NOT want to select triangles, but the faces themselves. So basically, I got the face the raycast hit, and then looped through all the triangles of the mesh they are hovering and got the vertex indices and got their positions and turned that into a normal and compared it with the other faces and decided if the normals were close enough
Added retro shader that quantizes the colors to look more like a limited color space
Fixed CSG errors and fixed gizmo disappearing over and over again
Added another render pass and raycast to add outline to hovered objects
I switched the CSG library to Manifold3D and it’s better but the meshes are a bit weird. Hopefully I’ll figure it out later. Also for some reason selection of these meshes and their transform gizmos are really difficult and buggy so I have to fix that.
Also I know that there are errors I’m going to fix that now
CSG is being very annoying.
I’m using three-bvh-csg but it’s not really what I need I think. There’s some subtraction artifacts, and most importantly, materials are not preserved
I think I’m going to switch to a different library because this one isn’t really working great for me but it is pretty nice and simple
Added multi part select. Trying to debug why CSG operations not working
I honestly don’t know what’s wrong because I followed the example code from the library but it’s not working :(
The sidebars are now synced, but I still need to make them sync correctly to the current tab. Right now they sync exclusively to the model studio. The raycasting & selection of parts work now and I fixed the tabs to not unload and reload on each tab switch which caused data sync issues and lag and instead all tabs stay loaded.
I made the part selected have an outline and made the gizmo work, but currently I can’t select other parts for some reason and I’ve just been debugging that
I started work on the “World Studio” and “Model Studio” of this game engine/fantasy console. The model studio is where you create the models that you drag into the world studio. I’ve added a gizmo and a way to place the parts and also made a more stylized rendering thing to make it feel more retro in a way.
I started the project and installed SvelteKit and added ThreeJS