Some things you should know about me:
I am a mom! I have a dog! I work full time! I have a life! I have very little time to do dev work outside of my actual job. So that means that if my job doesn't require a skill, I rarely have the opportunity to spend time improving in that area 🤪.
An example of an area I rarely get to dabble in: Animation. I am also not very artistic. The idea of being asked to animate anything makes me nervous because I feel like I am just so abysmal at it. BUT I do really admire the people who CAN build fantastic animations.
So my mini-project for the week:
Spend 30 minutes a day trying to make some little animations. 30 minutes because that’s about all the time I get before someone requires my attention. Also it’s low pressure - no one is going to build something fabulous in 30 minutes, so I don’t have to expect too much of myself, but at least I could play around a bit in that time.
I wanted to share some of my explorations in this post, as well as share some things other people built that inspired me 🙂
First up: Some text animation
My first foray into animating is pretty shamelessly inspired by a very fantastic animation by Rachel Smith that you can check out here
Featuring: Some simple CSS animations on letters as well as very basic animation on a SVG to create a rainbow.
From there I thought I should try to be more original and not be so inspired by someone else’s work, so I came up with this other text animation, which has probably been done before as well, but it was new to me:
Moving beyond text
I saw this really cool star rating animation by Aaron Iker and thought I’d do a little rating animation of my own. It is about 75% less cool than the inspiration, but that’s ok -
Then I saw this really gorgeous Pokemon animation and 🤤 I loved it ♥️. I figured I could do something kind of similar but simpler. There's no way I can draw a Bulbasaur and a Pikachu hanging out, but I thought I could manage a sunset/moonrise:
And that’s about where I left it!
A few thoughts on the outcome:
I don’t feel like my skill level got way better through these projects... it’s probably about the same as it was before. But it gave me the confidence to try and play around and makes me want to do more in the future. I imagine if I keep practicing I will improve 🙂
😁 A challenge for you - It’s kind of a fun exercise in general, so I thought I’d challenge anyone who reads this to embark on a similar project, either by:
Pick something you want to be better at and devote 30 minutes a day for a week, see what you come up with
Or, if you want to stay in the animation genre, share in the comments an animation you’ve done that you’re especially proud of.
Thanks for reading and putting up with my shameless self-promotion of silly codepens I have built 🤗
Honourable mentions: A few other cool codepen pens I found:
Latest comments (7)
Hey Rose, I wanted to drop a comment and say how inspiring your blog posts have been since I came across them! I'm a mom of a two year old who recently transitioned into Tech as a Frontend Engineer/Designer. I have just joined a Vancouver-based startup as the first woman and a mom. It's definitely nerve-racking being new in this space. Hope to connect and look forward to reading future posts. I'm also planning on documenting my journey into the industry on this platform!
Thanks very much! Love hearing from other moms on here. And congrats on your new job! :) I'll keep an eye out for your posts 😊😊
Awesome work! I love your take on your inspirations. Thank you for including my work in here as I'm very grateful to have been one of them. Sunset and Moonrise was soothing to watch!
The growth mindset here is inspiring. The will to try is so important. I'll still play devil's advocate and argue that your skill did improve! You've exercised your imagination by adding a twist to your inspirations--I assume this would entail picking and analyzing code that you can apply to your own work. You've also established a routine for yourself and learned through repetition which is important for picking up a new skill.
Thank you again for sharing your journey and for including my work in here! It's a pleasure to see my work inspire yours, and I hope I can continue to be an inspiration or resource as I grow too. I look forward to seeing more of your work in the future!
Haha, did not expect someone whose work I linked to see this post! Thanks very much for your kind words :) very happy to have discovered you on codepen, you have a lot of really beautiful/fun posts!
Last one is my favourite ♥️, wish it had more stars...😋
lol I kind of agree now that you mention it, maybe I'll add a few more 🙃
If you can do all that with 30 minutes a day, girl you're going to be on fire in a few weeks, fantastic! :) You've inspired me to take this approach to getting better at CSS!