Creative Artist Portfolio

Hi!

I made my creative portfolio from scratch, but I didn’t want it to feel like a normal portfolio website.

The main idea was to make the website itself feel like part of my work. It’s built around a sharp/brutalist visual style with a lot of small interactions. The cursor changes shape when hovering over things, there’s a kinetic arrow that reacts to mouse movement, and the main hero has cards constantly orbiting around the center.

I also made the second section react to scrolling, so the text doesn’t just appear normally - it comes in when you actually reach the right point.

A lot of it is basically me experimenting with how far I can push small UI interactions without making the site completely unusable.

The hardest part was definitely the interaction stuff.

The custom cursor sounds simple until you actually try to make it work properly. It needs to know what I’m hovering over, resize itself to that element, switch between elements quickly, and even detect cards moving underneath the cursor when the mouse isn’t moving.

The rotating cards were another annoying one. The whole stage rotates, but the cards need to stay upright, so I had to counter-rotate them based on the current angle.

I also had quite a few annoying deployment/config problems while building it. I used AI mainly when I got stuck on bugs or couldn’t figure out why something wasn’t behaving the way I expected.

And honestly, getting everything to work together without making the whole thing feel laggy was probably the biggest part.

I’m probably most proud of the fact that I didn’t just make a portfolio and put my work on it.

I wanted the actual website to show how I like designing and building things.

The cursor, rotating stage and arrow aren’t really necessary for a portfolio, but they’re the kind of details I wanted to experiment with. I’m also happy with the code structure now because I moved a lot of the Hero logic out of ‘App.jsx’ into separate ‘components/pages’, which made the project much easier to work on.

It’s also actually live now, which makes the whole project feel a lot more real :)

The best way to test it is on a desktop/laptop with a mouse, because a lot of the interactions are based around mouse movement.

Start in the Hero section and move the cursor around different headings, links and cards. Try leaving the mouse still while the cards rotate underneath it too.

Then move the mouse down towards the bottom of the screen and you’ll see the normal cursor change into the guide arrow. Move it slowly and then quickly to see how its behaviour changes.

After that, scroll down into the next section and watch how the text animation gets triggered.

Basically, don’t just look at the page — move your mouse around and mess with it a bit. That’s where most of the project is.