Personal Website

added a simple scroll indicator using useScroll and useSpring from motion/react

completely new sorting visualizer, fixed some bugs & new UI
fixed some contact page animations
changed the selected projects on the startpage

I did some redesign:

• moved project from startpage to own project for more professional look (30min)
• changed max-w-7xl to 6xl everywhere to make it appear more organized in the middle (30min)
• added to complete devlog & project page for the QuadIO Project from blueprint hackathon (1h)

I created two new applications:
First a procedural art generator (with lot of inspiration from the internet), also a procedural world generation (cool for playing around), I felt like something like this was missing in my portfolio.

After that I also adjusted the style of the range sliders and checkboxes to fit with the overall style of the website.

Added this cool ascii generator. I always wanted to do something like that.

I used the font from patorjk.com, copied every letter in a object called abc and named every letter with its ascii code, I used string.charCodeAt(0) for that (last picture, _ is for example 95). After that I split the input in its charcodes and then convert every code in its ascii representation which then gets added to get the output.

Im looking forward to add more fonts :D

Fixed everything because why the ship was rejected and some color changes:

fix menu color (lot of headache from debbuging) :(((
fixed every 404 project
make menu and button not full rounded, looks way cooler now
fix sort algorythm page sound glitch which happend after changing page but the sound was still playing

better matching project color algorythm for light mode projects
add robot suspense for faster loading & better seo
add contact animation and new profile picture of me

Created this cool markdown exporter where you can give your markdown a cool sharable look with presets, custom fonts, custom colors, and custom background Images like paper texture or the blueprint background like in the attached image. Then you can export it as a PNG or a PDF. I used jsPDF and html2Canvas as npm libraries. (40min)

Added a 3d museum for my ai image collection im working on. I programmed it in three.js (30min), added a cool mirror effect for the ground (30min), made it spin, draggable, interact with the mouse and added scroll interactivity (60min) and then also optimized it for mobile (30min).

I also integrated a small preview box in the startpage with a cool mouse trail image effect - credits to reactbits.dev and animated it (30min).

Im planning on uploading some cool AI images i created with nano banana pro in my google AI plan.

Remade the about section, animated everything, adjusted everything for mobile, also added different pictures of me for light / dark mode (1h).

Also changed the text animation to blur where I forgot it, for example in Projects / Applications / Tutorials. I will soon add some cool tutorials on how I did some of my components. (30min)

I also animated the website further, for example the single projects, which replay after you scroll back up. (30min)

I did a complete theme redesign and animations for almost every site. First I researched some cool designs (30min) and found using 3 shadows, a light from the top and two dark ones on the side is giving a really cool depth effect. I applied this to all of my components and adjusted some colors (1h).

After that I tried a lot of backgrounds - some blobs with color variations (30min), mesh gradients with with grain (30min) - but nothing looked right. After trying for a very long time I decided to keep only the top part of a blob with color step interpolation for a minimalistic but not boring look - also one for light theme (1h).

Then I changed a lot of components to work together with my new style - changed border radii, removed borders. (30min) I also added a cool theme change animation using a mask (1h). I also animated some more pages with cool gsap blur text effects (39min)

Then I added a cool text fill animation for the hero text using [-webkit-text-stroke:0.3px_#fff] to add a stroke to the text and then animate the fill when in viewport. (30min) I also

In the end I adjusted the robot colors again to give it a more rounded and not polygon look. (30min)

I added the robot on the homepage, this took veeery long, first I modeled it in blender (2h), added bones, weightpainted them (30min), added animations (30 min), then I converted it in pmndrs to use it (1h), I also struggled to use some of the materials in pmndrs three.js fiber so I had to remkae them (1h), added the interactivity with the mouse (2h), did a blink animation, did a color change animation for the dark / lightmode of the website (1h).

After that i refined the expertise page, added some more pictures and some text (30min)
I also added some cool reusable components like “More content coming soon” and adjusted the not found page (30min).

When I looked in the google search console I noticed the SEO got really bad so I had to redo the whole robot - split it in parts that load async (2h), added custom noise functions because the one from threejs were buggy (30min)

Then I finally fixed the buggy animation of the footer where the animated SplitText with ScrollTrigger didnt worked reliable, which turned out was because of the page navigation so I came to the conclusion to add the current path to the retrigger of the useEffect which triggered the GSAP Animation and also give it a new id for every page which makes it always reload if you change the page (4h hard debbuging)

Also worked further on my custom button with a custom svg path cover animation to have the option to animate a loader in (2h)

I added the project section, made a reference page where I can fill informations in to quickly get a nice page with the most important infos of a project. Furthermore I updated the Marquee to not reset every two spins and look a lot more clean and did the project hover animation as well. The last thing I did was adding a about page with some personal information as well as all the projects I ever did, organized into topics.

I’m working on my first project! This is so exciting. I can’t wait to share more updates as I build.