프로세싱 언어(그림을 그리며 배우는)

"프로세싱(Processing)" 이라는 언어는 컴퓨터 관련 학과에서 일반적으로 처음 접하게 되는 C나 Java 언어에 비해서 초보자가 쉽게 다가갈 수 있는 특성을 가지고 있어서, 예술을 비롯한 여러 분야에서 기술적인 소프트웨어 구현의 어려움을 덜 느끼면서 사용되고 있는 언어다.

요즘은 프로세싱(Processing) 언어를 이용한 미디어 아트(Media Arts) 작품을 만드는 사람들이 많이 있다. 프로세싱 언어가 다른 고급 언어들에 비해서는 아티스트들이 사용하기 쉽다는 장점 덕분인데, 그러나 아티스트들이 스스로 프로그래밍을 배워서 자신의 아이디어를 화면에 그리기에는 여전히 많은 어려움이 있다.

이 책은 프로세싱 언어로 화면에 그림을 그리기 위한 기본적인 기법들을 차례로 소개한다. 즉, 화면에 선이나 원과 같은 기본 도형을 그리고, 이 도형들을 움직이며, 도형에 자연스러운 변화를 부여하고, 마우스나 키보드를 이용해서 인터랙션을 할 수 있도록 하고, 다양한 멀티미디어를 사용하는 등과 같은 다양한 기법들을 하나씩 소개한다. 이러한 기법들이 아티스트들이 모니터 화면에 그림을 그리기 위한 기본적인 도구가 될 것이다. 이 책에 소개되는 기본적인 테크닉을 바탕으로 자신의 창의적인 작품을 만들 수 있기를 바란다.

머리말



CHAPTER 01 아름다움

하드웨어의 아름다움

소프트웨어의 아름다움

데이터의 아름다움(데이터의 시각화)

프로그램 코드의 아름다움



CHAPTER 02 프로세싱의 기초

비주얼 프로그래밍 언어

프로세싱 언어의 특징

컴퓨터 프로그래밍 기초

프로그래밍의 절차

자바, 자바 스크립트, C, C++, C# 등과 비교

프로세싱 프로그래밍 시작

프로세싱 다운하기

프로세싱 개발 환경: Processing Development Environment(PDE)

프로레싱 처음 시작하기: 화면에 원 그리기

프로세싱의 프로그램 "실행 방식 3가지"

프로세싱에서의 "프로그래밍 방식 2가지"

관련 사이트 소개

프로세싱 프로그래밍할 때의 팁

공 그리기

원 그리기

디버깅(De-Bugging) 하는 방법

기본 도형들

좌표

함수에 대하여

직접 해보자

공 움직이기

변수(variables)와 데이터 타입(data types)

변수의 사용

시스템 변수

출력문

제어문

for 반복문

while 반복문

조건문: if, else, else if

if 문 예: 공 움직임 수정

다양한 연산자

연산자의 종류

연산자의 우선 순위

함수(function)

지역 변수와 전역 변수



CHAPTER 03 그림 그리기

선을 그리자

선에 색상을 부여하자

기울어진 선

한 점을 중심으로 선을 펼쳐보자

랜덤한 선 그리기

박스로 그림 그리기 #1

[참고] 간단한 수학

덧셈, 뺄셈, 곱셈, 나눗셈

삼각함수

배열과 반복문

박스로 그림 그리기 #2

배열을 이용한 색상 팔레트 사용

원 그리기: 극 좌표계



CHAPTER 04 그림 움직이기

하나의 선을 움직이기

여러 개의 선 움직이기

움직이는(커지는) 원: #1

움직이는(커지는) 원: #2(여러 개의 원)

PVector 자료형에 대한 설명

움직이는 원: #3(원이 움직이는 궤적을 설정하자)

움직이는 원: #4(랜덤한 위치로 계속 움직이게 하자)

움직이는 원: #5(연속적인 목적지를 순환 이동)

도형의 변환(transformation)

도형 그리기

도형 이동

도형 크기 변화

도형 회전



CHAPTER 05 랜덤한 변화

내 프로그램에 변화를 주자: 랜덤 함수

선에 랜덤 노이즈를 첨가해보자

삼각함수: 선에 삼각함수를 이용해서 변형을 해보자

삼각함수: 물결처럼 요동치는 선

랜덤 선을 이용한 그림 그리기 #1

랜덤 선을 이용한 그림 그리기 #2



CHAPTER 06 인터랙션

마우스: 마우스 위치 따라 다니기

마우스: 화면의 중심에서 마우스 위치까지 선분 그리기

마우스: 마우스 주위가 어두워지는 화면

마우스: 여러 원들 중에서 마우스 위치의 원 커지기

마우스: 마우스의 움직임 속도

마우스: 마우스 클릭으로 제어하기

마우스: 1차원 배열을 이용한 버튼 클릭

마우스: 2차원 배열을 이용한 버튼 클릭

키보드: 1인용

키보드: 2인용

시간에 따라 주기적(반복적)인 행동



CHAPTER 07 필터 적용하기

이미지 픽셀 하나씩 조절하기

이미지의 픽셀 접근하기

그림 파일 사용하기

이미지 움직이기

[참고] 객체 지향 프로그래밍에 대한 소개

컬러 이미지를 흑백으로 변경하기

이미지 전체를 밝게 만들자: 얼굴을 하얗게 만드는 효과 연출

이미지 픽셀 변경하기

이미지 영역 조절하기

블러링

필터 모양을 마음대로 사용하자

필터에 의한 다양한 효과

프로세싱의 내장 필터들



CHAPTER 08 글자의 아름다움: 폰트(font)

다양한 폰트 출력

ASCⅡ Arts



CHAPTER 09 프로그래밍의 아름다움: 프랙탈

재귀 함수 예제: 몬드리안 작품

재귀 함수 예제: 나무

재귀 함수 예제: 나무 응용



CHAPTER 10 객체 지향 프로그래밍

절차적(procedural) 프로그래밍과 객체지향(object-oriented) 프로그래밍 비교

객체 지향 프로그래밍 기본

[핵심] 클래스

[핵심] 클래스를 이용한 객체 지향 프로그래밍 절차 소개

클래스 정의

클래스의 객체 인스턴스 생성

객체 인스턴스 사용

[핵심] 멤버 함수를 가진 가장 간단한 예제

[핵심] 멤버 변수를 추가하자

[핵심] 도형을 2개 그리는 경우

[핵심] 생성자(constructor)를 사용하자

사각형을 100개 만들어보자

함수의 오버로딩(overloading)

상속(inheritance)



CHAPTER 11 파티클(particles)

ArrayList 자료 구조 사용법

파티클 구현



CHAPTER 12 멀티미디어

사운드: Minim 라이브러리

동영상 재생

자신의 프로그램 실행 화면을 프레임 단위로 저장

자신의 프로그램 실행 화면을 동영상으로 저장

기타 다양한 라이브러리들

라이브러리 소개

라이브러리 사용법

OpenCV: 모자를 씌우자(얼굴 찾기)



CHAPTER 13 웹에 온라인 갤러리를 만들자

P5.js

프로세싱 언어와 다른 점

P5.js 예제



마지막 사족

정기철