Live: at010303.vercel.app
Welcome to my interactive 3D room portfolio! This project showcases a virtual room filled with numerous interactive objects. Click on these objects to engage with them—change the lighting and theme, play a game of Mario, listen to music, view my projects, and much more. Feel free to explore and interact with everything!
- React: For building the user interface.
- react-three/fiber: For rendering 3D graphics. Learn more about react-three/fiber (r3f).
- Three.js: The underlying 3D engine powering React Three Fiber. Discover more about Three.js.
- react-three/drei: A collection of useful helpers. Find out more at react-three/drei (drei).
- react-three/postprocessing: A postprocessing wrapper for @react-three/fiber. Learn more about react-postprocessing.
- leva: Provides a control panel for interactive elements. See more about leva.
- zustand: A small, fast, and scalable state-management solution. Learn more at zustand.
- react-emulatorjs: An easy way to embed an emulator into the website. Learn more about react-emulatorjs and emulatorjs.
- howler: An audio library for the modern web. See more about howler.
- gsap: A JavaScript animation library used for theme transitions. Learn more about GSAP.
- Blender: Used for creating all 3D models. Discover more about Blender.
- My Room in 3D by Bruno Simon
- Henry Heffernan Portfolio Showcase by Henry Heffernan
- Jesse's Ramen Shop by Jesse Zhou
To run this project locally, download Node.js and follow these steps:
# Install dependencies
npm install
# Run the local server at localhost:5173
npm run dev
# Build for production in the dist/ directory
npm run build
Feel free to explore and interact with everything in the 3D room. Enjoy your stay!