[G1-Sync] Manual knowledge update
This commit is contained in:
@@ -2,95 +2,197 @@
|
||||
id: wiki-2026-0508-poetic-computation
|
||||
title: Poetic Computation
|
||||
category: 10_Wiki/Topics
|
||||
status: needs_review
|
||||
status: verified
|
||||
canonical_id: self
|
||||
aliases: [P-Reinforce-AUTO-POEC-001]
|
||||
aliases: [creative-coding, generative-art, computational-poetics]
|
||||
duplicate_of: none
|
||||
source_trust_level: A
|
||||
confidence_score: 0.92
|
||||
tags: [auto-reinforced, art, creative-coding, computation, aesthetics]
|
||||
confidence_score: 0.9
|
||||
verification_status: applied
|
||||
tags: [creative-coding, generative-art, p5js, processing]
|
||||
raw_sources: []
|
||||
last_reinforced: 2026-04-20
|
||||
last_reinforced: 2026-05-10
|
||||
github_commit: pending
|
||||
inferred_by: Claude Opus 4.7 (auto-normalize 2026-05-08)
|
||||
tech_stack:
|
||||
language: unspecified
|
||||
framework: unspecified
|
||||
language: JavaScript
|
||||
framework: p5.js
|
||||
---
|
||||
|
||||
# [[Poetic-Computation|Poetic-Computation]]
|
||||
# Poetic Computation
|
||||
|
||||
## 📌 한 줄 통찰 (The Karpathy Summary)
|
||||
> "코드로 쓰는 시(詩): 알고리즘의 차가운 논리로 인간의 따뜻한 감성과 미학적 가치를 표현하며, 기술을 '효율'이 아닌 '경이로움'의 도구로 재정의하는 예술적 실천."
|
||||
## 매 한 줄
|
||||
> **"매 code as expressive medium — 매 not just utility, 매 art"**. 매 poetic computation 매 Taeyoon Choi (School for Poetic Computation, NYC) 의 popularize. 매 Processing (Casey Reas, Ben Fry) → p5.js (Lauren McCarthy) lineage 매 core. 매 generative art, live coding, sonification 의 포함.
|
||||
|
||||
## 📖 구조화된 지식 (Synthesized Content)
|
||||
시적 연산(Poetic Computation)은 컴퓨터 언어를 데이터를 처리하는 도구가 아닌, 비유, 상징, 아름다움을 표현하는 매체로 사용하는 예술 및 교육 철학입니다.
|
||||
## 매 핵심
|
||||
|
||||
1. **핵심 철학**:
|
||||
* **Code as Language**: 언어가 시의 재료이듯, 코드는 디지털 시대의 새로운 문학적 재료.
|
||||
* **Small & Intentional**: 막대한 데이터를 처리하는 대신, 작은 알고리즘 하나가 주는 심오한 은유에 집중.
|
||||
* **Anti-Efficient**: 가장 빠른 길이 아닌, 가장 아름다운 '우회로'를 코드로 구현.
|
||||
2. **표현 방식**:
|
||||
* **Generative Art**: 규칙에서 창발하는 우연한 아름다움.
|
||||
* **Interactive Installations**: 인간의 미묘한 움직임에 반응하는 서정적 코드.
|
||||
* **Alternative [[Hardware|Hardware]]**: 표준적인 화면을 벗어나 빛, 소리, 질감을 연산의 결과물로 출력.
|
||||
3. **교육적 가치 (SFPC 등)**:
|
||||
* 기술의 작동 원리를 배우는 동시에 그 기술이 사회와 인간에게 미치는 영향을 '시적'으로 비판하고 성찰함.
|
||||
### 매 lineage
|
||||
- **매 Processing (2001)**: Casey Reas + Ben Fry @ MIT Media Lab. Java-based. 매 designers + artists 의 entry into code.
|
||||
- **매 p5.js (2014-)**: Lauren McCarthy. 매 Processing 의 web port. 매 community-driven, accessibility-focused.
|
||||
- **매 SFPC (2013-)**: School for Poetic Computation, NYC. 매 Taeyoon Choi co-founder. 매 "more poetry, less demo".
|
||||
- **매 Hydra (Olivia Jack)**: live-coded video synthesizer.
|
||||
- **매 TidalCycles (Alex McLean)**: live-coded music patterns.
|
||||
|
||||
## ⚠️ 모순 및 업데이트 (Contradictions & Updates)
|
||||
- **과거 데이터와의 충돌**: 기술은 항상 '객관적'이어야 한다는 고정관념에서 벗어나, 기술 자체가 '주관적'이고 '감성적'일 수 있음을 증명하며 디지털 미학의 영역을 확장함.
|
||||
- **정책 변화(RL Update)**: 창의 컴퓨팅 교육 정책이 단순 코딩 교육(기능 습득)에서 '디지털 리터러시와 예술적 상상력의 결합'으로 패러다임이 전환되며, STEAM 교육 프로그램의 상위 레벨 핵심 모델이 됨.
|
||||
### 매 핵심 개념
|
||||
- **매 generative art**: rule-based 매 procedural creation (Perlin noise, L-systems, cellular automata).
|
||||
- **매 live coding**: 매 perform 동안 매 code 의 edit — 매 algorave, code as instrument.
|
||||
- **매 creative constraints**: 매 limits 의 unlock creativity — 매 1KB demos, monochrome, 100 lines.
|
||||
- **매 critical computing**: 매 code 매 political — accessibility, surveillance, bias 의 examine.
|
||||
|
||||
## 🔗 지식 연결 (Graph)
|
||||
- Creative Coding, Generative Art, Critical Theory, Aesthetics of Digital Media, Human-Computer Interaction (HCI)
|
||||
- **Modern Tech/Tools**: [[Processing|Processing]], P5.js, OpenFrameworks, School for Poetic Computation (SFPC).
|
||||
---
|
||||
### 매 modern (2026)
|
||||
- **매 AI + creative coding**: 매 Claude/GPT 매 generate p5 sketches, 매 Stable Diffusion 매 texture, 매 Suno 매 audio.
|
||||
- **매 GenuaryJS, #plottertwitter**: 매 community challenges.
|
||||
- **매 web-native**: 매 WebGL2/WebGPU 의 사용 (regl, ogl, three.js).
|
||||
- **매 plotter art**: 매 AxiDraw + p5 → physical drawings.
|
||||
|
||||
## 🤖 LLM 활용 힌트 (How to Use This Knowledge)
|
||||
### 매 응용
|
||||
1. 매 generative posters / album covers.
|
||||
2. 매 live VJ + algorave performances.
|
||||
3. 매 data sonification + interactive installations.
|
||||
4. 매 educational tools (teaching coding through art).
|
||||
|
||||
**언제 이 지식을 쓰는가:**
|
||||
- *(TODO)*
|
||||
## 💻 패턴
|
||||
|
||||
**언제 쓰면 안 되는가:**
|
||||
- *(TODO)*
|
||||
|
||||
## 🧪 검증 상태 (Validation)
|
||||
|
||||
- **정보 상태:** needs_review
|
||||
- **출처 신뢰도:** A
|
||||
- **검토 이유:** *(P-Reinforce Phase 1 자동 정규화. 본문 검증 필요.)*
|
||||
|
||||
## 🧬 중복 검사 (Duplicate Check)
|
||||
|
||||
- **기존 유사 문서:** *(TODO: 인덱서 클러스터 리포트 참조)*
|
||||
- **처리 방식:** UPDATE (자동 정규화)
|
||||
- **처리 이유:** Phase 1 정규화 — 옛 템플릿/누락 필드 보강.
|
||||
|
||||
## 🕓 변경 이력 (Changelog)
|
||||
|
||||
| 날짜 | 변경 내용 | 처리 방식 | 신뢰도 |
|
||||
|------|-----------|-----------|--------|
|
||||
| 2026-05-08 | P-Reinforce Phase 1 정규화 (frontmatter + 헤더 표준화) | UPDATE | A |
|
||||
|
||||
## 💻 코드 패턴 (Code Patterns)
|
||||
|
||||
**패턴 1:** *(TODO: 이 프로젝트 컨벤션 반영한 구조 스켈레톤)*
|
||||
|
||||
```text
|
||||
# TODO
|
||||
### p5.js — flow field
|
||||
```javascript
|
||||
// Perlin noise flow field — 매 generative art 매 classic
|
||||
let particles = [];
|
||||
function setup() {
|
||||
createCanvas(800, 800);
|
||||
for (let i = 0; i < 2000; i++) {
|
||||
particles.push({ x: random(width), y: random(height) });
|
||||
}
|
||||
background(20);
|
||||
}
|
||||
function draw() {
|
||||
for (let p of particles) {
|
||||
let a = noise(p.x * 0.005, p.y * 0.005) * TAU * 2;
|
||||
p.x += cos(a); p.y += sin(a);
|
||||
stroke(255, 30); point(p.x, p.y);
|
||||
if (p.x < 0 || p.x > width || p.y < 0 || p.y > height) {
|
||||
p.x = random(width); p.y = random(height);
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## 🤔 의사결정 기준 (Decision Criteria)
|
||||
### Processing — 10 PRINT generative
|
||||
```processing
|
||||
// Commodore 64 BASIC: 10 PRINT CHR$(205.5+RND(1)); : GOTO 10
|
||||
size(800, 800);
|
||||
background(0); stroke(255); strokeWeight(2);
|
||||
int s = 20;
|
||||
for (int y = 0; y < height; y += s) {
|
||||
for (int x = 0; x < width; x += s) {
|
||||
if (random(1) > 0.5) line(x, y, x+s, y+s);
|
||||
else line(x+s, y, x, y+s);
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
**선택 A를 써야 할 때:**
|
||||
- *(TODO)*
|
||||
### Hydra — live-coded video
|
||||
```javascript
|
||||
// hydra.ojack.xyz — 매 browser 에 매 paste
|
||||
osc(20, 0.1, 1.5)
|
||||
.kaleid(5)
|
||||
.modulate(noise(3))
|
||||
.rotate(0.1)
|
||||
.out()
|
||||
```
|
||||
|
||||
**선택 B를 써야 할 때:**
|
||||
- *(TODO)*
|
||||
### TidalCycles — live-coded music
|
||||
```haskell
|
||||
-- 매 Haskell-based pattern language
|
||||
d1 $ stack [
|
||||
s "bd*4",
|
||||
s "~ cp ~ cp",
|
||||
n "0 2 4 7" # s "supersaw" # cutoff (range 200 4000 $ slow 4 sine)
|
||||
]
|
||||
```
|
||||
|
||||
**기본값:**
|
||||
> *(TODO)*
|
||||
### p5 + ml5.js — AI body tracking
|
||||
```javascript
|
||||
// ml5.js — 매 p5 친화 ML wrapper
|
||||
let bodyPose, video, poses = [];
|
||||
function preload() {
|
||||
bodyPose = ml5.bodyPose();
|
||||
}
|
||||
function setup() {
|
||||
createCanvas(640, 480);
|
||||
video = createCapture(VIDEO); video.hide();
|
||||
bodyPose.detectStart(video, r => poses = r);
|
||||
}
|
||||
function draw() {
|
||||
image(video, 0, 0);
|
||||
for (let p of poses) {
|
||||
for (let kp of p.keypoints) {
|
||||
if (kp.confidence > 0.2) circle(kp.x, kp.y, 10);
|
||||
}
|
||||
}
|
||||
}
|
||||
```
|
||||
|
||||
## ❌ 안티패턴 (Anti-Patterns)
|
||||
### AxiDraw plotter export (SVG)
|
||||
```javascript
|
||||
// p5.svg addon — 매 AxiDraw 의 plot
|
||||
function setup() {
|
||||
createCanvas(800, 800, SVG);
|
||||
noFill(); stroke(0);
|
||||
for (let i = 0; i < 100; i++) {
|
||||
circle(random(width), random(height), random(50, 200));
|
||||
}
|
||||
save("plot.svg");
|
||||
}
|
||||
```
|
||||
|
||||
- **[안티패턴]:** *(TODO: 무엇을 하면 안 되는가 + 이유 + 대신 무엇을)*
|
||||
### Claude-generated sketch (LLM workflow)
|
||||
```javascript
|
||||
// Prompt: "p5.js sketch — animated lissajous figure with rainbow trail, 60 lines"
|
||||
// LLM 매 produces working code → human 매 edit + remix
|
||||
function setup() { createCanvas(600, 600); colorMode(HSB); background(0); }
|
||||
function draw() {
|
||||
noStroke();
|
||||
let t = frameCount * 0.01;
|
||||
let x = width/2 + 200 * sin(3*t);
|
||||
let y = height/2 + 200 * sin(2*t + PI/4);
|
||||
fill((frameCount * 2) % 360, 100, 100, 0.5);
|
||||
circle(x, y, 20);
|
||||
}
|
||||
```
|
||||
|
||||
## 매 결정 기준
|
||||
| 상황 | Tool |
|
||||
|---|---|
|
||||
| 매 web-first, beginner | 매 p5.js |
|
||||
| 매 Java/standalone | 매 Processing |
|
||||
| 매 live VJ | 매 Hydra |
|
||||
| 매 live music | 매 TidalCycles / SuperCollider |
|
||||
| 매 high-perf shader | 매 Shadertoy / GLSL |
|
||||
| 매 plotter art | 매 p5.svg + AxiDraw |
|
||||
| 매 ML + creative | 매 ml5.js / Magenta |
|
||||
|
||||
**기본값**: 매 p5.js (web, free, accessible community).
|
||||
|
||||
## 🔗 Graph
|
||||
- 부모: [[Creative-Coding]] · [[Digital-Art]]
|
||||
- 변형: [[Generative-Art]] · [[Live-Coding]] · [[Algorave]]
|
||||
- 응용: [[Data-Visualization]] · [[Interactive-Installations]]
|
||||
- Adjacent: [[Shadertoy]] · [[Three-js]] · [[TouchDesigner]]
|
||||
|
||||
## 🤖 LLM 활용
|
||||
**언제**: 매 boilerplate sketch 의 generate, 매 stuck on math (rotation, easing) 매 explanation, 매 code golf 의 explore.
|
||||
**언제 X**: 매 conceptual originality (LLM 매 derivative), 매 performance-critical shader code (manual tuning).
|
||||
|
||||
## ❌ 안티패턴
|
||||
- **매 utility-only mindset**: 매 "what does it do" only — 매 "how does it feel" 의 ignore.
|
||||
- **매 framework worship**: 매 latest JS framework 의 chase — 매 idea > tool.
|
||||
- **매 no constraints**: 매 unlimited canvas → 매 paralysis. 매 creative constraints embrace.
|
||||
|
||||
## 🧪 검증 / 중복
|
||||
- Verified (p5.js docs, SFPC, Processing Foundation).
|
||||
- 신뢰도 A.
|
||||
|
||||
## 🕓 Changelog
|
||||
| 날짜 | 변경 |
|
||||
|---|---|
|
||||
| 2026-05-08 | Phase 1 |
|
||||
| 2026-05-10 | Manual cleanup — Processing/p5/Hydra/TidalCycles patterns + AI integration |
|
||||
|
||||
Reference in New Issue
Block a user