Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Day2

248c631ecc5f3fa54d94b3746e7cb52f?s=47 Taeyoon Choi
August 20, 2016
370

 Day2

248c631ecc5f3fa54d94b3746e7cb52f?s=128

Taeyoon Choi

August 20, 2016
Tweet

Transcript

  1. 코드 시 쓰기 SeMA 비엔날래 미디어시티서울 2016 / 불확실한 학교

  2. ৬੉౵੉:Mediacityseoul_2016 ࠺޻ߣഐ: mcs123456789 IUUQVODFSUBJOUZTDIPPMPSHEBZ

  3. 코드? 시 Code? Poem

  4. 1. 개발 환경 Developing environment

  5. ࢲ࠳ۄ੐ ఫझ౟ https://sublimetext.com

  6. ࢲ࠳ۄ੐ ߓ҃ ࢝ ߄Բӝ

  7. empty-example

  8. P5 ۄ੉࠳۞ܻ ׮਍۽٘

  9. ౵ੌ ҳઑ 스케치 웹 페이지

  10. 개발자 도구 ౵੉য಩झ۽ झா஖ ࠁӝ

  11. ѐߊ ജ҃ ѐߊ ೒۽਋ 1.௏٘ ߸҃ 2.ࢲ࠳ۄ੐ীࢲ ੷੢ (Ctrl +

    S, Command + S) 3. ౵੉য಩झীࢲ ܻ೐ېद (Ctrl + R, Command + R) ࢲ࠶ۄ੐ ౵੉য಩झ
  12. 2. 글자와 숫자 letters and numbers

  13. Edward Ruscha. OOF. 1962

  14. function setup(){ createCanvas(windowWidth,windowHeight); } 브라우저 윈도우의 너비와 높이

  15. “Ӗ ղਊ” 큰따옴표 사용

  16. function draw() { textAlign(CENTER); textSize(150); textStyle(BOLD); text(“OOF", windowWidth / 2,windowHeight

    / 2); } 윈도우 너비의 절반 윈도우의 높이의 절반 중심 스타일 “ 글 ”
  17. None
  18. 3. 코드 시 Code poems

  19. //Ҋ਷ |Ӓ Ԣ} function setup() { createCanvas(windowWidth, windowHeight); } function

    draw() { background(230,140,140,100); fill(255,255,255,100); textSize(50); text("ղ۰т ٸ ࠁও֎ ৢۄт ٸ ࠁ૑ ޅೠ Ӓ Ԣ", 150, windowHeight/2); } 코멘트 시 내용 Opacity(ైݺب): 1~100
  20. / ੑ۱ ߑߨ

  21. None
  22. String 스트링 = 문자열

  23. //Ҋ਷ |Ӓ Ԣ} function setup() { createCanvas(windowWidth, windowHeight); } function

    draw() { background(230,140,140); fill(255,255,255,100); textSize(50); text("ղ۰т ٸ ࠁও֎ ৢۄт ٸ ࠁ૑ ޅೠ Ӓ Ԣ", windowWidth / 2 - 200, windowHeight / 2, 300,300); } Bounding box
  24. //Ҋ਷ |Ӓ Ԣ} function setup() { createCanvas(windowWidth, windowHeight); } function

    draw() { background(230,140,140); fill(255,255,255,70); textSize(50); text("ղ۰т ٸ ࠁও֎ \nৢۄт ٸ ࠁ૑ ޅೠ \nӒ Ԣ, windowWidth / 2 - 200, windowHeight / 2, 600,300); } \ ੑ۱ ߑߨ: ׮਺ ठۄ੉٘ Opacity(ైݺب): 1~100 600 300
  25. \n ੑ۱ ߑߨ: PCח ₩ ః

  26. җઁ: ૑Әө૑ ߓ਍ ղਊਸ ഝਊ೧ࢲ Ӗ੗৬ بഋਵ۽ ੉ܖয૓ ௏٘ दܳ

    ॳࣁਃ
  27. 4. 변수 variable

  28. 변수 variable i

  29. var = variable의 약자 var i = 0; 변수의 이름

    값 지정 i
  30. ৡ ஠৬ۄ On Kawara

  31. function draw() { textAlign(CENTER); textSize(150); textStyle(BOLD); text("OOF", windowWidth / 2,

    windowHeight / 2); } 윈도우 너비의 절반 윈도우의 높이의 절반 글자 중앙정렬 글자의 스타일(굵게) “ 글 ”
  32. function draw() { background(0); fill(255); textSize(200); var ਘ = month();

    var ੌ = day(); var ֙ = year(); text(ਘ + “ ” + ੌ + “,” + ֙, 250, windowHeight/2); } 월 일 년 스페이스
  33. None
  34. var द = hour(); var ࠙ = minute(); var ୡ

    = second(); text(द + " : " + ࠙ + " : " + ୡ, 250,windowHeight/2+100); 시 분 초 시계 만들기
  35. None
  36. 5. 입력 Input

  37. var ੑ۱ః = 0; function setup() { createCanvas(windowWidth, windowHeight); }

    function draw() { fill(230); noStroke(); rect(0, 0, width, height); fill(0); textSize(200); text(ੑ۱ః, width / 2, height / 2); } function keyTyped() { ੑ۱ః = key; } 변수 keyTyped 함수: 입력시 작동 key 값
  38. 키보드 입력 해보세요

  39. var ੑ۱ః = 0; function setup() { createCanvas(windowWidth, windowHeight); }

    function draw() { fill(230); noStroke(); rect(0, 0, width, height); fill(0); textSize(200); text(ੑ۱ః, width / 2, height / 2); } function keyTyped() { ੑ۱ః = key; } 변수 key 값 이것은 사각형 그리기. 이것은 왜 필요 할까요? 알아보기 위해 서 코드를 코멘 트 아웃 할까요? windowWidth
  40. 4. 연산자 operators

  41. None
  42. < ୡҗ Greater than <= ੉࢚ Greater or equal >=

    ੉ೞ less or equal > ޷݅ less than == э׮ equal to != ׮ܰ׮ not equal to
  43. function draw() { background(255); fill(255); ellipse(windowWidth/2, windowHeight/2, 100, 100); if

    (mouseX > windowWidth/2) { fill(0); ellipse(windowWidth/2, windowHeight/2, 100, 100); } } 만약에 마우스 위치가 캔버스 크기의 절반보 다 크다면…
  44. function draw() { background(255); fill(255); ellipse(width/2, height/2, 100, 100); if

    (mouseX > windowWidth/2 || mouseY > windowHeight/ 2) { fill(0); ellipse(width/2, height/2, 100, 100); } } | 는 Or mouseX가 폭의 절반보다 크거나 , mouseY 가 높이 의 절반보다 크거 나
  45. | ੑ۱ ߑߨ: Shift + \ ഑਷ ₩

  46. ࠛഛपೠ ೟Ү ࣁ޷ա/ ੹द ࣗѐ