jeeliz/jeelizWeboji

How to control springiness effect for custom 3d models?

Andyjoedev opened this issue · 3 comments

Andyjoedev commented

In the ThreeJSHelper File, in my assumption rotationSpringCoeff and rotationAmortizationCoeff parameters are responsible for "springiness" effect of the 3d model.

It works great for the fox model. But it doesn't look good for my custom 3d models which I created using this tutorial. For my model I have set these parameters as follows to lower the springiness.
rotationSpringCoeff = 0.0005 and rotationAmortizationCoeff = 0.5

However, I want to use this effect for my 3d model but at the same time I want to control the location and intensity of this effect, for example trunk and ears of an elephant. Is there any specific requirements or code I have to change to achieve this? I have found no information to continue on. Please guide me to the correct path.

Regards,
Andy

xavierjs commented

Hi,

The springness is mainly controlled by the Flex texture (https://github.com/jeeliz/jeelizWeboji/blob/master/assets/3D/textures/Fox_flex.png for the fox).
rigid parts are in black, and red part (only the red channel is in use) are amortized.

Best,
Xavier

Andyjoedev commented

Thanks for replying,
From what I understand flex texture creation steps:

  1. Edit texture file in image editor like Photoshop or Gimp.
  2. Remove Green and Blue Channels.
  3. Recolor texture with black and red only.
  4. Save the file.

Import the texture in this file https://github.com/jeeliz/jeelizWeboji/blob/master/demos/threejs/fox/demo_webojiThreejs.js by giving its path in the flexMapURL property.
Please confirm these steps.

Also I have questions

  1. Does the saturation of the red and black color denotes intensity of springiness?
  2. I have checked Google about "flex textures" but I did not find anything relevant. Do you invented this method of adding springiness mapping?

Regards,
Andy

xavierjs commented

Hi,

I invented this method, the texture is only used to store a coefficient, called "flex coefficient", 0-> rigid 1-> flex applied at 100%. So the answer to your question 1. is true.
The flex material is implemented here: https://github.com/jeeliz/jeelizWeboji/blob/master/helpers/threejs/ThreeMorphFlexibleMaterialBuilder.js
It is a bit tricky because we need to multiplex morph attributes, otherwise we don't have enough attributes to store all the morphs.

Best,
Xavier