Stuck with blender textures not being rendered in Three JS

Hi

I am building a new website with Three JS, and have 0 experience with blender. I’ve asked a blender professional to create a set of 4 different semi-transparent cubes for me. He created it, but whenever I export the cubes from blender to glft or glb, or with seperate textutres (empty) I get a blank white cubes.

I’ve been told that the model is using Blender Material, and needs to be baked.
We’ve baked it, and it looks aweful. no transperancy and low quality.

I’m looking for a professional to help me solve this out, and walk me through this project, since it is just the beginning and some more work needs to be done.

I’m not a Blender professional, but for what it’s worth – if you’re hiring someone to create materials or models in Blender for use in three.js, it should probably be a requirement that the materials are set up with a Principled BSDF material as documented on this page of the Blender docs:

https://docs.blender.org/manual/en/latest/addons/import_export/scene_gltf2.html

Unlit materials could also be an option if you’re not using lighting.

2 Likes

I m a threejs and webgl developer
i m interesting on your job and i think i can help your project .
Please DM me via telegram or discord.
Telegram : @dsodineum
discord : ! DS#0631
Thank you

Hello

I had a similar problem. My Solution was to change the Material option to be Raytraced, it is important that the Alpha value is below 1.

You should get something like this

Hope this helped

u r probably using non pbr material or texture,

Thank you

How can I change the material to pbr? is this something simple to do ?

How can I change the material to pbr

I suppose it’s not Blender’s competence. You may create a new
THREE.MeshPhysicalMaterial()
and apply it to your model (model’s Mesh)