Build a 3D Portfolio with React Three Fiber - Avatar animations

Let's build a 3D portfolio with Three JS and React Three Fiber in the style of David Heckhoff.

In this first chapter, we will:

  • create your own avatar with Ready Player me
  • learn how to use Mixamo animations without Blender
  • move bones independently
  • make the head follow the mouse cursor
  • display a model in wireframe mode

Get the starter pack here 🔗

Our main inspiration for the final portfolio

threejs #r3f #portfolio

▬▬▬▬▬▬ Useful L I N K S 🔗 ▬▬▬▬▬▬

Final source code

Ready Player Me



React Three Fiber documentation

R3F Drei