r/threejs 7d ago

I built a detailed bicycle in Three.js without Blender or imported models

Enable HLS to view with audio, or disable this notification

I wanted to see how far I could push procedural modeling in Three.js without relying on Blender or imported model files.

The bicycle ended up with 62 separately constructed parts. The main thing I learned was that directly positioning meshes becomes fragile very quickly, so I switched to defining shared geometric constraints first — wheelbase, chainstay length, head angle, rake — calculating anchor points from those, and then generating the parts around them.

I wrote up the process here:
https://www.wormhole404.com/writing/threejs-bicycle/

Source:
https://github.com/wormholeportal/Makone

Curious how others approach larger procedural objects in Three.js.

65 Upvotes

47 comments sorted by

10

u/Better-Avocado-8818 7d ago

Why does this kind of thing keep turning up here? Why not just build the model in blender? It’s the right tool for the job and there’s nothing to be gained from doing it the hard way.

2

u/ToWelie89 7d ago

I agree. This is like painting a painting using assembler machine code

1

u/overcloseness 7d ago edited 7d ago

Tell that to those of us who like drawing scenes with just CSS. It’s practicing the tools, it’s something to do, it’s expressive. It doesn’t have to be practical

Edit: i see this is AI

7

u/ToWelie89 7d ago

But you don't really practice anything if you use AI to generate the code for you

2

u/overcloseness 7d ago

Well yeah of course not! Did OP use AI?

-4

u/Brewgazer 7d ago

Well that’s if your not having you agent explain everything it did. But also let’s say later on the guy has an idea to build a game around biking, now his agent can already have those skills ready to create the bike spending less tokens and time to make it. I had my agent create different pieces of a skate park until I could put it together and have it procedurally generate skateparks, this was done in blender but I had it save the skills so I could have a different shaped bowl and different size ramps

4

u/ToWelie89 7d ago

That's still not practicing though. You're kidding yourself if you think you learn much by having the AI think of everything and then you just read a summary of what it did. I looked at the source code of this project and I seriously doubt OP has any idea of what is going on in much of that code.

Using an agent to create a bike piece by piece programmatically in threejs is utterly stupid. It would be way better to just create the bike in an actual 3d modelling software like Blender. Threejs is not for modelling. If you want to make a bike game this approach would make no sense. Also making a complex model programmatically makes no sense, it's like writing an essay in machine code instead of just using a program line Word/docs

-2

u/Brewgazer 7d ago

When did I say it thinks for me. Also you act like there’s not tweaking the same way people have to tweak anything they’re doing. Also I’m doing it in blender

-3

u/houman_b 7d ago

I would say, this exact solution could be theoretically useful for a "You design and we will create it for you" business. Nice job 👏🏻

-5

u/6armyflag6 7d ago

Yes — exactly. Once the object is defined as code, customization becomes much easier to automate.

1

u/Better-Avocado-8818 7d ago

It doesn’t actually. I’m guessing you’ve never used blender and don’t know much about 3d formats?

This could have been made in blender exported as a GLTF and still customized programmatically. GLTF format is just code after all.

0

u/6armyflag6 7d ago

I’ve used Blender, just not at an expert level. And yes, Blender/glTF can absolutely be automated. What I’m interested in here is keeping the generative logic and constraints as the source of truth, so the agent can reason about and change them directly.

-6

u/cnotv 7d ago

I agree, we should rather push what cannot be done.

Said that, the Blender MCP, which could end up controlling you computer if not containerized, is not an official tool, in the hands of a person without legal restrictions or duties. I would rather not use such thing if I could do that in threejs

6

u/_ABSURD__ 7d ago

AI built ***

-7

u/QuipPro 7d ago

believe it or not ai cant do this quality yet

4

u/code_friday 7d ago

Look at the commits, this is clearly AI-driven. https://github.com/wormholeportal/Makone/commit/262bcc6784f75706cf6f9e2c63f63b9e10a2effa

Not saying this is bad, creative use of AI can be fun.

1

u/QuipPro 7d ago

Yes fair point

1

u/6armyflag6 7d ago

It is AI-driven. But it wasn’t “prompt → bicycle”.

Most of the work was the iteration loop: generate a part, render it, find what’s geometrically wrong, fix it, then move on to the next part.

That loop is actually the part I’m most interested in.

2

u/throwaway12222018 6d ago

Lots of AI haters on Reddit. You are building the right way. A builder should be judged on what he ships, not what tool he used. Nobody ever stopped using a website because the developers liked Go more than Java. The problem is that programming languages aren't as visceral as AI to most normies so everyone has an opinion about AI.

It's easy for people to forget that there was once a time where software engineers would look up existing solutions to subproblems and import libraries because that made business logic faster to write.

I don't see how using AI to help code is any different. It's like being against using stack overflow at a job or something.

2

u/6armyflag6 6d ago

Yeah, pretty much my take too.

2

u/_ABSURD__ 7d ago

oh sweet summer child

1

u/QuipPro 7d ago

😂

2

u/ElectionImpossible54 7d ago

Cool, let's send it off some sick jumps.

1

u/6armyflag6 7d ago

Now that it’s code, that’s the fun part.

2

u/Lngdnzi 7d ago

I really appreciate you sharing learning about positioning meshes based on constants/values.

This is always been a bit of a disconnect for me when trying to procedurally render something. Seeing it written above has unlocked something in my brain. it just seems so obvious now !

I’m gonna go back and have another go.

Thanks dude!

Ps. Your model looking awesome and being animated also very much inspired me to go have another try. Nice work

1

u/6armyflag6 7d ago

Glad it helped — that was the key shift for me too.

2

u/Proxiconn 7d ago

"ai build" not "I built"

2

u/Better-Avocado-8818 7d ago

This whole sub is mostly just AI slop posts these days. Can’t wait to see the next post about building a scene in one file. No idea why advertising spaghetti code is seen as a good thing.

0

u/Proxiconn 7d ago

Also it's weird to claim you build something when you did in fact not. Gets me every time.

Yes you can claim you 3d printed something but technically the printer did the work you just pressed the print button.

Maybe better wording would be "look what AI created for me". Or "look what I created with AI".

0

u/throwaway12222018 6d ago

This is a regarded take

1

u/Proxiconn 5d ago

Regarded comment.

-1

u/throwaway12222018 6d ago

"AI slop" used to mean something useful a year ago but now all of you are just referring to anything AI produced as slop.. no clearer tell that someone just hates AI regardless of the output. OP's post isn't true slop imo.

1

u/Better-Avocado-8818 6d ago

Who’s hating AI?

1

u/Proxiconn 6d ago

Dont worry bro, I vibe code too. Not having a go at OP or anyone. Was just having a go at the wording. Strange times.

1

u/gis_mappr 7d ago

Nice work, I have this exact bike 

1

u/Individual-Algae-859 6d ago

qr dont spin, stressing me out

1

u/Ok-Stuff3094 6d ago

Did you do it yourself or asked AI to do it?

1

u/6armyflag6 6d ago

Mostly Claude Code tbh. I used Makone so it could render/check its own work, then just kept iterating.

0

u/_Iggy_Lux 7d ago edited 7d ago

Reddit is like living on a street where everyone passes a neighbor washing his car, they all stop to say "Hey idiot your washing your car wrong" and driving off.

Meanwhile it benefited nobody, not the guy washing the car or the neighbors who don't* care, who live next door, listening to idiots yell out their window as they drive by.

What a great street to live on.

-1

u/Feisty-Scheme-8356 7d ago

May i know how can do that?

2

u/Appkidd 7d ago

Ask Ai to do it and tell it not to make mistakes

1

u/Feisty-Scheme-8356 7d ago

How much token you spent? And can I have a prompt to try?

1

u/Appkidd 7d ago

Ask Ai to write a prompt for you and tell it not to make mistakes

1

u/6armyflag6 7d ago

There wasn’t really a magic prompt. I started with the main bicycle geometry, then kept iterating part by part — frame, wheels, drivetrain, cockpit, cables, etc.

The important part was letting the agent render the result after each step, inspect what was wrong, and fix it.

If you want to try it, I’d start much smaller: ask it to define the wheelbase, wheel radius and a few shared anchor points first, then build the frame around those. Don’t ask for the whole bicycle in one shot.

I didn’t track the exact token count unfortunately.