SkySpade Premium Marketplace

I tried to make a 3D-based website using threejs library. maybe you can see on the website that I made: https://skyspade.com/. if there are suggestions, please comment below.

The model itself is really good but i will improve a bit the user experience and fix some small bugs:

  • I see both vertical and horizontal scrollbars (a simple ‘overflow: hidden’ will solve it)
  • When i click to the button for interaction, there is no way to go back
  • Also i think it would be better if the shoe stops from rotating when i’m interacting with it

Anyway it’s a good starting point! :wink: :muscle:

2 Likes

Looks good. A couple of things stand out to me:

  1. Add a loading overlay. Doesn’t have to be fancy, just something to let the user know they are waiting for the model to load.
  2. Get rid of the scrollbars
  3. The background is a little plain. That might be OK if you intend to add some more UI elements though.
  4. You’re using a model that requires attribution: https://sketchfab.com/3d-models/nike-air-max-90-1d14e4b774c34899903f4aae4b71b6eb You should credit the creator somewhere on the page.
  5. Center the model. That will make the controls work more nicely. Compare how the camera rotates around the object while keeping it centered here, while in your scene the shoe is offset from the center:

https://threejs.org/examples/webgl_loader_gltf.html

Overall, it’s not bad, but feels a little unfinished.

1 Like

Thank you for the advice. Alright, I’ll fix it according to the advice given