Skip to main content

For this project I was tasked to create a dynamic opening webpage interface, incorporating vector graphics and animation. I really love working with CSS animation and the whole concept of being able to create animations for the web without using any animation framework and only CSS, as one of the most basic / core / accessible languages of the web. I also love the infinitely scalable and low file size qualities of working with SVG graphics.

Certainly the trickiest part of this project for me was making the whole thing responsive. (Check out the demo and resize the window to see this in action). I also really wanted to have the butterfly on an angle, but I couldn’t quite pull that off in the time frame.

If you’re interested in CSS animation you might want to check out my ‘Logocube‘ demo, which is also created with only CSS, but also incorporates CSS 3D layers.

Filed under:
Animation, Web

Similar Projects:

Muse 001

Muse 001

An exploration of space, motion, and generative audio. Created with Three.js, Anime.js, Tone.js, Blender, and Mixamo.

Robot Animations

Robot Animations

An interactive 3D demo of a game character model with motion capture actions, created with Three.js.

Artefact 007

Artefact 007

Generative interactive 3D artwork created using Three.js.

The Partition

The Partition

A study of movement, materials, and lighting using Three.js.

Lustrous

Lustrous

3D digital artwork / animation created with three.js.

All Projects

About Me

Hi, I'm Henry Egloff - a multimedia artist, designer, and coder, based in Byron Bay Australia. I create digital art, design and code apps, write articles, and develop tutorials.

I specialise in designing and building dynamic and interactive media with languages like HTML, CSS, PHP, and Javascript, and using tools like Three.js, Blender, Adobe, and Unity.

I love working creatively and helping people learn.

I'm currently available for freelance / contract projects and online tuition roles. Learn more about me or say hello at contact@henryegloff.com.

Henry Egloff
Twitter Twitter 2 Facebook Linked In Instagram Codepen Behance Youtube Opensea Heart Dark Mode Light Mode