‘The Egg’ Animated Web Comic
I adapted the short story “The Egg” by Andy Weir into a fully responsive web comic using HTML, CSS, JS, and Procreate.
(For the best experience, please open on a computer)
For my senior creative project in college, I decided to combine my two interests, web development and illustration, into one ambitious project. My goal was to explore how interactive animation can enhance storytelling. I was inspired by this website → https://www.sbs.com.au/theboat/ and its use of scroll-triggered elements to create an immersive reading experience.
Using my elementary coding knowledge and the wonderful GSAP JS library, I was able to create simple animations triggered by the user’s scroll.
• scroll animations •
Before I started drawing anything, I wanted to make sure the scroll animations were feasible. I began testing different features of GSAP, making squares fade-in, move across the screen, and change sizes and speeds, to achieve different effects. This was a long process with lots of trial and error, but I couldn’t be happier with the final result!
• concept art •
Once I had a strong foundation for the code, I moved on to the art, exploring designs for the characters and environment. I wanted to keep the designs simple, as I would be drawing roughly 60 panels on top of the time I already spent on coding.
I wanted the human and god characters to be visually distinct, yet also compliment each other. In the end, I used solid shapes for the human, and line art for god, which helped make god feel other-worldly and more one with the environment. Additionally, their yellow and white color scheme not only stood out against the dark starry background, but also represent the colors of an egg.
• some finished panels •
