https://www.instagram.com/p/B885QDjicYE/
Given this link by curious Rozi on wechat. While figuring out the next step to becoming an online learning influencer, I decided to accept the challenge and build this fun little crop-and-go interaction in Processing. At a glence, it seems the program can be realized in the following steps:
- Mouse Interaction: use mouse to drag out a rectular area
- Crop Image: obtain the pixel information of the rectangle from the original image
- Animation Algorithm: turn the cropped image into an animation
Mouse Interaction:
Create a recangle using the two opposite corners, one obtained from when mouse is pressed and the other from when mouse is released.
Crop Image:
Use the rectacular info created by the the mouse interaction to crop out the area in the original PImage and save it as a new PImage.
Animation Algorithm:
To keep it simple, I am going to animate 1 PImage first and after it is working in all directions, add a 2nd image to fill up the void.
Download the processing sketch here.