HTML5 Ads in Adobe Animate: a story.
I remember the feeling. It was a feeling of surprise. It was 2005, I was 10 years old and my mother had signed me up for an Adobe Flash course. For two weeks, every afternoon, she dropped me off at an office full of computers where other 14 kids and I learned web animation.
The last day of the course we had a contest. The kid with the best animation would get to decide what dessert to buy for our graduation party. All the kids wanted chocolate cake, while I wanted cheesecake. I was sure I wouldn’t win because some kids seemed to be much better at computer stuff than me. So, as they began to play each animation, I was surprised to see how boring each one of them were. No music, bad music, no colors, bad colors, no motion bad motion. And then they played mine.
For my animation, I had Photoshopped my father’s head into a stick man and made it dance to a Shakira song. Everyone in the room bursts into a loud laughter. They played it several times. There were some more animations to be played, but our teacher sneaked by my side and asked me: “What dessert do you want?” I said chocolate cake.
Fast forward to 15 years later, I graduated from a coding bootcamp and began my journey into the tech industry. After majoring in Film Production in college and working in video post production for 4 years, I transition into tech as a Frontend Web Developer ready to merge code, video, animation, photography, design and storytelling.
Something that has come up in two of my job interviews has been development of HTML5 ads and Adobe Animate. As a web developer, knowing how to do this kind of job will open many doors for you. And if you can tell by my childhood story, everybody can learn it at any age. You just need some tech wisdom, and a lot of creative wit.
To begin, here’s a couple of key terms:
Adobe Flash (Professional): That’s the software I used to create my animation back in 2005. It no longer exists.
Adobe Animate: That’s the software that replaced Adobe Flash.
Adobe Flash Player: That’s the software needed to play my animation back in 2005. It had to be installed as a plug-in in every browser. It no longer exists.
HTML5: the original HTML and it’s subsequent versions (HTML2, HTML3, HTML4) didn’t have any way to integrate video (and many other things) naturally, that’s why Adobe Flash Player was needed. So they created HTML5, which has tags like <canvas>, <audio> and <video> to allow the manipulation of multimedia content.
ActionScript: That’s an old coding language that was primarily used for Adobe Flash. Nowadays all you need is JavaScript, even for Adobe Animate.
CSS & JavaScript: When it comes to frontend development, you need HTML to structure your website, CSS to make it look pretty and Javascript to make it act and react.
CSS3: You don’t need to worry about this. (It was a version of CSS, but as they kept upgrading CSS, they decided to dropped the numbers from the title because it’s annoying to keep up with it.)
Google Web Designer: That’s a software very similar to Adobe Animate, but it belongs to… well, Google. Also, it’s free!
Here’s some of the ads I’ve done in preparation for my interviews:
And here’s my dad dancing to Shakira:
