5h 3m 32s logged

devlog 01 - starting the site

I went into this with a pretty clear idea of what I wanted, I just didn’t expect the actual design to stay the same.

The main references were:

I liked how all of them had their own identity instead of looking like a normal portfolio template. That was the main thing I wanted here too.

Visually I was going for a Wes Anderson-ish kind of thing. Not copying it, more the controlled layouts, odd colour combinations and slightly theatrical feeling.

The idea behind heith.me is also kinda recursive. The site itself is one of my portfolio pieces, and I’m going to be breaking it down in my portfolio too.

landing

I knew I wanted the opening to feel more like entering something than just seeing a hero section.

I went through multiple versions of the opening before landing on the torn-paper idea. The paper tear gave me a way to make the video feel like it was underneath the page instead of just sitting in a box.

I changed the tear quite a few times too, especially the shape and colours.

The video is an old render of mine, and one of my first animation attempts. I didn’t really want to make a completely new video just for the site, so I reused it and messed with the presentation instead.

I chopped it up, added the scanline treatment and made it more chaotic. It felt way more fitting than just putting the original render there normally.

I also originally had the text arranged diagonally.

It looked cool, but once everything was actually on the page it started fighting with the person in the centre, so I straightened it out.

A lot of the site has basically been this. I have an idea, build it, realise it doesn’t fit as well as I thought, change it.

The colours went through a lot of versions too. I have not even made a proper repo for this on github. or hosted it yet. The plan is to get the website to how i want it to look and finish it off in one commit. and ofc future changes will be committed, but i want something to show first. The entire thing is just pure html, css, and js. no frameworks.