3D Shipping Box with 3D items inside

Questions
1

3d box

I would like to create this feature in my app that will give the user the ability to select from some boxes samples from a dropdown.
The boxes will show on the screen and will be semi-transparent in the way that will show the inside box created by just typing the width, length and depth from a form located on the side of the screen.

My questions are…is this doable with threejs? Will it be too hard?
Considering that I’m new at this, is there a documentation, and would I start practicing with threejs

2

Here is a class that lets you create a transparent box from given dimentions. you can also set its transparency.

class CustomBox {
  constructor(width, height, depth) {
    this.geometry = new THREE.BoxGeometry(width, height, depth);
    this.material = new THREE.MeshBasicMaterial({ color: 0x00ff00 }); // set whatever color you want
    this.mesh = new THREE.Mesh(this.geometry, this.material);
  }
  
  setTransparency(isTransparent) {
    this.material.transparent = isTransparent;
    this.material.opacity = isTransparent ? 0.5 : 1.0;   // 
  }
}
3

Hi Marco…

Maybe this helps…

http://jrlazz.eu5.org/anim/cubefaces.html

cubefaces