Loading video...
Video Failed to Load
Three.js explained for visual learners 📺 Bookmark this for future reference 🫡 Share what you are building with Three.js below 👇
54,827 views • 6 months ago •via X (Twitter)
68 Comments

Crazy what is possible in Three.js, in the browser! What is everyone else cooking up?

@threejs Terminus Breach! Also playable here:

@threejs That actually looks awesome! Will test it out soon 🫡

@threejs Thanks! My crown piece so far! :)

@threejs "So Far" 🫡

@threejs Correct :)

@threejs Building K2 where participation is the new currency

@threejs Using Three.JS?

@threejs Building CHAMPION Nexus - a platformer racer made in @JamangoGame, rendered in three.js. Even the keyart uses it - the character's made in @NiloTechInc's platform!

@threejs @JamangoGame @NiloTechInc Nice! Any vids yet? We love voxel looks!

@threejs @JamangoGame @NiloTechInc Some gameplay teasers - more content is on the way though

@threejs @JamangoGame @NiloTechInc Nice! You should try set something like this up, a semi-transparent block with the placement

@threejs @JamangoGame @NiloTechInc That would be cool! Probably is a platform-level change or requires some plugin implementation though, the creator kit itself is just a template that uses the Jamango editor.

@threejs

@threejs Nice! How is that different from a Splat?

@threejs thanks! I used triangulated geometry output by scanning apps... easier to use/switch textures, and plays better with 'legacy' 3D models... but splatting looks a lot better lately, have to look into it more; still seems to me like splatting and three.js is somewhat new?

@threejs Not sure how new it is honestly, but it's there :) I've seen some demos (in browser) that are just really crazy high quality, real places.

@threejs Amazing video, so much I learned here

@threejs Yeah, after making this I saw what is truly possible in Three.JS...the visuals and the names to go along with it! SO many ideas flowing now.

@threejs Get this up on youtube friend :-)

@threejs Will do!

@threejs AI slop. At least ten mistakes, the animation being particularly egregious. Also, what's the point of learning Three.js if AI can do it better?

I was wondering when someone would say that. As the legend themselves say: I know for a fact there are minor issues in this, and I could have spent hours more fixing them...OR, I could have shipped something that will help thousands of people. Go look at the docs for Three.JS...and tell me how a newbie is meant to learn easily from them? Random code, and some hard to find and go through demos. This gives you the visual intro to actually know WHAT is possible, and the names for them. The fact a few minor things are incorrect is irrelevant, you are not going to internalise so much, the memory cannot hold that much info. The key is you SEE what is possible, and the visual memory is far more powerful. When it comes to making something, you can easily go okay, that is what I want...that is the name, and then look up the docs or use your AI Agent to do it for you. I have experience in 3D animation and photography/cinematography, and I was using 3JS through another SDK, but not the actual library. I generated this FOR MYSELF, first the text/mapping...and then the images. It was so helpful that I wanted to share it, simple as that. Imagine if you could give this to yourself before you ever studied any of it...I guarantee you it would accelerate your learnings :) Anyway, just look at all of the people who learnt alot and are inspired, embrace the new world, you can achieve things you never dreamt of! P.S I made all of these in a few hours of effort.

@CarlBateman 100%

@CarlBateman Appreciate your support...I got something new cooking too ;) This will be running the real code, so no 'AI SLOP' or inaccuracies possible there :D

@threejs Some tests ! May need a desktops and gamepad for full experience.

@NeuralPixelAI @threejs 👀

@NeuralPixelAI @threejs The power of Three.js is insane when you look into it!

@threejs is there a written version of this? lol

@threejs I'll get you one 🫡 Do you mean the pics, or actual text btw?

@threejs Legend! Whichever is easiest for you!

@threejs Making a website for you now!

@threejs The best! Thank you sir! 🫡

@threejs Here you go :)

@threejs Leegeeeend! Thank you!

@threejs No problem, hope it helps :)

@threejs great work my friend

@threejs Thanks 🫡 Got some inspiration 🤔:D?

@threejs Ty helpful, cheers

@threejs Awesome, happy to help!

@threejs Goated info , thanks for sharing quality informations @AIOnlyDeveloper 🙏

@threejs No problem! You planning on making a game :)?

@threejs Yes I do , I have 0 experience on that but with those tools of AI and the studio of @threejs i think i can . It will take some time but when i have something I’ll post . Me dream is coming true of developing my own game ! Thank you for igniting it 😁

@threejs You don't need experience, just time and patience...and an Agent or 2 :) Start with Claude Code...or Codex :D PLANS, not API (and no, not cursor either :D).

@threejs I’ll give it a go for sure , I’m so excited about it !

@threejs Awesome! Let us know how u go, u know where to find me :D

@threejs This is so good

@threejs Thanks :D Was fun to make and learn from myself!

@AwokeKnowing @threejs Bookmarked for later

@AwokeKnowing @threejs 🫡 Legend, hopefully it helps :)

@threejs goated

@AdonisHY @threejs Thanks, hopefully it helps you too :D

@threejs Very helpful resource 🔥🔥

@threejs These would be great in step by step learning app

@threejs Website is here btw:

@threejs We could build that into an app on balance? This what we have so far Still in production but mostly cosmetically and maybe a few extra added function

@threejs @Project2Balance

@threejs awesome

@threejs Hope it helps :)

@threejs thank you for this its been on my mind on how to learn threejs, this literally has all the terminology with explanations i needed for prompting

@threejs Yeah, this is exactly it! I was struggling too...I mapped out the code, but it wasn't enough, I needed to 'see' what it meant...and here we are! What Agents are you using?

@threejs anything frontend/design i use kimi2.5 its given me the most consistent results and even exceeded my expectations when i don't have all the right terminology

@threejs A very good summary

@threejs Thanks :) What are you working on :O?

@threejs link?

@threejs

@threejs Is a website?

@threejs Yes you can see it
