파이썬 프로세싱(Processing) 프로그래밍

프로세싱 개요

학습 목표

  • 프로세싱 개발 환경을 이해한다.
  • “Hello World”와 “Hello Mouse” 프로그램을 개발한다.
  • 데이터를 가져오고 작업결과를 내보내서 저장한다.

프로세싱은 단순한 프로그래밍 개발 환경으로 애니메이션에 중점을 두고 시각 지향(visually oriented) 응용프로그램을 쉽게 개발하고, 사용자에게 인터랙션을 통해 즉각적으로 피드백을 제공하도록 만들어졌다. 개발자는 누구나 코드로 아이디어를 “스케치(sketch)” 할 수 있는 수단을 원한다. 지난 10여년간 역량이 확장됨에 따라, 프로세싱은 스케치하는 역할에 더해서 고급 양산 수준 작업에도 사용될 수 있게 되었다. 최초에 예술가와 디자이너를 목표 사용자를 염두에 두고 특정 영역 자바 확장판으로 개발되었으나, 프로세싱이 점차 진화해서 대규모 설치작업, 모션 그래픽, 복잡성 높은 데이터 시각화 작업에 전체 디자인과 시제품 제작 도구로 사용되고 있다.

프로세싱 파이썬 모드는 프로세싱 확장판으로, 자바같은 프로세싱 프로그래밍 언어 대신에 파이썬 프로그래밍 언어로 프로세싱 프로그램을 작성할 수 있게 한다. 프로그래밍에 무슨 언어를 배웠는지에 관계없이, 프로세싱에 사용되는 프로그램 요소는 매우 단순하다. 만약 파이썬에 익숙하다면, API가 어떻게 동작하는지 이해할 때까지, 잠시 프로세싱과 상관있는 것을 잊는 것이 아주 좋다.

가장 최신 프로세싱 버젼은 http://processing.org/download에서 다운로드 받을 수 있다.

프로젝트에서 중요한 목적은 좀더 많은 청중에게 이런 유형의 프로그래밍을 접근할 수 있게 만드는 것이다. 이런 사유로 인해, 프로세싱은 자유로이 다운로드 할 수 있고, 사용할 수 있으며, 공개 소프트웨어다. 하지만, 프로세싱 개발환경과 핵심 라이브러리를 사용하여 개발된 프로젝트는 어떠한 목적에도 사용될 수 있다. 이 모형은 GCC(GNU Compiler Collection)와 동일하다. GCC와 연관된 라이브러리(예를 들어 libc)는 GNU 공개 라이선스 (GPL)를 따르는 공개소프트웨어로, 코드에 변경은 공개되어야 된다고 규정하고 있다. 하지만, GCC로 만들어진 프로그램은 그 자체로 공개 소프트웨어로 공개될 필요는 없다.

프로세싱 파이썬 모드는 다음과 같이 구성된다:

  • 프로세싱 개발환경(Processing Development Environment, PDE). 프로세싱 아이콘을 두번 클릭하면 실행되는 소프트웨어다. PDE는 일종의 통합개발환경(Integrated Development Environment, IDE)으로 최소 기능 구현집합으로 프로그래밍에 간단한 소개와 아이디어 한장을 테스트하는 것을 염두에 두고 설계되었다.

  • 함수 집합은 명령어, 메쏘드로 불리기도 하는데 “핵심(core)” 프로그래밍 인터페이스 즉 API와 라이브러리로 구성된다. 네트워크로 데이터를 전송하고, 웹캠을 통해서 실시간 이미지를 읽을 수 있고, PDF 형식으로 복잡한 이미지를 저장하는 유형의 고급 기능을 지원한다.

  • 파이썬 모드 추가기능(Python mode add-ons)은 파이썬으로 프로그램을 작성하면 프로세싱 프로그램처럼 보이고 동작하게 만들고, 또한 프로세싱 API에 접근할 수 있게 한다.

  • 온라인 커뮤니티 http://processing.org/.

이런 사유로, “프로세싱”을 지칭하는 것이 다소 모호할 수 있다. API, 프로그래밍 언어, 개발환경, 혹은 웹사이트를 의미하는 것인가? 각각을 지칭할 때 이런 맥락에서 주의해야 한다.

프로세싱으로 스케칭(Sketching)

프로세싱 프로그램을 스케치(sketch)라고 부른다. 아이디어는 프로그래밍을 좀더 스크립팅(scripting)처럼 느끼게 만들고, 스크립팅 과정을 접목해서 빠르게 코드를 작성하는데 있다. 스케치는 스케치북에 저장되는데, 일종의 폴더로 작성한 프로젝트를 저장하는 기본설정 위치로 사용된다. 스케치북에 저장된 스케치는 File → Sketchbook에서 접근할 수 있다. 대안으로 File → Open을 통해서 시스템 어디에서나 스케치를 열 수도 있다.

고급 프로그래머는 PDE를 사용하지 않아도 된다. 대신에 파이썬 개발 환경 라이브러리로 사용할 수도 있다. 하지만, 만약 이제 막 시작했다면, 프로세싱에 익숙해지는데 첫 몇개 프로젝트는 PDE를 사용해서 진행하는 것을 추천한다. 더 많은 목표 관객에 다가서기 위해서 개념 모형(프로그램 동작방법, 인터페이스 구축 방법, 파일 처리 방법)이 다소 다른 프로그래밍 환경과 차이가 있다.

헬로 월드 (Hello World)

“Hello World” 프로그램에 대응하는 프로세싱 프로그램은 선을 긋는 것이다:

line(15, 25, 70, 90)

상기 코드를 입력하고 Run 버튼을 클릭한다. 오디오 비디오 디바이스에 재생하기 버튼(Play button)처럼 생긴 아이콘이다. 작성한 코드 실행 결과가 회색 배경에 좌표의 두점 (15, 25), (70, 90)을 연결하는 검은 선으로 새로운 윈도우에 나타난다. (0, 0) 좌표는 출력화면 윈도우 좌측 상단끝이다. 출력화면 크기를 변경하고, 배경색깔을 지정해서 프로그램을 작성하려면, 다음과 같이 코드를 타이핑한다:

size(400, 400)
background(192, 64, 0)
stroke(255)
line(150, 25, 270, 350)

상기 프로그램은 400 X 400 픽셀 크기 윈도우를 설정하고, 오렌지-빨간색이 배경화면 색깔로 설정하고, 획 색상(stroke color)으로 흰색을 설정하고 선을 긋는다. 기본설정 디폴트로, 색은 0에서 255까지 범위에서 명시한다. stroke() 함수에 매개변수에 변형을 줘서 결과를 다르게 한다.

stroke(255)               # 획 색깔을 흰색으로 설정한다.
stroke(255, 255, 255)     # 상기 코드와 동일하다.
stroke(255, 128, 0)       # 밝은 오렌지색 (빨간색 255, 녹색 128, 청색 0)
stroke("#FF8000")         # 웹색깔(web color)로 밝은 오렌지색 설정
stroke(255, 128, 0, 128)  # 50% 투명도를 갖는 밝은 오렌지색

색을 채우는 설정으로 fill() 함수에도 동일하게 적용한다. background() 함수는 화면 윈도우를 깨끗이 초기화한다. 그리기 속성에 영향을 끼치는 모든 프로세싱 함수와 마찬가지로, 채우기(fill)와 획(stroke) 색깔은 다음 채우기와 획 함수로 변경을 주기 전까지 화면에 그려지는 모든 기하도형에 영향을 미친다.

헬로우 마우스 (Hello Mouse)

(이전 예제처럼) 문장 목록을 작성된 프로그램을 정적 스케치(static sketch)라고 부른다. 정적 스케치에서는 일련의 함수를 사용해서 작업을 수행하거나, 애니메이션과 인터랙션이 없는 단일 이미지를 생성한다. 인터랙티브 프로그램은 일련의 프레임(frame)으로 그려지고, 다음 코드에 나타나듯이 setup()과 draw()라는 함수를 추가해서 생성한다. setup()과 draw() 내장함수는 자동으로 호출된다.

def setup():
    size(400, 400)
    stroke(255)
    background(192, 64, 0)

def draw():
    line(150, 25, mouseX, mouseY)

setup() 블록은 한번 실행되고, draw() 블록은 반복적으로 실행된다. setup()을 사용해서 어떤 초기화도 할 수 있다; 상기 코드에서 화면 크기를 설정하고, 배경화면을 오렌지색으로 설정하고, 선획 색상을 흰색으로 설정한다. draw() 블록을 사용해서 애니메이션을 다룰 수 있다. size() 함수는 항상 setup() 내부 첫번째 줄에 위치해야 한다.

background() 함수는 단지 한번만 사용되기 때문에, 마우스가 이동함에 따라 화면이 선으로 채워진다. 마우스를 따라 단일 선을 그리기 위해서는 background() 함수를 draw() 함수에 이동한다. 그러면 윈도우를 깨끗이 초기화하고 (오렌지 색으로 채우고), 매번 draw()를 실행한다.

def setup():
    size(400, 400)
    stroke(255)

def draw():
    background(192, 64, 0)
    line(150, 25, mouseX, mouseY)

정적 프로그램은 극도로 단순한 예제, 혹은 일방향 선형방식으로 실행되고 나서 종료되는 스크립트에 흔히 사용된다. 예를 들어, 정적 프로그램은 시작하고, 페이지를 그려서 PDF 파일에 저장하고 종료한다.

대부분의 프로그램은 setup()과 draw()를 사용한다. 또한, 좀더 고급 마우스 처리도 도입될 수 있다; 예를 들어, mousePressed() 함수는 마우스가 눌러질 때마다 호출된다. 다음 예제에서, 마우스가 눌러졌을 때, 화면이 background() 함수로 깨끗이 초기화된다.

def setup():
    size(400, 400)
    stroke(255)
      
def draw():
    line(150, 25, mouseX, mouseY)
     
def mousePressed():
    background(192, 64, 0)

작업용 이미지 생성하기

작업한 실제 프로젝트 배포를 원치 않는다면, 대신에 산출물 이미지를 생성할 수도 있다. 이미지는 saveFrame() 함수로 저장된다.

saveFrame()을 draw()끝에 추가하면 프로그램 출력물을 숫자번호를 매긴 TIFF 형식 이미지로 저장한다. 예를 들어, screen-0001.tif, screen-0002.tif, 등등. draw()를 매번 실행할 때, 새 파일이 저장된다. 주의할 점은 수백개 파일이 스케치 폴더를 빠르게 채울 수도 있다. 다음과 같은 함수로 별도 파일이름과 파일형식을 지정할 수도 있다.

saveFrame("output.png")

번호 매겨진 순서를 갖는 동일한 작업을 수행하는데, 번호를 매길 장소에 #(해쉬)를 사용한다.

saveFrame("output-####.png")

고품질 출력물을 산출하는데 다음에 기술되는 size() 함수를 사용해서,
화면 대신에 PDF 파일에 기하모양을 쓸수도 있다.

예제와 참조문헌

많은 프로그래머가 학교에서 코딩을 배우지만, 다른 사람들은 스스로 코딩을 배운다. 스스로 학습하는 것에는 다른 사람이 작성한 코드를 보는 것이 포함된다: 코드를 변형해서 새로운 뭔가로 만들기까지 실행하고, 변경하고, 쪼개고, 기능을 향상하는 과정이다. 이러한 학습 모형을 염두에 두고서, 다운로드한 프로세싱 소프트웨어에는 수백가지 예제를 포함해서 소프트웨어의 다양한 기능과 API를 시연한다.

예제 프로그램을 열기 위해서, File &#8594 Example 메뉴을 선택하거나 PDE에서 Open 아이콘을 클릭한다. 예제 프로그램은 기능별 혹은 라이브러리(PDF, 네트워크, 비디오) 별로 그룹지어서 구분되어 있다. 예를 들어, 형태, 모션, 활판인쇄, 이미지.

목록에서 흥미로운 주제를 찾아 예제로 시험해보라. 친숙한 stroke(), line(), background() 같은 함수 뿐만 아니라 아직 다뤄지지 않은 다른 함수도 볼 수 있다.

좀더 size() 공부하자.

size() 함수는 전역 변수 폭과 높이를 설정한다. 화면에 크기가 의존하는 객체에 대해서, 항상 숫자 대신에 폭 변수와 높이 변수를 사용하라. size() 행이 변경될 때 생기는 문제를 방지한다.

size(400, 400)

# 화면 중앙을 지정하는 잘못된 방법
ellipse(200, 200, 50, 50); 

# size() 행이 변경되더라도, 항상 중앙이다.
ellipse(width/2, height/2, 50, 50);

상기 예제에서, size() 함수는 윈도우가 생성될 때 폭과 높이만 지정했다. size() 함수에 선택 옵션 매개변수는 그래픽을 렌더링하는 방법을 지정한다. 렌더러(renderer)는 프로세싱 API가 특정한 출력 함수(화면, 고사양 그래픽 카드로 구동되는 화면, 혹은 PDF 파일)에 대해 구현되는 방법을 다룬다. 기본 설정된 렌더러는 고사양 2D 벡터 그래픽으로 가장 잘 동작하지만, 속도를 희생한다. 특히, 픽셀을 직접 작업하는 것은 느리다. 몇가지 다른 렌더러가 프로세싱에 포함되어 있는데 각각 유일하게 독특한 함수를 갖는다. 너무 특정한 것에 깊이 들어가는 위험을 무릅쓰고, 프로세싱을 사용해서 다른 가능한 그리기 모드가 다음에 기술되어 있다.

size(400, 400, P2D)

P2D 렌더러는 OpenGL을 사용해서 2차원 그래픽을 더 빠르게 렌더링한다. 반면에 더 간단한 프로세싱 그랙픽 API와 프로세싱 개발환경을 사용해서 쉽게 응용프로그램을 내보낸다.

size(400, 400, P3D)

P3D 렌더러도 OpenGL을 사용해서 2차원 그래픽을 더 빠르게 렌더링한다. 공간 뿐만 아니라, 조명, 질감, 재료으로 3차원 객체와 2차원 객체를 그릴 수 있다.

size(400, 400, PDF, "output.pdf")

PDF 렌더러는 모든 기하모양을 화면 대신에 파일에 그린다. DPF를 사용하기 위해서는 size() 함수를 변형하는 것에 추가해서 Import Library (가져오기 라이브러리)를 선택하고 나서 Sketch 메뉴에서 PDF를 선택한다. 이것이 기본설정된 렌더러 사촌이지만 대신에 직접 PDF 파일에 정보를 쓴다.

데이터 적재하고 표시하기

프로세싱 API의 독특하고 유일한 측면중의 하나는 파일이 처리되는 방식이다. loadImage()와 loadStrings() 함수가 스케치 폴더의 하위 디렉토리인 data 이름 폴더 내부에서 파일을 찾는다.

파일 처리 함수는 loadStrings()을 포함하는데 문자열 객체 배열로 텍스트 파일을 읽는다. loadImage()는 이미지를 프로세싱에서 이미지 데이터에 대한 컨테이너, PImage 객체로 읽어온다.

# 스케치 데이터 폴더에서 
# 텍스트 파일과 JPEC 이미지를 읽어 적재하는 예제
lines = loadStrings("something.txt")
img = loadImage("picture.jpg")
xwMOOC Source Contact License