# A 3d thing **URL:** \ **Category:** Show & Tell\ **Tags:** game, graphics-and-math\ **Created:** [December 20, 2025, 1:36am UTC](https://forum.makecode.com/t/a-3d-thing/41142 "2025-12-20T01:36:09Z")\ **Posts on this page:** 20\ **Page:** 2
**Author:** ![VoxelMaster64](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/voxelmaster64/32/32075_2.png) [@VoxelMaster64](https://forum.makecode.com/u/VoxelMaster64)\ **Post date:** [March 8, 2026, 6:18pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/21 "2026-03-08T18:18:01Z")
depending on how there rendered, it may be that it’s rendering polygons behind the actual camera. [https://scratch.mit.edu/projects/1197402752/](https://scratch.mit.edu/projects/1197402752/) has that glitch. I don’t intirely know how to solve it, though one way is to check if any points of the polygon are behind the player, and if so, don’t render it. that won’t always produce the best outcome but it might work ---
**Author:** ![Existent\_Chicken](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/existent_chicken/32/25053_2.png) [@Existent\_Chicken](https://forum.makecode.com/u/Existent_Chicken)\ **Post date:** [March 9, 2026, 11:50pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/22 "2026-03-09T23:50:09Z")
new update! use old link ---
**Author:** ![Existent\_Chicken](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/existent_chicken/32/25053_2.png) [@Existent\_Chicken](https://forum.makecode.com/u/Existent_Chicken)\ **Post date:** [March 9, 2026, 11:51pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/23 "2026-03-09T23:51:55Z")
I added collision so this glitch never happens anymore ---
**Author:** ![Existent\_Chicken](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/existent_chicken/32/25053_2.png) [@Existent\_Chicken](https://forum.makecode.com/u/Existent_Chicken)\ **Post date:** [March 19, 2026, 12:52am UTC](https://forum.makecode.com/t/a-3d-thing/41142/24 "2026-03-19T00:52:08Z")
Ok, new release! > **[BARRIER 3D Engine](https://arcade.makecode.com/S48683-74416-07319-03728)** > > Arrow keys to look > WASD to move forward/left/right/backward > Shift/Space to move down/up > May be a bit laggy > Many textures > Textures shouldn't explode across the screen anymore Also, I have reached the stage in which I invite others to try to make something with it! If you want to make something with this 3D engine, feel free to- but please make sure to give me credit! ---
**Author:** ![Existent\_Chicken](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/existent_chicken/32/25053_2.png) [@Existent\_Chicken](https://forum.makecode.com/u/Existent_Chicken)\ **Post date:** [March 19, 2026, 1:05am UTC](https://forum.makecode.com/t/a-3d-thing/41142/25 "2026-03-19T01:05:29Z")
Please note that this engine is not done yet. Lag issues and some other glitches are thigs I am working to fix. ---
**Author:** ![not\_a\_lemon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/not_a_lemon/32/35289_2.png) [@not\_a\_lemon](https://forum.makecode.com/u/not_a_lemon)\ **Post date:** [March 26, 2026, 11:07pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/26 "2026-03-26T23:07:09Z")
@richard can we turn parallel arrays into a single hex code? if so, how? We want to be able to create a makecode “game” that would serve as a 3d tilemap editor, and we need a way to store the face images and x/y/z positions; we can use arrays pretty easily but it’s annoying to make multiple custom blocks like “set tilemap face images to” and “set tilemap face positions to” etc. Can we somehow combine the data from 4 parallel arrays into a single hex value so people can simply copy paste one number instead of 4 arrays? if so, thanks, and if there’s another solution, please let me know. ---
**Author:** ![richard](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/richard/32/5417_2.png) [@richard](https://forum.makecode.com/u/richard)\ **Post date:** [March 26, 2026, 11:33pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/27 "2026-03-26T23:33:47Z")
sure, you can make your hex buffer format as complicated as you want, it’s just a question of how you encode/decode the data. for example, assuming that each position consists of 4 numbers (x, y, z, and tileIndex), i would encode them like this: ```ts class Position { constructor( public x: number, public y: number, public z: number, public tileIndex: number ) { } } // We're going to use two bytes for each of the numbers in a position, // so all together that adds up to 8 bytes per position const POSITION_SIZE_BYTES = 8; function serializePosition( buf: Buffer, offset: number, position: Position ) { // For x, y, and z, use an Int16LE. This takes up two bytes and has a // range of -32,768 to 32,767 so should be good enough. Note, I'm assuming // that x/y/z are all integers and do not have decimal points. // For each subsequent number, I add 2 to the offset because each number we're // writing is 2 bytes long buf.setNumber(NumberFormat.Int16LE, offset, position.x) buf.setNumber(NumberFormat.Int16LE, offset + 2, position.y) buf.setNumber(NumberFormat.Int16LE, offset + 4, position.z) // For the tile index, we use a UInt16LE (unsigned integer) because indices can // only be positive integers. Once again, this takes up two bytes buf.setNumber(NumberFormat.UInt16LE, offset + 6, position.tileIndex) } function deserializePosition( buf: Buffer, offset: number ) { // Make sure all of these number formats match what's in serializePosition const x = buf.getNumber(NumberFormat.Int16LE, offset); const y = buf.getNumber(NumberFormat.Int16LE, offset + 2); const z = buf.getNumber(NumberFormat.Int16LE, offset + 4); const tileIndex = buf.getNumber(NumberFormat.UInt16LE, offset + 6); return new Position(x, y, z, tileIndex) } function encodePositionArray( positions: Position[] ) { const buf = control.createBuffer(positions.length * POSITION_SIZE_BYTES); for (let i = 0; i < positions.length; i++) { serializePosition( buf, i * POSITION_SIZE_BYTES, positions[i] ); } return buf; } function decodePositionArray( buf: Buffer ) { const numPoints = Math.idiv(buf.length, POSITION_SIZE_BYTES); const result: Position[] = []; for (let i = 0; i < numPoints; i++) { result.push(deserializePosition( buf, i * POSITION_SIZE_BYTES )) } return result; } ``` ---
**Author:** ![codeFan413](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/codefan413/32/26855_2.png) [@codeFan413](https://forum.makecode.com/u/codeFan413)\ **Post date:** [March 27, 2026, 3:48pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/28 "2026-03-27T15:48:56Z")
do you think makecode could handle a fractal block world demake, by any chance ---
**Author:** ![not\_a\_lemon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/not_a_lemon/32/35289_2.png) [@not\_a\_lemon](https://forum.makecode.com/u/not_a_lemon)\ **Post date:** [March 30, 2026, 1:29pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/29 "2026-03-30T13:29:30Z")
Alr so @Existent_Chicken and I are each trying a different method for 3d engines; here’s iteration 1 of mine! > **[3D render demo 1](https://arcade.makecode.com/S07015-99823-71634-60279)** > > So uhhhh yeah idk why the thumbnail is so glitchy but whatever. NOTE: THIS ENGINE IS NOT READY FOR PUBLIC USE. This is my first ever 3d project and it took a lot of work to make, although I do have to give a lot of credit to Google AI for helping me understand how matrices work and how to multiply a matrix by a vector3 and stuff like that, and a bit of credit goes to @Existent_Chicken and their dad for helping me understand what exactly the AI meant by some stuff. ---
**Author:** ![not\_a\_lemon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/not_a_lemon/32/35289_2.png) [@not\_a\_lemon](https://forum.makecode.com/u/not_a_lemon)\ **Post date:** [April 1, 2026, 12:44am UTC](https://forum.makecode.com/t/a-3d-thing/41142/30 "2026-04-01T00:44:26Z")
New version with camera directions! > **[3D render demo 2](https://arcade.makecode.com/S58191-48799-78168-73869)** > > Camera looking! NOTE: THIS ENGINE IS NOT READY FOR PUBLIC USE. ---
**Author:** ![not\_a\_lemon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/not_a_lemon/32/35289_2.png) [@not\_a\_lemon](https://forum.makecode.com/u/not_a_lemon)\ **Post date:** [April 4, 2026, 1:09am UTC](https://forum.makecode.com/t/a-3d-thing/41142/31 "2026-04-04T01:09:16Z")
YAAAAAAAAAAAAAAAAAAAAAAAAAY I GOT TEXTURES WORKING!!! 🥳🥳🥳 > **[3D render demo 3](https://arcade.makecode.com/47612-85132-11883-52661)** > > Full camera movement with damping AND NOW RENDERABLE OBJECTS!! NOTE: THIS ENGINE IS NOT READY FOR PUBLIC USE (but getting closer!) ---
**Author:** ![KawaiiGoddess](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/kawaiigoddess/32/33722_2.png) [@KawaiiGoddess](https://forum.makecode.com/u/KawaiiGoddess)\ **Post date:** [April 4, 2026, 3:01am UTC](https://forum.makecode.com/t/a-3d-thing/41142/32 "2026-04-04T03:01:41Z")
HOW DO PEOPLE DO THIS???!!! HOW? 👌 ---
**Author:** ![randomuser](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/randomuser/32/32505_2.png) [@randomuser](https://forum.makecode.com/u/randomuser)\ **Post date:** [April 4, 2026, 3:01am UTC](https://forum.makecode.com/t/a-3d-thing/41142/33 "2026-04-04T03:01:57Z")
W O W !!! 🤯 I’m blown away, the last time I’ve seen any render of this quality was [Brohann’s dinosaur](https://forum.makecode.com/t/brohanns-3d-devlog/20917/16) now up on the makecode website itself. I’m mainly impressed by how well the textures look in 3D (I’m not sure Brohann had even done 3D textures before) and how there aren’t any bugs or clipping 😆 ---
**Author:** ![KawaiiGoddess](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/kawaiigoddess/32/33722_2.png) [@KawaiiGoddess](https://forum.makecode.com/u/KawaiiGoddess)\ **Post date:** [April 6, 2026, 5:05pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/34 "2026-04-06T17:05:41Z")
> [@KawaiiGoddess](#): > > HOW DO PEOPLE DO THIS???!!! HOW? 👌 Why did I say this when I literally just made this? I am so interested in 3D mechanics that I made this. I know. It is cool. I didn’t even make it with javascript. Just 1 variable. Called angle. > **[Line 3D Mechanics demo 1](https://arcade.makecode.com/S72924-93917-52092-85317)** > > 3D DEMO ---
**Author:** ![not\_a\_lemon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/not_a_lemon/32/35289_2.png) [@not\_a\_lemon](https://forum.makecode.com/u/not_a_lemon)\ **Post date:** [April 6, 2026, 9:03pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/35 "2026-04-06T21:03:37Z")
LET’S GOOOO I GOT SHADERS WORKING!!! > **[3D render demo 3](https://arcade.makecode.com/42969-17216-64491-96860)** > > SHADED OBJECTS ARE HERE!!!! 🥳 NOTE: THIS ENGINE IS NOT READY FOR PUBLIC USE (but getting closer!) I’m actually really surprised by how smooth it still is even with the dithering; I guess the bit shifting helped a lot. BTW this spinning guy is Sparky, a Munchy who’ll be the main character in my big 3d game. If I can get it fully working. ---
**Author:** ![randomuser](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/randomuser/32/32505_2.png) [@randomuser](https://forum.makecode.com/u/randomuser)\ **Post date:** [April 7, 2026, 5:10pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/36 "2026-04-07T17:10:05Z")
AMAZING!! The shading is really smooth, so you have to preprogram where it shades or does it calculate where to shade? ---
**Author:** ![not\_a\_lemon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/not_a_lemon/32/35289_2.png) [@not\_a\_lemon](https://forum.makecode.com/u/not_a_lemon)\ **Post date:** [April 7, 2026, 6:27pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/37 "2026-04-07T18:27:22Z")
Sneak peek of what I’m working on now! ![image](https://us1.discourse-cdn.com/flex020/uploads/makecode/original/3X/6/8/68ebacc7399d5c0f532fd30bbf060690a6722794.png) ---
**Author:** ![not\_a\_lemon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/not_a_lemon/32/35289_2.png) [@not\_a\_lemon](https://forum.makecode.com/u/not_a_lemon)\ **Post date:** [April 7, 2026, 6:27pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/38 "2026-04-07T18:27:27Z")
It calculates where to shade based on the angle in radians from the set sun position to the positions of the face vertices. ---
**Author:** ![randomuser](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/randomuser/32/32505_2.png) [@randomuser](https://forum.makecode.com/u/randomuser)\ **Post date:** [April 7, 2026, 8:00pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/39 "2026-04-07T20:00:32Z")
THATS SO COOL!!! Very high tech, and such fast progress too ---
**Author:** ![not\_a\_lemon](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.makecode.com/not_a_lemon/32/35289_2.png) [@not\_a\_lemon](https://forum.makecode.com/u/not_a_lemon)\ **Post date:** [April 8, 2026, 11:35pm UTC](https://forum.makecode.com/t/a-3d-thing/41142/40 "2026-04-08T23:35:15Z")
hey @richard in most typescript editors you can convert a number to a hexadecimal by using `.toString(16)`; however makecode doesn’t’ seem to have that optional number parameter. Is there a different way to convert a number to hexadecimal? [Previous page](https://forum.makecode.com/t/a-3d-thing/41142.md?page=1) [Next page](https://forum.makecode.com/t/a-3d-thing/41142.md?page=3)