About

An original vector artwork I published from Adobe Illustrator to theme a page i’d be animating. It was a fun exercise, but it did expose some quirks in animating SVG that I could live without.

Technical snippets

the page-scroll animation on the page is handled by the plugin ScrollMagic which, provides me an admin for moving elements around. It’s the arguably quickest way to achieve a page scroll effect.

The planets (if they are moving for you) are SVG and css animation, the css being encapsulated in the SVG image code. which works in Chrome and Opera web browsers, but no Safari or Firefox.

The design was an experiment in publishing SVG images using a limited palette of 6 colours (inspired by the work of the illustrator Tom Haugomat), and aside from the background no gradients, as they use more processing power and therefore more likely to be ‘choppy’ on scrolling the screen.

To avoid the stars used in the background adding to the image weight, I had created a small group of circles and created a brush, then applied it to a line I had scrawled randomly until it had populated the galaxy adequately.

Epilogue

I will revisit the idea in the near future armed with Lottie and AfterEffects to produce micro-animations that will bring details to life.