In general this week, you should work with rule-based animation, motion, and interaction. You can use the ideas below or invent your own assignment. Can you divide an idea into two parts and combine those parts? (e.g. One of you codes the input behaviors and the other one codes the output behaviors.) Can you swap sketches and riffs of your partner's work? You can complete the assignment together or break off and finish individually. Everyone should still submit their own blog post.
The inspiration for this project is "The worst volume control".
I want to make some buttons that will present unexpected changes after users press them.
The former version looks like this👇🏼. l preloaded some images and change the colors to make it more like a button panel.
👀 Some bugs ( which are not shown in the video): 1. Although it seems that other buttons will become invisible after one button is pressed, they are still here actually. If the user presses the area of the invisible button, the background will also change. I haven't figured out a way to solve this problem without affecting other parts. 2. The background changing of button2 is different from what I expected. (I think it's because that I haven't fully understood the "for loop" and "push & pop".)
👀 Things that I want to improve: 1. Let the colors of the four buttons become different. 2. Let the button disappear after pressing. 3. Let the user back homepage after clicking anywhere on the canvas.