Assignment 2: Art

Inspiration:

I was inspired to create a collection of 3D cubes after scrolling through a computer art magazine provided to us for ideas. I was struck by the intricate 3D cubes in the magazine. Shown below:

I decided to take on the challenge of creating my own version of the cubes but in 2D form. Although my version is less complex than the original, I added more colors to make it unique. I had a lot of fun working on this project, and I even made it more interactive by allowing the cubes to move with the mouse. I know there is still room for improvement, such as making the cubes change colors when clicked with the mouse, which I look forward to exploring in the future.

Coding Process:

To start, I utilized nested for loops to produce ellipses on the canvas, resulting in a textured appearance. I continued to utilize nested for loops for the nest-like front of the cubes, but found it challenging to apply the technique for creating shapes other than squares and rectangles on the remaining sides of the cube. As a result, I switched to using the quad() function in p5.js to create straightforward, color-filled quadrilaterals for the sides and tops of the cubes. I also made sure that changing the width /height of the canvas does not impact the cubes and used separate variables to determine the cube length to adjust in case the canvas become too big or too large for the cube size. 

For interactivity, I wanted the cubes to move with the cursor and accomplished this by utilizing the mouseX and mouseY variables to determine their positions. Initially, I thought about writing code for each cube with separate positions using the mouseX and mouseY variables. However, after creating the first two cubes, I realized that I could use the translate() function to duplicate the cube in different positions, which was much more efficient than plotting all the coordinates repeatedly for each cube.

Final Output:

Closing remarks:

I had so much fun working on this project and I’m proud of the artistic piece I created. Not only did it sharpen my skills in p5.js, but it solidified my belief that coding can be fun and not just a snooze fest lol. Looking forward to future projects and learning more about Interactive Media!

Leave a Reply