Some of the sketches
After looking at many other websites using three js at threejs.org I started brainstorming how I could use three js in a website, that was both cool and impressive, but also possible for me to do with so little experience with javascript and three js.
Some of the ideas I came up with were a menu website for a burger shop that would use 3d-models of the products, a portfolio-like website with a 3d model of a lion's head, a website for apple's airpods max headset, and some other website ideas around the portfolio like website idea.
After I had some ideas to work with, I started making some websites, I started with the burger shop idea as I had seen a youtube video of someone doing kind of what I wanted. After coding for a while I started thinking about what the realistic use would be for a menu website and realized that most menu websites are used on phones, and three js works best with laptops and desktops, so I dropped the idea.
I then started working on another website, one based on the portfolio idea using a 3D sculpture of the greek titan atlas. I had already sketched the site to some extent. After working on the site for a while I hit a wall, I didn't know how to do what I wanted to do, and I didn't have enough time to figure it out, so I expanded the website with another page using the 3D model of an Audi R8 car. After working on it for some time, and adding the 3D model I realized what I wanted to do was not realistic in my time frame and I wasn't very happy with the website and decided I wanted to move over to a different idea, one that was easier to make but looked more impressive.
The idea I moved over to was a portfolio website for myself, where instead of a logo I would have a 3D model of my initials MBM shaped like a cube. I sketched the website, as seen above, and started modeling the "logo". After the 3D model was finished I got to work on the website. I already had a lot of the code finished from the other websites so getting the base site up didn't take long. I then imported the 3D model and got to work animating it the way I wanted. Whenever I didn't know how to do something I used chatGPT to help, as it's very good at solving coding problems if the problems have been posted and solved online before September 2021.
I got the model on the front page to constantly rotate, and the light source for the model to follow the mouse cursor. I also made a smaller version of the model for the navbar, where the model would spin as you scrolled up and down.
