If you're seeing this message, it means we're having trouble loading external resources on our website.

웹 필터가 올바르게 작동하지 않으면 도메인 *. kastatic.org*.kasandbox.org이 차단되어 있는지 확인하세요.

주요 내용

2차원 노이즈

노이즈가 1차원 공간에 있다는 아이디어는 중요합니다. 이를 2차원 공간으로 확대할 수 있기 때문입니다. 잠시 이에 대해 생각해 보도록 하겠습니다. 1차원의 노이즈에서는, 주어진 값이 이웃되는 값과 비슷한 경우가 연속되는 값이 존재합니다. 값이 1차원에 있기 때문에 두 개의 이웃 값 즉, 해당 되는 값 이전 값(그래프에서 왼쪽에 있는 값)과 이후 값(그래프에서 오른쪽 값)만 존재합니다.
코드 본질에 관한 이미지
그림 I.10 : 1D 노이즈
2차원의 노이즈도 같은 개념입니다. 둘의 차이는 값이 선형의 경로가 아니라 격자무늬에 존재한다는 것입니다. 각 모눈에 숫자가 쓰여있는 모눈종이를 생각해 봅시다. 임의의 값은 자신의 이웃인 위, 아래, 오른쪽, 왼쪽 그리고 대각선쪽 모두와 비슷합니다.
코드 본질에 관한 이미지
그림 I.11: 2D 노이즈
이 모눈종이의 각 값을 색깔의 밝기에 대응해보면 구름처럼 보이는 것을 얻게 될 것입니다. 흰색은 밝은 회색 옆, 밝은 회색은 회색 옆, 회색은 어두운 회색 옆, 어두운 회색은 검은색 옆, 검은색은 어두운 회색에 위치합니다.
코드 본질에 관한 이미지
이것은 노이즈가 처음 발명된 이유입니다. 매개 변수를 약간 수정하거나 색깔을 처리하여 좀 더 대리석이나 나무같이 유기적 질감이 나타나는 이미지를 만들 수 있습니다.
ProcessingJS에서 2차원의 노이즈를 구현할 수 있는 방법을 간단히 살펴보도록 하겠습니다. 창의 각 픽셀을 임의로 색칠하기 원한다면, 각 픽셀에 접근하여 임의의 밝기를 선택하는 내포된 반복문이 필요합니다.
noise() 함수에 따라 각 픽셀을 칠하기 위해 아까와 똑같이 수행하는데, random()을 호출하는 대신 noise()를 호출합니다.
var bright = map(noise(x,y), 0, 1, 0, 255);
개념은 좋습니다. 2차원 공간에서 모든 (x,y) 위치에 대해 노이즈 값을 제공합니다. 문제는 원하는 흐림 특성이 존재하지 않는다는 것입니다. 픽셀 200에서 픽셀 201로 건너 뛰는 것은 너무 급격합니다. 1차원 노이즈에서 시간 변수를 각 프레임마다 1이 아닌 0.01씩 증가시켰다는 것을 기억하시기 바랍니다! 이 문제는 노이즈 인수에 서로 다른 변수를 넣어서 해결할 수 있습니다. 예를 들어, 내포된 반복문을 통해 가로로 움직일 때마다 xoff 변수를 증가시키고 수직으로 움직일 때마다 yoff 변수를 증가시킵니다.
이 수업에서는 펄린 노이즈의 일반적인 사용을 알아보았습니다. 1차원의 노이즈에서는 부드러운 값을 이용하여 돌아다니는 모양의 물체의 위치를 지정하였습니다. 2차원 노이즈에서는 픽셀의 평면에 부드러운 값을 갖는 흐린 패턴을 만들었습니다. 그러나 펄린 노이즈 값은 단순히 값이라는 것을 기억하는 것이 중요합니다. 이러한 값들은 본질적으로 픽셀의 위치나 색깔을 나타내는 것이 아닙니다. 이 수업에서 모든 변수가 존재하는 예제는 펄린 노이즈를 통해 제어될 수 있습니다. 풍력을 모델화할 때 그 힘은 펄린 노이즈로 제어될 수 있습니다. 아래 프로그램에서와 같이 프랙털 트리 패턴에서 나뭇가지들 사이의 각도 또는 유동장 시뮬레이션에서 격자판을 따라 움직이는 물체의 속력과 방향에서도 마찬가지입니다.
임의성에 얼마나 의존하는지에 관한 이야기로 지난 수업을 시작했습니다. 임의성은 항상 생기는 질문, 이 물체는 어떻게 움직여야 하는가, 어떤 색깔이어야 하는가라는 질문에 대한 가장 명확한 답이 됩니다. 그러나 이 명확한 답은 게으른 답일 수도 있습니다.
이 수업을 마치면 모든 곳에 펄린 노이즈를 사용해도 좋다는 생각을 할 수도 있습니다. 이 물체는 어떻게 움직여야 할까요? 펄린 노이즈! 어떤 색깔이어야 하는가라는 질문에 대한 가장 명확한 답이 됩니다. 펄린 노이즈! 얼마나 빨리 성장해야 할까요? 펄린 노이즈!
요점은 임의성을 사용해야 하는지 또는 사용하지 않아야 하는지가 아닙니다. 또는 펄린 노이즈를 사용해야 한다 또는 사용하지 않아야 한다는 것이 아닙니다. 요점은 시스템의 규칙들을 정의하는 사람은 여러분이고, 아는 것이 많아질수록 그러한 규칙들을 구현할 때 선택사항이 더 많아진다는 것입니다. 이 수업의 목적은 프로그래밍을 할 때 여러분에게 더 많은 도구를 주는 것입니다.  여러분이 아는 모든 것이 한 가지 형태의 임의성뿐이라면 모든 설계는 한 가지 형태의 임의성을 포함할 것입니다.  펄린 노이즈는 여러분이 프로그램에서 사용할 수 있는 임의성에 대한 또 다른 도구입니다.  펄린 노이즈를 약간 연습한 후 또 다른 형태의 도구인 벡터(vectors)로 주제를 바꾸도록 하겠습니다!

본 "내추럴 시뮬레이션" 과정은 다니엘 쉬프만(Daniel Shiffman)이 저술한 "The Nature of Code"의 내용을 차용한 것이며, 본 내용물의 저작권은 Creative Commons Attribution-NonCommercial 3.0 Unported License를 적용합니다.