Maggie Mertz Chameleon Curves

The-Chameleon-Farm-ElwoodMy Chameleon Scale project extremely enjoyable to make. I’m still not quite sure why things worked as they did, but I am quite happy with the results. There are 16 different programmed colors, each changing with a different key being pressed. When delete is pressed, it clears the scale’s canvas space to start a new scale pattern. I was inspired by the spirals. They reminded me of scales, and since I love the cool colors of Chameleons, I wanted to create a program that allows different color and pattern combinations. My project also has a random color option, so that when Q is pressed, it creates a different color each time. One of the other elements that was fun to experiment with is the way the spiral is drawn. So move your mouse around the canvas, and see how the x and y position of the mouse effect the spirals direction and speed, but also the height and width of the ellipses. I had a lot of fun creating this, and having my friends make a few of the possibilities that I am showing below.

 

sketch

Screen Shot 2015-10-01 at 11.38.20 PM

Screen Shot 2015-10-01 at 11.25.44 PM  Screen Shot 2015-10-01 at 11.30.57 PM Screen Shot 2015-10-01 at 11.31.56 PM Screen Shot 2015-10-01 at 11.32.47 PM  588850-3-chameleon_opt  My Inspiration!!! Aren’t they amazing? There are over 100 species of Chameleons!! chameleon-sitting-on-tree-branch panther-chameleon

Project 5

The curve I selected was a simple spiral. However, a specify spiral I found on Mathworld called a daisy spiral. A daisy spiral is unique from a regular spiral in that it (a) is composed of ellipse components and (b) increases in size and spacing as the ellipses are further from the center. These unique aspects of the daisy spiral have the potential to give the daisy spiral unique qualities, such as appearing to be composed of many wider spirals combined alligned radially.

 

Daisy_1000

daisy_center

In order to create this, I used the equation for the spiral:

r = a*(theta)

r = radius, a = orientation (of the spiral), theta = angle

I created each ellipse using a for loop that used its radius and theta values in sin and cosine expressions in order to place the ellipses in proper (x,y) coordinates. In the for loop, I modified the ellipse size and the spacing of the circles to increase with each loop.

Later on, I added rectangles to the spirals. I also modified the code to change the color, size and orientations of the spirals in coordination with the mouse position.

MouseY : changes the size and color of the spirals.

MouseX: changes the orientation and color of the spirals.

sketch

 

zislamha RogerSectionB Project-05-Curves

My project is inspired by concentric circles and explosions. It is representative of a contained explosion. I was very scared going into this assignment because of my lack of knowledge on coding and generating curves. My laptop is lagging profusiously, and I have no idea how this will look on a computer that actually works/ is not from the stone age like mine. Enjoy!

sketch

Jitaekim-Project05-Curves

sketch

Screen Shot 2015-10-01 at 11.23.18 PMScreen Shot 2015-10-01 at 11.23.09 PMScreen Shot 2015-10-01 at 11.23.43 PM

I decided to play around with Lissajous curves and have the user interact with what the curves can do by changing the variables that control the x and y coordinates. I also created a blackout mode that lets the user see the curvature more clearly while the original mode gives a better sense of depth the curvature creates on the canvas. The buttons on the left and right, and the left and right arrows changes the variables that were mentioned before. Because of the nature of the lissajous curve, I couldn’t incorporate mouseX or mouseY because it would just create random curves depending on where the mouse was at, but I gave more options for the user to change between the given options I created to make it more interactive.

Project-05-Curves

sketch

This was a scary project to start, what with so many curves to explore, yet each with their own complicated formulas. In the end, I decided to go with the Lissajous curve because of how well the negative space can be manipulated to form interesting compositions. When the user moves the mouse up and down, it causes the vertical angular frequency to either increase or decrease which is what causes the movements in the lines. I chose to keep the lines white against the dark blue background because the constant motions and strong contrast of colors create a strong visual tension. Additionally, it feels hypnotic if you leave the mouse down or up for a while and just stare at it while it changes.

Screen Shot 2015-10-01 at 9.32.58 PM Screen Shot 2015-10-01 at 9.33.02 PM Screen Shot 2015-10-01 at 9.33.06 PM Screen Shot 2015-10-01 at 9.33.08 PM Screen Shot 2015-10-01 at 9.33.16 PM Screen Shot 2015-10-01 at 9.48.18 PM

RogerSectionE-05-Curves

This project was a great opportunity to implement math and visual communication. For my project I used two lissajou curves next to one another. I mapped the y-coordinate of my mouse to the tightness of the lissajou curve. Depending on where your mouse is positioned on the canvas, the lissajou curves will seemingly move with the mouse. When the mouse is pressed the width of the curve is constricted by 20 points. The width then is reset after 5 clicks.

I found this to be a very helpful project for my understanding of coding actual math concepts and making it intriguing and interactive.

Project_05_Curves

Dsfrank Project 5: Curves Orbit

I started off just playing around with the different curves I could make with a parametric form of one of the equations. I soon found out you could make radically different curves with minor changes to the A and B constants. I didn’t take any pictures but you can see many of the different shapes one formula can make here. Once I started animating it, things started to come together, but I wanted to make it possible to interact without it changing shape radically every time you move the mouse.download
I had the idea to only assign mouse values when the user clicked and then assigned behaviors to each curve based on its location in an array. I also had the scale change based on mouse position and then implemented physics so it would follow the mouse around the screen. Things look really interesting when you click multiple times in the same location.
`download (1)

I hope it runs ok in the embedded form. There wasn’t much slowdown on my computer until you had upwards of 10 curves on screen at once. If you have too many curves hit backspace and if you want to pause the animation, hit enter.

curves

Project 05- Samantha Mack

For this project, I chose to explore the gear curve and incorporate a Steampunk aesthetic to explore the theme of invention. I enjoy the contrast between the solid graphic form of the curve and the complexity of the background. I found it interesting to work with different contexts of mouse use; vertical movement affects gear size and horizontal movement makes the gear spin, so the user can play with one or a combination of both. The background invites play as well: only when the mouse is pressed, the style and color of the background change. I experienced the combined value of various techniques we’ve covered in expressing a cohesive aesthetic that interests me. Special thanks to Math major Gidon Orelowitz for his support.:)

Below are two alternate possibilities for the background, if the “if” statements were to be reversed in the code…

Screen Shot 2015-10-01 at 10.23.55 PM     Screen Shot 2015-10-01 at 10.27.23 PM

…And two screen shots of the final code in different states:

Screen Shot 2015-10-01 at 10.29.05 PM Screen Shot 2015-10-01 at 10.31.29 PM

sketch

Omar – Project 05 Curves

With this investigation into curves, I decided to pick a Devil’s Curve – and if we’re being entirely honest, I first looked into the Devil’s Curve because of the name. I used two different display methods for the Devil’s Curve: one with a continuous line, and another with points represented by small ellipses. In addition to this, the mousePressed function also moderates the detail of the curve, ranging from a very blocky display to a smooth one. I’m not sure why, but for some reason the curve isn’t displayed till the user clicks once.

***CLICK TO START***

sketch