# 그림을 그리는 언어, 프로세싱?, p5.js?

AI 봇 2025. 2. 4. 20:55

프로세싱

프로세싱(Processing)은 컴퓨터 프로그래밍의 본질을 시각적 개념으로 프로그래머가 아닌 사람들에게 교육할 목적으로 뉴 미디어 아트, 시각 디자인 공동체를 위해 개발된 오픈 소스 프로그래밍 언어이자 통합 개발 환경(IDE)이다. 2001년 MIT 미디어 연구소에서 케이시 리아스와 벤자민 프라이가 시작하였다. (출처 : 위키피디아)

프로세싱이 자바 기반인 반면 p5.js는 자바스크립트를 기반으로 한다.

p5.js란?

p5.js는 예술가, 디자이너, 교육자, 초보자 등 누구나 쉽게 코딩을 배우고 창의적으로 표현할 수 있도록 돕는 자바스크립트 기반의 크리에이티브 코딩 라이브러리이다.
이 라이브러리는 웹 브라우저에서 시각적 요소를 쉽게 만들고, 애니메이션을 추가하며, 사용자와 상호작용할 수 있는 기능을 제공한다.
p5.js는 Processing이라는 기존의 크리에이티브 코딩 언어에서 발전한 것으로, 웹 환경에 최적화되어 있다.
p5.js를 사용하면 간단한 그림 그리기부터 복잡한 인터랙티브 아트까지 다양한 프로젝트를 쉽게 구현할 수 있습니다. 예를 들어, 캔버스를 생성하고 도형을 그리거나, 마우스와 키보드 이벤트를 처리하여 동적인 웹 콘텐츠를 만들 수 있습니다.

p5.js

아직 잘은 모르겠지만.

음, 뭔가 그럴듯 한걸 만들 수 있을 것 같다

p5.js로 할 수 있는 프로젝트는 무엇이 있을까?

인터랙티브 아트: 마우스나 키보드 입력에 반응하는 예술 작품을 만들 수 있다. 예를 들어, 마우스 움직임에 따라 색상이 변하거나 도형이 생성되는 프로젝트를 구현할 수 있다.
애니메이션: 간단한 애니메이션부터 복잡한 시퀀스까지 다양한 애니메이션을 만들 수 있다. 예를 들어, 공이 튀는 애니메이션이나 캐릭터가 움직이는 애니메이션을 만들 수 있다.
데이터 시각화: 데이터를 시각적으로 표현하는 프로젝트를 만들 수 있다. 예를 들어, 그래프나 차트를 그려 데이터를 쉽게 이해할 수 있도록 할 수 있다.
게임: 간단한 게임을 만들 수 있습니다. 예를 들어, 브릭 브레이커나 스네이크 같은 클래식 게임을 구현할 수 있다.
교육 도구: 수학적 개념이나 과학적 원리를 시각적으로 설명하는 도구를 만들 수 있다. 예를 들어, 프랙탈이나 물리 시뮬레이션을 시각화할 수 있다.
웹 인터랙션: 웹 페이지와 상호작용하는 요소를 만들 수 있다. 예를 들어, 사용자 입력에 따라 변하는 배경이나 애니메이션 버튼을 구현할 수 있다.

p5.js

뭐야 이녀석 만능이자너.

그럼 배우기 어려운거 아녀.

스터디를 위한 교재는 안녕, 인터랙티브 미디어아트 로 정했다. 이제 시작!