Minimal Model Showcase with Hotspots

Minimal 3d Showcase

3D app that can be used to showcase a 3d model or product.

Youtube 3d Showcase
:backhand_index_pointing_up:t3: YouTube

Preview
Source Code

Techs

  • Three.js
  • React.js
  • Typescript
  • Gsap
  • Tailwindcss
  • Vite
  • Blender

Features

Main

  • Orbit Controls to explore the scene.
  • View Hotspots to enhance the showcase.
  • Smooth Camera animations to professionalize the showcase.

Technical

  • Using React-Three-Fiber & React-Three-Drei to use the best of Three.js in React.js.
  • Using Gsap for smooth camera animations.
  • Using Tailwindcss for styling.
  • Using Vite as project builder.
  • Using Typescript for better development.
  • Complete CSR app with React.js.

1 Like