As a design enthusiast, I have had the privilege of exploring various design technologies during my tenure at Parsons. Below are some of the projects I have undertaken that have helped sharpen my design skills, passion and dedication towards my creative practice.
The code used generates a simple face with an interactive gum size and eye position that changes with the position of the mouse. The background is a pattern of colourful curves which can change colour on mouse clicks. This project could be extended to include additional features or to create a more complex face with different facial expressions or animations.
The face is generated using the ellipse() function, which takes the parameters for the center of the ellipse and its width and height. The eyes are also generated using the ellipse() function with a different width and height to create the eye shape. The white part of the eye is also an ellipse(). The position of the white eye part is mapped to the X-coordinate of the mouse using the map() function.
The mouth is generated using an ellipse(). The gum is also an ellipse() and its size is mapped to the X-coordinate of the mouse. The gumshine is created using the noFill() function to create an empty shape, and then the stroke() and strokeWeight() functions are used to style the outline of the shape.
The background is generated using a pattern of curves that are created using the beginShape() and curveVertex() functions. The color of the curves is set using the stroke() function, and the weight of the curves is set using the strokeWeight() function. The color of the background is set using the background() function with parameters for the red, green, and blue values.
I then used mousePressed(); and random(); functions to change the colours of my background and the pattern on it. I used mouseX to make things move; the bubble gets bigger, the eyes sneakily move from left to right and the background elements move as well.
