3D clothes Configurator

Hi. I am three.js developer.
I want to create a project as a 3d clothes configurator like below.
I need to know what is 2d part. Is it by fabric js? Does it contain a .dxf file? what are these template pictures of t-shirt?
next ,I want to know how can I add different textures to one layer and change the position? The most important part is syncing 2d canvas and 3d canvas with different files .
What is your experience about it?
I need roadmap.


This should get you started:

If you need mouse interactions on the 3D model, continue here:

1 Like
  • Create a 3d model of your product/or buy. export to obj
  • Make sure the UV Map is correctly managed
  • Export the UV Layout
  • Import the UV Layout to vector editor software (illustrator, corel draw)
  • Trace the UV layout and add some design, save to svg
  • start with this https://codepen.io/Zhu-Zhang/pen/vYPOdQw
  • Work your way to change the 3d model
  • Implement fabric.loadSvgFromUrl to load the svg from previous step

Basically those are the steps to create what u wanted

1 Like