Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Day2
Search
Taeyoon Choi
August 20, 2016
0
430
Day2
Taeyoon Choi
August 20, 2016
Tweet
Share
More Decks by Taeyoon Choi
See All by Taeyoon Choi
Prosthetics — Adaptation
tchoi8
0
81
Artist Talk at ITP
tchoi8
0
86
daum
tchoi8
0
570
workshop4
tchoi8
0
550
day3
tchoi8
0
310
Day 1
tchoi8
0
570
Experimental pedagogy
tchoi8
0
230
Unlearning disability
tchoi8
0
2.2k
This talk is not about privilege but about access.
tchoi8
0
62
Featured
See All Featured
I Don’t Have Time: Getting Over the Fear to Launch Your Podcast
jcasabona
26
1.8k
Git: the NoSQL Database
bkeepers
PRO
423
64k
A Modern Web Designer's Workflow
chriscoyier
689
190k
Scaling GitHub
holman
458
140k
Unsuck your backbone
ammeep
666
57k
Build The Right Thing And Hit Your Dates
maggiecrowley
28
2.2k
The World Runs on Bad Software
bkeepers
PRO
63
11k
Optimizing for Happiness
mojombo
373
69k
Debugging Ruby Performance
tmm1
71
11k
RailsConf 2023
tenderlove
16
720
GitHub's CSS Performance
jonrohan
1026
450k
ParisWeb 2013: Learning to Love: Crash Course in Emotional UX Design
dotmariusz
105
6.8k
Transcript
코드 시 쓰기 SeMA 비엔날래 미디어시티서울 2016 / 불확실한 학교
৬:Mediacityseoul_2016 ࠺ߣഐ: mcs123456789 IUUQVODFSUBJOUZTDIPPMPSHEBZ
코드? 시 Code? Poem
1. 개발 환경 Developing environment
ࢲ࠳ۄ ఫझ https://sublimetext.com
ࢲ࠳ۄ ߓ҃ ࢝ ߄Բӝ
empty-example
P5 ۄ࠳۞ܻ ۽٘
ੌ ҳઑ 스케치 웹 페이지
개발자 도구 যझ۽ झா ࠁӝ
ѐߊ ജ҃ ѐߊ ۽ 1.٘ ߸҃ 2.ࢲ࠳ۄীࢲ (Ctrl +
S, Command + S) 3. যझীࢲ ܻېद (Ctrl + R, Command + R) ࢲ࠶ۄ যझ
2. 글자와 숫자 letters and numbers
Edward Ruscha. OOF. 1962
function setup(){ createCanvas(windowWidth,windowHeight); } 브라우저 윈도우의 너비와 높이
“Ӗ ղਊ” 큰따옴표 사용
function draw() { textAlign(CENTER); textSize(150); textStyle(BOLD); text(“OOF", windowWidth / 2,windowHeight
/ 2); } 윈도우 너비의 절반 윈도우의 높이의 절반 중심 스타일 “ 글 ”
None
3. 코드 시 Code poems
//Ҋ |Ӓ Ԣ} 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
/ ੑ۱ ߑߨ
None
String 스트링 = 문자열
//Ҋ |Ӓ Ԣ} 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
//Ҋ |Ӓ Ԣ} 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
\n ੑ۱ ߑߨ: PCח ₩ ః
җઁ: Әө ߓ ղਊਸ ഝਊ೧ࢲ Ӗ৬ بഋਵ۽ ܖয ٘ दܳ
ॳࣁਃ
4. 변수 variable
변수 variable i
var = variable의 약자 var i = 0; 변수의 이름
값 지정 i
ৡ ৬ۄ On Kawara
function draw() { textAlign(CENTER); textSize(150); textStyle(BOLD); text("OOF", windowWidth / 2,
windowHeight / 2); } 윈도우 너비의 절반 윈도우의 높이의 절반 글자 중앙정렬 글자의 스타일(굵게) “ 글 ”
function draw() { background(0); fill(255); textSize(200); var ਘ = month();
var ੌ = day(); var ֙ = year(); text(ਘ + “ ” + ੌ + “,” + ֙, 250, windowHeight/2); } 월 일 년 스페이스
None
var द = hour(); var ࠙ = minute(); var ୡ
= second(); text(द + " : " + ࠙ + " : " + ୡ, 250,windowHeight/2+100); 시 분 초 시계 만들기
None
5. 입력 Input
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 값
키보드 입력 해보세요
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
4. 연산자 operators
None
< ୡҗ Greater than <= ࢚ Greater or equal >=
ೞ less or equal > ݅ less than == э equal to != ܰ not equal to
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); } } 만약에 마우스 위치가 캔버스 크기의 절반보 다 크다면…
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 가 높이 의 절반보다 크거 나
| ੑ۱ ߑߨ: Shift + \ ₩
ࠛഛपೠ Ү ࣁա/ द ࣗѐ