Personal Website | Animations Exploration

You know how this kind of things work. You have your own website and you wanna look good. Especially, if making things look good is your job.

After years of making it and unmaking it, redesign after redesign (and you can see all the turbulences in the commit history of my GitHub repo), I am at a point of my life where I feel deep inside me that I know have all the pieces ready to build something truly amazing for my personal website.

I've been building UIs, designing brands and helping my own startup grow during the last three years and I wanted to have a website that really showcased all the multiple interests and things I like and do in my life.

This 2022 brought to me two things that really unblocked my creative process - the first is leveraging Green Sock Animation Plugin to build amazing animations, something that really opened doors I've always wanted to open in the realm of the web. The second being the discovery of an amazing Foundry, the Velvetine Type Foundry and their amazingly-well-designed font PilowLava.

All the pieces where there and I finally felt all the creative juices flow.

I'm a perfectionist at heart and I do sometimes struggle to share works in progress live to audiences - but for this year I wanted to follow a completely different path. I'll show you how things evolve, how I'm developing my brand, the thought process behind all the choices and also its technical development.

This shot is all about the scrolling animation I am implementing (smooth and buttery) and the desktop-only magnetic mouse-follow interaction of the logo in the header section. All built with GSAP and with web performances chiseled down to maximise load times and SEO. The following shots I'll tell you more about the concept of the brand and I'll show you how the final look of the whole website is intended to be - at the moment, the live version online is just header, contact section, credits, sexy animations and Italian translations only (and you can check it out at davidegiovanni.com).

I'd like to know what you think about how well it works on your devices and if you have any tips or resources for further enhancing the animations and the feel of the website.

See you around!

Davide

More by Davide Giovanni Steccanella

View profile