Dec 08, 2018
Designing the game was the hardest part, not knowing how the design would directly convert to CSS or HTML in my head was a big hurdle to get over, but I pioneered on and stuck with the idea of a retro-inspired look and feel.
The HTML for the project was very basic containing: links to assets, audio files, lists for the help menu, and the main event Canvas. Using this HTML5 element made drawing graphics possible without the use of Flash or a Java Plugin making life and coding much much easier.
Using SASS throughout this project made me appreciate the preprocessor more, being able to nest elements without having to fuss with brackets in vanilla CSS, really helps my workflow and allows me to create designs faster, with this project and its limited CSS it maybe wasn’t worth it but throughout this I was still learning it and trying to be fluent in it.
Continuing that, I got to dive in with CSS styles I haven’t tried or used for such as CSS animations, which I used to make the text slightly flicker imitating the refresh on a CRT, using linear-gradient to create the purple and dark purple background and finally the box shadows on the text, giving the design a really retro and vintage feel.
You can see the project over on Codepen
This project was made in 2016, this blog post on the other hand was made in 2018.