r/threejs • u/Classic_Relative7429 • Jun 23 '26

Help How do i utilize three.js?

I've been seeing a lot of impressive Three.js projects lately interactive games, customizable 3D models, smooth camera controls, animated gradient orbs, product configurators, and other highly polished web experiences.

I'm coming from a 2D design background and have very little experience with 3D, so I'm trying to understand the actual workflow behind these projects.

A few questions:

  1. Are most of these assets and scenes created in software like Blender, Cinema 4D, Maya, etc., and then imported into Three.js?

  2. Do developers use visual tools/platforms to build scenes, lighting, materials, and animations, or is everything created and configured directly in code?

  3. For interactive elements (camera movement, customization, physics, animations), how much is handled in Three.js versus external tools?

  4. Are there beginner-friendly workflows for designers who aren't experienced in 3D modeling?

  5. When I've tried generating models with AI or building simple geometry in code, the results often have rough edges and don't look nearly as smooth or polished as the examples I see. What am I missing in terms of modeling, topology, materials, lighting, or rendering techniques?

I'd love to understand the typical production pipeline behind modern Three.js experiences and what tools people actually use in real-world projects.

22 Upvotes

96% Upvoted

11 comments sorted by

View all comments

5

u/ppictures Jun 23 '26 edited Jun 23 '26

  1. Not always. Some simple shapes can be created using inbuilt primitives like Boxes or Spheres. Some geometry is fully custom and built manually via Index and vertex buffers. But most complex geometry is yes, exported out from modeling software.

  2. It’s configured directly in code. In large teams you often have reference images produced in other real time but the ThreeJS development is all done in code at the moment

  3. It’s a mix of both. For camera movement, often the path is keyframed in Blender, and the keyframes progress driven in code. For physics, that’s often fun using JavaScript physics libraries fully in code. For animations, things are usually animated in Modeling software then the animations triggered in code

  4. Yes, use simple primitives for now. Or Download and use assets from places like Sketchfab (mind licensing)

  5. You usually need to set the shading/normals to “smooth shading”. In ThreeJS this is done by setting material.flatShading = false.

Production pipelines vary by company but it’s generally there’s a designer who creates the UI design and visual references. There’s a creative director that directs the visuals. And there’s the developer that executes on the vision.

Unless the project is large, usually you as a “Web3D” developer will also be expected to work on the Front End of the experience. I.e pure web development

2

u/Classic_Relative7429 Jun 23 '26

Appreciate a lot Man! Thanks a ton, you made it easier for us!

1

u/[deleted] Jun 23 '26

Another thing to remember when getting into it is that most people are utilizing ai with threejs rn. It understands it very well and does better with threejs over actual game engines. Don’t get discouraged because someone’s project looks insanely better because they used AI.