Wednesday 28 March 2012

FINAL SUBMISSION - Project 1

Tweak a little bit more, one more circle draw function.... so much more interesting outcome... LOVE IT!

Smoother version (in video format) PLEASE WATCH IN 720

CODE :
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 
import math ##import math library

cx = 400.
cy = 400.
rad = 300.

##define 'colors' list
colors = range(5)
colors[0] = color(10,58,74,150)
colors[1] = color(25,106,115,150)
colors[2] = color(50,166,166,150)
colors[3] = color(161, 191, 51,150)
colors[4] = color(200, 217, 74, 150)

def setup():              ##setup the sketch
    size(800, 800)
    stroke(255)         ##white stroke
    smooth()             ##smoother graphic
    frameRate(100)

def draw():                                                ##draw on the sketch
    background(240)                                  ##almost white colour, refresh sketch
    time = millis()/9000.                              ##change through time
    x = (float)(cx+rad*math.cos(time))        ##position X
    y = (float)(cy+rad*math.sin(time))         ##positin Y
                                                                ##color changer | change through positionY
    if (y<=200.):
        rc = colors[0]
    if (y>200.) and (y<=400.):
        rc = colors[2]
    if (y>400.) and (y<=600.):
        rc = colors[3]
    if (y>600.) and (y<=800.):
        rc = colors[4]
    fill(rc)
    for i in range(1, 800):                     ##loop i = 1->799
        angle = y + i/2.01                      ##angle based on position Y
                                                         ##increase i for distance between spirals
        transX = i * 1.618 * math.pow(math.sin(angle),1)      ##Xtranslation
        transY = i * 1.618 * math.pow(math.cos(angle),1)     ##Ytranslation
        width = math.pow(i, -1)                                                      ##can use sin or cos(whatever)
        ellipse(x+transX, y+transY, width+i*0.39, width+i*0.39)    ##width+i*... = amplify number(big or small)
        ellipse(x-transX, y-transY, width+i*0.2, width+i*0.2)
++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

FINAL DEVELOPED!

I chose the very last development as my final one. So need to simplify for much clearer coding.


SIMPLIFIED, COMMENTED AND MUCH MUCH CLEARER CODE
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
import math               ##import math library

cx = 400.
cy = 400.
rad = 300.

##define 'colors' list
colors = range(5)
colors[0] = color(10,58,74,150)
colors[1] = color(25,106,115,150)
colors[2] = color(50,166,166,150)
colors[3] = color(161, 191, 51,150)
colors[4] = color(200, 217, 74, 150)

def setup():              ##setup the sketch
    size(800, 800)
    stroke(255)         ##white stroke
    smooth()             ##smoother graphic
    frameRate(100)

def rcfunction():        ##random colours function
    if (mouseY<=200):
        rc = colors[0]
    if (mouseY>200) and (mouseY<=400):
        rc = colors[2]
    if (mouseY>400) and (mouseY<=600):
        rc = colors[3]
    if (mouseY>600) and (mouseY<=800):
        rc = colors[4]
    fill(rc)

def draw():                                                     ##draw on the sketch
    background(240)                                       ##almost white colour, refresh sketch
    time = millis()/9000.                                   ##change through time
    x = (float)(cx+rad*math.cos(time))            ##position X
    y = (float)(cy+rad*math.sin(time))             ##positin Y
    ##color changer | change through positionY
    if (y<=200.):
        rc = colors[0]
    if (y>200.) and (y<=400.):
        rc = colors[2]
    if (y>400.) and (y<=600.):
        rc = colors[3]
    if (y>600.) and (y<=800.):
        rc = colors[4]
    fill(rc)
    for i in range(1, 800):                               ##loop i = 1->799
        angle = y + i/2.01                                ##angle based on position Y
                                                                    ##increase i for distance between spirals
        transX = i * 1.618 * math.pow(math.sin(angle),1)                ##Xtranslation
        transY = i * 1.618 * math.pow(math.cos(angle),1)              ##Ytranslation
        width = math.pow(i, -1)                                                      ##can use sin or cos(whatever)
        ellipse(x+transX, y+transY, width+i*0.39, width+i*0.39)    ##width+i*... = amplify number(big or small)
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=

ONE STEP BACK AND RESTART!

I went back the development I did before, the spiral, tornado-like circle... going on developing

Comment : The thickness and depth are increased. Love the spiral so much. So flexible, so soft, bubble, bubble liked.

CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(800,800)
    stroke(255)
    smooth()
   
colors = range(5)
colors[0] = color(10,58,74,150)
colors[1] = color(25,106,115,150)
colors[2] = color(50,166,166,150)
colors[3] = color(161, 191, 51,150)
colors[4] = color(200, 217, 74, 150)

def rcfunction():
    if (mouseY<=200):
        rc = colors[0]
    if (mouseY>200) and (mouseY<=400):
        rc = colors[2]
    if (mouseY>400) and (mouseY<=600):
        rc = colors[3]
    if (mouseY>600) and (mouseY<=800):
        rc = colors[4]
    fill(rc)

       
def draw():
    background(240)
    rcfunction()
    for ii in range (1,800):
        trans = mouseY + ii
        xx = ii * 3.14 * math.pow(math.sin(trans),1%2)
        yy = ii * 3.14 * math.pow(math.cos(trans),1%2)
        width = math.pow(ii, -25)
        ellipse(mouseX+xx, mouseY+yy, width+ii*0.8, width+ii*0.8)
---------------------------------------------------------------------------------------------------------------

MORE DEVELOPMENTS!

I now try to differentiate the colours through mouse's coordinate.... developed from the colours list I had tried before... also function IF is used


Comment : White for background, also I combined the alpha into colours so made the opacity lower for more transparency effect. I love this outcome, so elegant, flexible and kind of chaotic.

CODE :
--------------------------------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(800,800)
    stroke(255)
    smooth()
   
colors = range(5)
colors[0] = color(10,58,74,150)
colors[1] = color(25,106,115,150)
colors[2] = color(50,166,166,150)
colors[3] = color(161, 191, 51,150)
colors[4] = color(200,217,74,150)

def rcfunction():
    if (mouseY>100) :
        rf = colors[0]
    if (mouseY>200):
        rf = colors[1]
    if (mouseY>300):
        rf = colors[2]
    if (mouseY>400):
        rf = colors[3]
    if (mouseY<101):
        rf = colors[int(random(0,1))]
    fill(rf)
                   
       
def draw():
    background(250)
    for i in range(1,600,2):
        angle = mouseX * i * 0.001
        x = i * 3.14 * math.sin(angle)
        y = i * 3.14 * math.cos(angle)
        width = math.pow(i, -2)
        rcfunction()
        ellipse(mouseX+x, mouseY+y, width+i*0.8, width+i*0.8)
---------------------------------------------------------------------------------------------------------------


Comment : Change a little bit, move more chaotically, randomly move forward then backward. This is the way I preferred

CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(800,800)
    stroke(255)
    smooth()
   
colors = range(5)
colors[0] = color(10,58,74,150)
colors[1] = color(25,106,115,150)
colors[2] = color(50,166,166,150)
colors[3] = color(161, 191, 51,150)
colors[4] = color(200, 217, 74, 150)

def rcfunction():
    if (mouseY<=200):
        rc = colors[0]
    if (mouseY>200) and (mouseY<=400):
        rc = colors[2]
    if (mouseY>400) and (mouseY<=600):
        rc = colors[3]
    if (mouseY>600) and (mouseY<=800):
        rc = colors[4]
    fill(rc)
                   
       
def draw():
    background(240)
    for i in range(1,600,2):
        angle = mouseX * i * 0.001
        x = i * 3.14 * math.sin(angle)
        y = i * 3.14 * math.cos(angle)
        width = math.pow(i, -2)
        rcfunction()
        ellipse(mouseX+x, mouseY+y, width+i*0.8, width+i*0.8)
---------------------------------------------------------------------------------------------------------------


Comment : Tried draw more shapes like squares, nothing really change. The outcome is just for fun but still significant to get refreshed

CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(800,800)
    stroke(255)
    smooth()
   
colors = range(5)
colors[0] = color(10,58,74,150)
colors[1] = color(25,106,115,150)
colors[2] = color(50,166,166,150)
colors[3] = color(161, 191, 51,150)
colors[4] = color(200, 217, 74, 150)

def rcfunction():
    if (mouseY<=200):
        rc = colors[0]
    if (mouseY>200) and (mouseY<=400):
        rc = colors[2]
    if (mouseY>400) and (mouseY<=600):
        rc = colors[3]
    if (mouseY>600) and (mouseY<=800):
        rc = colors[4]
    fill(rc)
                   
       
def draw():
    background(240)
    for i in range(1,600,2):
        angle = mouseX * i * 0.001
        x = i * 3.14 * math.sin(angle)
        y = i * 3.14 * math.cos(angle)
        width = math.pow(i, -2)
        rcfunction()
        ellipse(mouseX+x, mouseY+y, width+i*0.8, width+i*0.8)
        rect(mouseX+y, mouseY+x, width+i*0.2, width+i*0.2)
        rect(mouseX+y, mouseY+x, width+i*0.6-100, width+i*0.6-100)
---------------------------------------------------------------------------------------------------------------
Go back and test with PI or 2PI, also applied power into math function.... going to get new ideas!

 Comment : Spiral ladder thingy! Amazing, the movement is exactly wave-liked. I like it so much, but it kind of impossible to fill all the sketch, somehow I still felt so blank. Anyway, still a good trial though.

CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(800,800)
    stroke(255)
    smooth()
   
colors = range(5)
colors[0] = color(10,58,74,150)
colors[1] = color(25,106,115,150)
colors[2] = color(50,166,166,150)
colors[3] = color(161, 191, 51,150)
colors[4] = color(200, 217, 74, 150)

def rcfunction():
    if (mouseY<=200):
        rc = colors[0]
    if (mouseY>200) and (mouseY<=400):
        rc = colors[2]
    if (mouseY>400) and (mouseY<=600):
        rc = colors[3]
    if (mouseY>600) and (mouseY<=800):
        rc = colors[4]
    fill(rc)

       
def draw():
    background(240)
    rcfunction()
    for ii in range (1,800):
        trans = mouseY + ii
        xx = ii * 6.28 * math.pow(math.sin(trans),2)
        yy = ii * 6.28 * math.pow(math.cos(trans),2)
        width = math.pow(ii, -25)
        ellipse(mouseX+xx, mouseY+yy, width+ii*0.8, width+ii*0.8)
---------------------------------------------------------------------------------------------------------------
The rest is so blank... What can I do?! Tried to keep going...
Here another try:
 Comment : tried 2 loops, more sin & cos functions. The outcome is magnificent, it is so cool. The problem is it is so hard to get things a little bit in order, I don't know it is felt like unordered.

CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(800,800)
    stroke(255)
    smooth()
   
colors = range(5)
colors[0] = color(10,58,74,150)
colors[1] = color(25,106,115,150)
colors[2] = color(50,166,166,150)
colors[3] = color(161, 191, 51,150)
colors[4] = color(200, 217, 74, 150)

def rcfunction():
    if (mouseY<=200):
        rc = colors[0]
    if (mouseY>200) and (mouseY<=400):
        rc = colors[2]
    if (mouseY>400) and (mouseY<=600):
        rc = colors[3]
    if (mouseY>600) and (mouseY<=800):
        rc = colors[4]
    fill(rc)

       
def draw():
    background(240)
    rcfunction()
    for i in range(1,600,2):
        angle = mouseX * i * 0.001
        x = i * 3.14 * math.sin(angle)
        y = i * 3.14 * math.cos(angle)
        width = math.pow(i, -2)
        ellipse(mouseX+x, mouseY+y, width+i*0.2, width+i*0.2)
        rect(mouseX+y, mouseY+x, width+i*0.2, width+i*0.2)
        rect(mouseX+y, mouseY+x, width+i*0.2-10, width+i*0.2-10)
    for ii in range (1,800):
        trans = mouseY + ii
        xx = ii * 6.28 * math.pow(math.sin(trans),2)
        yy = ii * 6.28 * math.pow(math.cos(trans),2)
        width = math.pow(ii, -25)
        ellipse(mouseX+xx, mouseY+yy, width+ii*0.8, width+ii*0.8)
---------------------------------------------------------------------------------------------------------------

PARTICULAR POST FOR COLOUR PALETTE

I did post in the previous development process post, but for more attention I made a particular post here for the colour palette
I used kuler.com (colours by charlottebowie)
link : http://kuler.adobe.com/#themes/search?term=userId%3A701264

DEVELOPMENT - TRY, TRY AND TRY

Still applied sin, cos wave and golden ratio... Test out lots of outcomes
Here I tried with shape like circle, no lines any more.


Comment : keep the grey and white colours. Changed the shape into circle, applied sin, cos and golden ratio
The outcome is look liked a spiral wave or a tornado, so cool then.
CODE :
---------------------------------------------------------------------------------------------------------------
import math                                      

def setup():
    size(600,600)
    background(150)
    stroke(255)
    smooth()

def draw():
    background(150)
    for i in range(1,500,20):
        angle = mouseY * i * 0.001
        x = i * 1.61803399 * math.sin(angle)
        y = i * 1.61803399 * math.cos(angle)
        width = 0.00001
        ellipse(300+x, 300+y, width+i, width+i)
---------------------------------------------------------------------------------------------------------------
Make the circles appear more frequently
CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(600,600)
    background(150)
    stroke(255)
    smooth()

def draw():
    background(150)
    for i in range(1,500,2):
        angle = mouseY * i * 0.001
        x = i * 1.61803399 * math.sin(angle)
        y = i * 1.61803399 * math.cos(angle)
        width = math.pow(2, -10)
        ellipse(300+x, 300+y, width+i, width+i)
---------------------------------------------------------------------------------------------------------------
Different colours fill and stroke.... FOR THE EXPERIENCE!
Comment : The result is flexible, contrast and amazing. I love it! But still the long way to my final
CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(600,600)
    background(150)
    stroke(255)
    smooth()

def draw():
    background(150)
    for i in range(1,500,2):
        angle = mouseY * i * 0.001
        x = i * 1.61803399 * math.sin(angle)
        y = i * 1.61803399 * math.cos(angle)
        width = math.pow(2, -10)
        fill(255,0,0,50)
        ellipse(300+x, 300+y, width+i, width+i)
---------------------------------------------------------------------------------------------------------------
Tried frameRate function to smoother the animation, use 2PI formula to get some interesting results.
Also why not testing with interacting with 2 axis of mouse coordinate.

Comment : kind of pleasant result, more flexible but I felt like it lacks of something, a little bit blankly. Also tried distinguish the functions for more effects with if... etc

CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(600,600)
    background(150)
    stroke(255)
    smooth()
    frameRate(1000000)

def draw():
    background(150)
    for i in range(1,500,1):
        angle = mouseX * i * 0.01
        x = i * 6.28 * math.sin(angle)
        y = i * 6.28 * math.cos(angle)
        width = math.pow(2, -100)
        fill(255,0,0,50)
        if mouseX<300 :
            ellipse(mouseX+x, mouseY+y, width+i, width+i)
        else :
            ellipse(mouseY+x, mouseX+y, width+i, width+i)
---------------------------------------------------------------------------------------------------------------
More developments' coming
Comment : I watch and learn to make a list in http://www.khanacademy.org/science/computer-science/v/python-lists. So I tried it out right away, but where can I put it in?! I tested with the colours and also used random function to get more variable on colours. The only problems was the colours changing process too fast. Also I referenced the colours palette from kuler.com
Link here & shot : http://kuler.adobe.com/#themes/search?term=userId%3A701264

CODE I USED :
---------------------------------------------------------------------------------------------------------------
import math
   
def setup():
    size(600,600)
    stroke(255)
    smooth()
   
colors = range(5)
colors[0] = color(10,58,74)
colors[1] = color(25,106,115)
colors[2] = color(50,166,166)
colors[3] = color(161, 191, 51)
colors[4] = color(200,217,74)

def draw():
    background(50,166,166)
    for i in range(1,500,1):
        angle = mouseX * i * 0.01
        x = i * 6.28 * math.sin(angle)
        y = i * 6.28 * math.cos(angle)
        width = math.pow(2, -100)
        rf = (colors[int(random(0,4))])
        fill(rf)
        if mouseX<300 :
            ellipse(mouseX+x, mouseY+y, width+i, width+i)
        else :
            ellipse(mouseY+x, mouseX+y, width+i, width+i)
---------------------------------------------------------------------------------------------------------------

DEVELOPMENTS ON PREVIOUS TRIALS

I manage to develop more and more to get more exciting result that I would love.
Comment : tweak some values in the previous code, the shape is slightly different. The outcome is still good, but nothing different.
CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(1200,1200)
    background(255)
    stroke(0)
    smooth()

def Xfunction(z):
    return 300.*math.cos(1.6180339887*z)
   
def Yfunction(z):
    return 300.*math.sin(6.28*z)
   
   
def draw():
    background(255)
    for i in range(1, 1200.):
        z = i / 200.
        angle = mouseX*i*0.01
        trans = mouseY+i%5000
        lx = Xfunction(0.) + trans
        ly = Yfunction(0.) + trans
        x = Xfunction(z) + angle
        y = Yfunction(z) + angle
         line(lx, ly, x, y)
        line(ly, lx, y, x)
        lx = x
        ly = y
---------------------------------------------------------------------------------------------------------------

Tweak the value again, now is another different result but the style is kept
Comment : Preferred style, blossoming-flower-liked  look.
CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(1200,1200)
    background(255)
    stroke(0)
    smooth()

def Xfunction(z):
    return 300.*math.cos(1.6180339887*z)
   
def Yfunction(z):
    return 300.*math.cos(6.28*z)
   
   
def draw():
    background(255)
    for i in range(1, 1200.):
        z = i / 200.
        angle = mouseX*i*0.01
        trans = mouseY+i%5000
        lx = Xfunction(0.) + trans
        ly = Yfunction(0.) + trans
        x = Xfunction(z) + angle
        y = Yfunction(z) + angle
         line(lx, ly, x, y)
        line(ly, lx, y, x)
---------------------------------------------------------------------------------------------------------------

Still playing around by mouse, but I managed to create another new code, would be change the result significantly.

 Comment : I was "Wow, amazing". But later I felt somehow too complicated and confused. But yes, another good trial. Also I tried to change the colour style (grey & white) for more experimenting.

CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(600,600)
    background(150)
    stroke(255)
    smooth()

def draw():
    background(150)
    for i in range(500):
        angle = mouseY * i
        x = i * 1.61803399 * math.sin(angle)
        y = i * 1.61803399 * math.cos(angle)
        width = 1
        line(300+x, 300+y, width+i, width+i)
---------------------------------------------------------------------------------------------------------------

ON THE WAY STARTING OFF

I tried the code in lecture files to play around with mouse and create some cool effects.
CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(600, 600)
    background(255)
    stroke(0)
    smooth()
   
def draw():
    for i in range (500):
        angle = mouseX * i
        x = i * 6.28 * math.cos(angle)
        y = i * 6.28 * math.sin(angle)
        width = 1
        rect(300+x, 300+y, width+i, width+i)
---------------------------------------------------------------------------------------------------------------
Comment :  the changes and movements are based on the mouse's X-coordinate
The result is impressive, provided 3D look.

From that, I tried to create my own one, still based on mouse's X-coordinate
CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(600,600)
    background(255)
    stroke(0)
    smooth()

def Xfunction(z):
    return 300.*math.cos(1.6180339887*z)
   
def Yfunction(z):
    return 300.*math.sin(3.14*z)
   
   
def draw():
    background(255)
    lx = Xfunction(0.) + 300
    ly = Yfunction(0.) + 300
    for i in range(1, 600.):
        z = i / 10.
        angle = mouseX*i
        x = Xfunction(z) + angle
        y = Yfunction(z) + angle
         line(lx, ly, x, y)
        line(ly, lx, y, x)
        lx = x
        ly = y
---------------------------------------------------------------------------------------------------------------
Comment : The result is unexpected but still my first shot. Also I applied a golden ratio here.

Again, I tried something newer
Comment : I tried bigger sketch (1200x1200), also tried something deal with the mouse's Y-coordinate( here it changed the frequency of the lines appear in the sketch)
The outcome is magnificent, in fluid-form, flexible.

 CODE :
---------------------------------------------------------------------------------------------------------------
import math
   
def setup():
    size(1200,1200)
    background(255)
    stroke(0)
    smooth()

def Xfunction(z):
    return 300.*math.cos(1.6180339887*z)
   
def Yfunction(z):
    return 300.*math.sin(6.28*z)
   
   
def draw():
    background(255)
    for i in range(1, 1200.):
        z = i / 200.
        angle = mouseX*i*0.01
        trans = mouseY+i%5
        lx = Xfunction(0.) + trans
        ly = Yfunction(0.) + trans
        x = Xfunction(z) + angle
        y = Yfunction(z) + angle
         line(lx, ly, x, y)
        line(ly, lx, y, x)
        lx = x
        ly = y
---------------------------------------------------------------------------------------------------------------

QUICK RESEARCH ON GOLDEN RATIO

Quick definition : if the ratio of the sum of the quantities to the larger quantity is equal to the ratio of the larger quantity to the smaller one. The figure on the right illustrates the geometric relationship. Expressed in algebra :


















Some examples on golden ratio :
A very popular applied golden ratio by Leonardo da Vinci's - Vitruvian Man
Golden ratio on human anatomy
  More visualized golden ratio :

THE GOLDEN RATIO = 1.61803399

I got inspired by the picture of exercise 1 in lecture.... the golden ratio

For exercise 1, I did try to create one and here's the result

I made it more complicated and somehow made viewers illusive.
CODE :
---------------------------------------------------------------------------------------------------------------
import math

def setup():
    size(600,600)
    background(255)
    stroke(0)
    smooth()

def Xfunction(z):
    return 300.*math.cos(1.6180339887*z)
   
def Yfunction(z):
    return 300.*math.sin(3.14*z)
   
   
def draw():
    lx = Xfunction(0.) + 300
    ly = Yfunction(0.) + 300
    for i in range(1, 600.):
        z = i / 10.
        x = Xfunction(z) + 300
        y = Yfunction(z) + 300
         line(lx, ly, x, y)
        line(ly, lx, y, x)
        lx = x
        ly = y
---------------------------------------------------------------------------------------------------------------