Avatar Controller

This project serves as a baseline for controlling ReadyPlayerMe GLTF avatars using threejs, NextJS 13, react-three-fiber. It demonstrates how to load, play, and interchange between Mixamo animations. Additionally, it includes a joystick to update the avatar's movement in a 3D scene.

Features

• Loading and displaying ReadyPlayerMe avatars
• Interchanging between Mixamo animations
• Joystick integration for avatar movement
• Local development environment

TODO

• Third person camera
• Implement user login
• Load custom ReadyPlayerMe avatars (embed iframe)
• Add keyboard controls (run, jump)
• Add physics to the scene
• Add more animations
• Deploy production

Prerequisites

• Node.js and npm (latest LTS version recommended)

How to Run & Deploy

Follow these steps to set up and run the project locally:

1. Clone this repository or download the source code.
2. Open a terminal/command prompt, and navigate to the project folder.
3. Run npm install to install the required dependencies.
4. Run npm run dev to start the development server.
5. Open your web browser, and visit http://localhost:3000.

The project will now be running locally on your machine at http://localhost:3000.

Contribution

Feel free to open issues or submit pull requests for any enhancements, bug fixes or additional features. Your contribution is much appreciated!