The second week is getting more challenging but also more fun. I tried to animate the sketch I drew for last week.
The first thing I did is to rewrite the entire codes using variables. I was having a very difficult time drawing with coordinate system last week; And with variables, I can set every relative to center point and make shapes that relative to each other. That makes life much easer.
Next, I want to animate the eye ball of my Doraemon. I wanted it to make circular move inside the rim of eye. I spent some time thinking of ways to do that before figuring out I can use “translate” and “rotate” function.
To make the drawing more interesting, I added some little balls bouncing on the canvas, yet they ended up making the canvas look very messy. While playing around with it, I learnt that I can use alpha to adjust the transparency of an element.
The next thing I do is to play around the background color. I mapped the change of color with the movement of my mouse. And I also applied alpha value to background.
The last thing I did — which is also the part I had most problem with, is to draw a balloon and have it move along with my mouse. In order to draw a balloon, I need to use the bezier function, which is a puzzle for me. I couldn’t figure out whats the right parameters for my bezier and how to use it with “mouseX, mouseY”. I got some help from Mathura on this. She told me that I had to set every parameters in a bezier function relative to “mouseX,mouseY” in order to animate it; and she also showed me to “cheat” with the Playground. I would say that is super helpful.
Another problem I encountered while working on this assignment is that I tried to declare an object involving “mouseX, mouseY” outside “function draw”.
And of course if doesn’t work. It took me a while to figure out though. Lesson learnt that I gotta be more careful about where I declare a variable in the future.
I also drew another animation just to experiment more with shapes and animation.