1 / 19

CSC 123 – Computational Art Introduction to Shape and composition

CSC 123 – Computational Art Introduction to Shape and composition. Zo ë Wood. What is art…?. Shapes We like triangles, circles and squares… Especially triangles… Composition Color /shading Warm/cool Near/far Texture Story. Circles. George Tooker. Da Vinci. Sunflowers, Van Gogh.

arlo
Download Presentation

CSC 123 – Computational Art Introduction to Shape and composition

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript


  1. CSC 123 – Computational ArtIntroduction to Shape and composition Zoë Wood

  2. What is art…? • Shapes • We like triangles, circles and squares… • Especially triangles… • Composition • Color/shading • Warm/cool • Near/far • Texture • Story

  3. Circles George Tooker Da Vinci Sunflowers, Van Gogh

  4. ellipse • Circles in Processing: ellipse(200, 150, 250, 250); ellipse(300, 250, 250, 250); ellipse(100, 250, 250, 250);

  5. Arcs Circles in Processing: noStroke(); arc(200, 200,200, 200, 0, PI+HALF_PI); arc(220, 180,200, 200, PI+HALF_PI, TWO_PI);

  6. Rectangles Cezanne

  7. Rectangles • Rectangles: background(255); stroke(0); strokeWeight(5); strokeJoin(ROUND); fill(255, 0, 0); rect(20, 100, 300, 55); noFill(); rect(10, 0, 20, 400); rect(30, 0, 20, 400); rect(310, 0, 40, 400); rect(0, 340, 400, 25); rect(0, 75, 400, 25); fill(243, 252, 3); rect(350, 370, 100, 100);

  8. Quads • Quads: background(255); stroke(108, 79, 42); fill(108, 79, 42); strokeWeight(5); strokeJoin(ROUND); quad(110, 20, 231, 28, 276, 287, 12, 301); fill(178, 123, 50); quad(120, 40, 223, 32, 289, 293, 12, 301);

  9. Triangles Monet’s Saint Lazare Station Cezanne Van Gogh

  10. Triangles • Triangles fill(255, 255, 255, 160); stroke(125, 125, 125, 255); triangle(310, 380, 20, 380, 340, 150); stroke(0); triangle(20, 380, 150, 50, 310, 380); triangle(150, 50, 340, 150, 310, 380);

  11. Shapes • 1. line(x1, y1, x2, y2) • 2. triangle(x1, y1, x2, y2, x3, y3) • 3. quad(x1, y1, x2, y2, x3, y3, x4, y4) • 4. rect(x, y, width, height) • 5. ellipse(x, y, width, height) • 6. arc(x, y, width, height, start, stop)

  12. 2D co-ordinate system • In order for the points we specify to make sense, we must know with respect to what coordinate system we are using

  13. 2D co-ordinate system • Unlike most mathematical conventions Processing’s coordinate system has (0, 0) in the upper left hand corner

  14. Order • Clockwise! • Radians to degree

  15. Composition • Fill scene • Balance scene • Golden ratio Seurat’s Bathers at Snieres Da Vinci Cezanne

  16. Composition • Balance and fill Sunflowers, Van Gogh The car has passed, G. Balla

  17. Balancing light Monet’s Saint Lazare Station

  18. Summary • Variety of shapes available in Processing • Consider your composition • Balance • Fill scene

More Related