The two examples I’ve done so far have just been thrown up as bare bones HTML sites3 and have used completely different js libraries. They’re both built off already existing examples that I modified. I don’t consider that cheating but will probably move more towards from scratch construction as I get better at things.
I’ve got think more about mobile when doing interactive stuff with js. I think I can switch out jQuery for the mobile device versions and start using the virtual mouse events but there’s a different vocabulary and structure to many things when you do this. Obvious but not instinctual for me. I’m rewriting this one to deal with mobile because it will be so much more fun to follow a finger around the screen.
The goal: The chameleon is so fast it cannot be caught and it changes colors each time, you know, like a chameleon. It’s iframed in above but the full size page is here.
The start: This example is built of the svg.js library and was inspired4 by their demo example here. I played with some of the parameters to keep the chameleon around. I also added a chunk so that on mobile it’d jump when clicked rather than avoiding the mouse hover. That’s a poor replacement but sort of works for the moment.
I did learn how to get SVG code out of Illustrator which I hadn’t done before. Not a monumental feat, just a new one. Google also has an SVG drawing tool that might come in handy.