part 2: motivation

2020-04-17
#games

goals

  • Motivation - or keep the game interesting for more than a few seconds.

I had two ideas on how to keep my kids interested:

  1. Dinosaurs! They both enjoy playing with them, like George, or roaring like one, like George. So the idea here was to feed that dinosaur and name him "Knut". I first used free stock images from pixabay for the dinosaur but then ended up drawing my own one in Inkscape to be able to control the SVG via CSS later on. I'm hoping to add some animations or color it depending on my kids' preferences.

  2. More feedback: I wanted to add sounds so there is some more "tangible" feedback that they notice. There are cool and free sound packages easily available on the web, I ended up using this.

lessons

  • It was easy to get started thanks to the cool sounds from freesound.org and images from pixabay.com- thanks!

  • Using promises and await and async, it felt a bit strange to add a sleep to play a sound after a CSS animation finishes, but using a promise and setTimeout seems straight-forward to emulate a promise that is fulfilled once the animations stops.

  • Using Inkscape is not that scary. Should have done that earlier 🤷

result

knut-02

knut-02 - spent about 2.5 hours.

  1. Dinosaur ✅ feeding a dinosaur seems motivating enough for now.
  2. Feedback ✅ my sons kept imitating the sounds and the game doesn't work without them anymore.

Both ideas worked out well, and Knut got fed properly with lots of colored circles. My son kept asking for the dino to grow when he feeds him, so maybe that's a next step. More annoyingly the sounds sometimes don't play and I'll have to figure out why that is. Because otherwise Knut isn't getting fed!