Today! (alot of days)

This devlog is going to be long! But first of all. i added a custom cursor to the site which is a little dot that gets bigger and makes a sound when hovering over specified items. After that i made some mobile work cards, because previously i had 3d cards which were too big for mobile and just annoying. (The 3d cards still are on bigger screens)

I started working on the footer which was pretty easy the whole functionality of it is to show my email and copright, but i added some really cool stuff when i got finished with that. I added a background noise which plays when you enter the site and some other sounds like, mouse movement, clicking, and hovering specified items like i mentioned before. I did come across an issue which was that i could not play a sound when someone got on to the site so i had to make the user interact which i did with a starting screen kind of like how games have a main menu.

I made the site in english but now its in dutch because my clients will be mostly from the country i live in but i might add translations if i somehow get more popular. I did some research and the ways i couldve added it was with json which then loads onto the html which i was too lazy to do and i couldve done live translations but that will slow my website down and i want a fast loading site!

TODAY

I fixed the seperation lines on my website which used to be div tags but the positioning of them was super annoying to do and im soo dumb that i forgot that you could just use border-bottom in css so i removed the line divs and for every section i now just have a border bottom which looks the exact same but fixes some issues i had with it.

After that i spent a lot of time researching, reading docs, and watching tutorials on threejs on how i would make a round carousel with the projects i worked on. So i created a new threejs scene for my projects and found out how to use pi and math to loop through the amount of cards i want and place them in a ring-like shape around the center. I added orbital controls, limited the vertical control, and added damping so the scrolling of them was super smooth. After i did that i wanted to add images to them and lastly i added a way to click them and if you do. It opens the link to the project which was super hard to do, because i had to do raycasting in threejs but after following this tutorial it finally worked! (https://www.youtube.com/watch?v=QATefHrO4kg) Still after following the tutorial i had a problem which was whenever you dragged and held your mouse above a card. it opened the link even if you were just trying to drag but i also found out how to fix that.

The hardest thing yet in this project is 3d maths and especially implementing them into a library which i have never used before. It is super fun to do so and i reccomend everyone to give threejs a try!

If anyone has any reccomendations for my site i would love to hear them. Thanks for reading this devlog!

Today

i finished the landing page and the about me section in which i added a sleek and minimalistic style with my name and my surname written in the font: “Instrument Serif” which i got from google fonts

I added the dm mono font inside of the html head element so i can use it for other text on the page like the navigation bar at the top with about, work and contact. and also for the about me section where i explain where i come from how i got in contact with coding and what my goals are.

after that i actually started working on the about me page. I included an image of myself and a text which tells what i do, what school i’m on and why people who need a website should choose me as their developer and designer.

I also added a little work section which is not done yet. Inside of the work section i want to make a 3d carousel with threejs but i have found it really hard to use, search and implement mathematical functions for the circle in which the projects will be so thats a bummer but i, thinking of learning 3d math for this project. I already made a renderer and a camera for the carousel the only thing thats left for that is finding out how i want to show the cards and how to implement those mathematical functions.

Today i worked on the hero page with little floating objects and a 3d grid backgrounds I made the floating objects rotate and they also have a little floating effect which uses alot of pi! I have never worked with threejs before so im pretty happy with what i currently have. Now im going to start adding text and building the rest of the site. This is only the landing page base.