Google Doodle
Google Doodle
Creation of an animated Google Doodle
26 February 2020
The main goal of this assignment was to apply the skills I've learned about HTML, CSS and JavaScript coding and present it to my peers as a Google Doodle animation.
Skills:
Used Figma to create a mock up of an eye catching Google doodle and transfer the created shapes into SVGs to be animated.
Coded animated web content using HTML, CSS and JavaScript.
Implemented version control for the project using GitHub and Visual Studio Code.
I was asked to create an animated Google Doodle to apply and demonstrate the skills I had learned in the HTML and JavaScript languages. Though not submitted to Google, the project resulted in a working prototype which I presented to several of my peers.
Situation— I needed to create a functioning and error free Google Doodle using various web languages.
Tasks— Designing and coding a functioning Doodle, and making it just long enough to hold someone's interest, but not long enough to interrupt them
Action—The first thing I did was decide on a topic and art direction for the project. With this done I used Figma, a cloud based design system similar to Adobe Illustrator, to create the shapes and text needed for the project and converted them to SVG format. Then, using GitHub and Visual Studio Code, I coded positioned and animated the SVG shaped into a clean and cohesive animation.
Results—The result was an animation that was long enough to be entertaining to a viewer, but not long enough for them to make them feel like they were being slowed down.