Artoke

셰이딩 — 빛과 그림자로 입체감 만들기

셰이딩 — 빛과 그림자로 입체감 만들기 대표 이미지
출처: 셰이딩 — 빛과 그림자로 입체감 만들기

셰이딩 — 빛과 그림자로 입체감 만들기

종이에 동그라미를 하나 그려 보자. 그냥 동그라미다. 납작하다.

그런데 왼쪽 위는 밝게 두고, 오른쪽 아래를 연필로 슬슬 어둡게 칠하면? 갑자기 그 동그라미가 이 된다. 손으로 집을 수 있을 것 같다.

선은 하나도 안 바뀌었는데 말이다. 바뀐 건 밝고 어두운 정도뿐이다.

이게 바로 셰이딩(shading)이다. 컴퓨터 그래픽에서 3D 모델이나 그림에 깊이감을 주려고, 어두운 정도를 조절하는 것.

셰이딩은 "표면 위의 빛"을 흉내 내는 것

셰이딩의 정의를 조금 정확히 말해 보면 이렇다.

물체 표면에서 빛이 어떻게 행동하는지를 가까이서 흉내 내는 것.

"가까이서"라는 말이 중요하다. 셰이딩은 그 점 하나만 본다. "여기 이 지점은 빛을 얼마나 받고 있지?" 그것만 계산한다.

여기서 자주 헷갈리는 게 있다. 그림자다.

내가 햇빛 아래 서 있으면 두 가지 일이 동시에 일어난다.

  • 내 얼굴에서 빛을 마주 본 쪽은 밝고, 반대쪽은 어둡다 → 이게 셰이딩
  • 내 발밑 바닥에 검은 사람 모양이 생긴다 → 이게 그림자

둘은 다른 문제다. 그림자는 "다른 물체가 빛을 가로막았나?"를 따져야 해서, 장면 전체를 봐야 한다. 그래서 그림자를 만드는 기술(섀도우 매핑, 섀도우 볼륨 같은 것)은 셰이딩과 따로 부른다.

셰이딩 = 내 몸 안에서의 밝기 차이. 그림자 = 남에게 드리우는 어둠. 이렇게 기억하면 쉽다.

밝기는 무엇이 정할까 — 각도 이야기

그럼 컴퓨터는 "여기는 밝다, 저기는 어둡다"를 어떻게 정할까?

답은 놀랍도록 단순하다. 표면이 빛을 얼마나 정면으로 마주 보고 있느냐다.

겨울에 손을 난로에 쬔다고 생각해 보자. 손바닥을 난로 쪽으로 쫙 펴면 제일 뜨겁다. 손을 옆으로 비스듬히 돌리면 덜 뜨겁다. 등을 돌리면 하나도 안 따뜻하다.

빛도 똑같다. 정면으로 마주 볼수록 밝고, 비스듬할수록 어둡고, 등지면 깜깜하다.

셰이딩 — 빛과 그림자로 입체감 만들기 도식

컴퓨터는 표면 위 각 점마다 "이 점이 어느 쪽을 보고 있는지"를 화살표 하나로 기억해 둔다. 이 화살표를 노멀(normal)이라고 부른다. 표면에 딱 수직으로 꽂힌 압정 같은 거다.

이 압정이 빛 쪽을 향하면 밝게, 반대로 누우면 어둡게. 셰이딩의 심장은 이 계산 하나다.

제일 단순한 방법: 플랫 셰이딩

3D 물체는 사실 수많은 작은 삼각형을 이어 붙여 만든다. 종이접기로 만든 공룡을 떠올리면 된다.

플랫 셰이딩(flat shading)은 가장 게으르고, 가장 빠른 방법이다.

규칙은 딱 하나. "삼각형 하나당 색깔 하나."

그 삼각형이 빛을 얼마나 받는지 한 번만 계산해서, 삼각형 전체를 그 색으로 칠해 버린다.

플랫 셰이딩으로 표현한 무늬 있는 상자
Flat shading a textured cuboid · 출처: 셰이딩 — 빛과 그림자로 입체감 만들기

상자처럼 원래 면이 평평한 물체라면 이걸로 충분하다. 진짜 상자도 면마다 밝기가 뚝뚝 끊기니까.

문제는 둥근 물체다. 조개껍데기나 사과를 플랫 셰이딩으로 칠하면, 매끈해야 할 표면이 각진 보석처럼 보인다. 삼각형 하나하나의 경계선이 그대로 눈에 띈다.

플랫 셰이딩을 적용한 조개껍데기 모델
Graphics complex of a seashell with flat shading modeled in Mathematica · 출처: 셰이딩 — 빛과 그림자로 입체감 만들기

이걸 일부러 노리는 게임도 많다. "로우폴리(low-poly)"라고 부르는 각진 스타일이 그거다. 단점이 개성이 된 셈이다.

부드럽게 만드는 방법: 구로 셰이딩

그럼 매끈하게 하려면?

1971년, 앙리 구로(Henri Gouraud)라는 사람이 아이디어를 냈다. 3D 컴퓨터 그래픽에서 가장 먼저 나온 셰이딩 기법 중 하나다.

생각은 이렇다.

  • 삼각형의 꼭짓점에서만 밝기를 계산한다.
  • 꼭짓점 사이는 계산하지 말고, 그냥 부드럽게 이어서 섞는다.

물감 두 개를 나란히 놓고 손가락으로 문질러 경계를 없애는 것과 같다. 밝은 꼭짓점과 어두운 꼭짓점 사이가 스르륵 이어진다.

구로 셰이딩으로 부드럽게 표현된 3D 모델
Gouraud shading , developed by Henri Gouraud in 1971, was one of the first shading techniques developed for 3D computer graphics . · 출처: 셰이딩 — 빛과 그림자로 입체감 만들기

계산은 꼭짓점 몇 개에서만 하고, 나머지는 대충 섞기만 하니까 아주 빠르다. 그런데도 물체는 둥글게 보인다. 훌륭한 속임수다.

셰이딩 — 빛과 그림자로 입체감 만들기 도식

재질마다 빛을 다르게 튕긴다

여기서 한 발 더 나간다.

같은 모양이라도 무엇으로 만들어졌느냐에 따라 완전히 달라 보인다. 금속 숟가락과 고무 지우개는 같은 조명 아래서도 전혀 다르게 보이지 않는가.

차이는 빛을 튕기는 방식이다.

  • 금속·유리: 빛을 거울처럼 한 방향으로 쭉 튕긴다 → 반짝이는 점(하이라이트)이 또렷하게 생긴다
  • 고무·찰흙·벨벳: 빛을 사방으로 흩뿌린다 → 하이라이트가 흐릿하거나 아예 없다
금, 은, 구리, 고무, 벨벳 등 여러 재질로 셰이딩한 매듭 모양 모음
A knot shaded with different materials including aluminum, brass, bronze, copper, electrum, gold, iron, pewter, silver, clay, foil, glaze, plastic, rubber, satin, and velvet. created in Mathematica 13 · 출처: 셰이딩 — 빛과 그림자로 입체감 만들기

위 그림은 똑같은 매듭 하나를 알루미늄, 놋쇠, 청동, 구리, 금, 철, 은, 찰흙, 플라스틱, 고무, 새틴, 벨벳… 여러 재질로 바꿔 칠한 것이다. 모양은 하나도 안 바뀌었다. 셰이딩 규칙만 바꿨을 뿐이다.

그러니까 셰이딩은 "입체로 보이게 하는 기술"이면서 동시에 "무엇으로 만들어졌는지 말해 주는 기술"이기도 하다.

빛이 여러 방향에서 올 때

현실의 빛은 한 방향에서만 오지 않는다. 운동장의 조명탑처럼 여러 등이 켜져 있기도 하고, 벽에 튕긴 빛이 돌아 들어오기도 한다.

조명등 빛을 광선 추적으로 계산한 셰이딩 결과
Shading effects from a floodlight using a ray tracer · 출처: 셰이딩 — 빛과 그림자로 입체감 만들기

이럴 땐 등마다 밝기를 따로 계산하고 전부 더한다. 등이 세 개면 세 번 계산해서 합치는 식이다.

그래서 등을 많이 켤수록 화면은 예뻐지고, 컴퓨터는 힘들어진다. 게임을 만드는 사람들이 늘 고민하는 저울질이 바로 이거다.

거꾸로 가는 길: 그림자로 모양 알아내기

마지막으로 재미있는 이야기 하나.

지금까지는 이랬다. 모양을 알고 있다 → 밝기를 계산한다.

그런데 이걸 거꾸로 할 수도 있다. 밝기를 보고 → 모양을 알아낸다.

이걸 "셰이프 프롬 셰이딩(shape from shading)", 우리말로 하면 "음영으로부터 모양 알아내기"라고 한다.

음영 정보로 물체의 3차원 형태를 복원한 결과
" Shape from shading " reconstruction · 출처: 셰이딩 — 빛과 그림자로 입체감 만들기

원리는 간단하다. 같은 물체를 빛의 방향만 바꿔 가며 여러 장 찍는다. 그리고 어느 부분이 언제 밝아지고 언제 어두워지는지 살핀다.

"왼쪽에서 비출 때 밝았으면, 여긴 왼쪽을 보고 있는 면이겠네." 이렇게 하나씩 추리하면, 사진만 가지고도 울퉁불퉁한 입체 모양을 되살릴 수 있다.

우리 눈과 뇌도 똑같이 한다. 사진 한 장을 보고 "여긴 튀어나왔고 여긴 들어갔네" 하고 아는 건, 뇌가 밝기 차이를 읽고 있기 때문이다.

정리

  • 셰이딩은 어두운 정도를 조절해 입체감을 만드는 것이다.
  • 표면이 빛을 얼마나 정면으로 마주 보는지가 밝기를 정한다.
  • 그림자를 드리우는 기술과는 다른 이야기다. 셰이딩은 표면 위, 그림자는 장면 전체.
  • 플랫 셰이딩은 면마다 한 색 — 빠르지만 각지다.
  • 구로 셰이딩은 꼭짓점만 계산하고 사이를 섞는다 — 부드럽고 여전히 빠르다.
  • 재질에 따라 빛 튕기는 방식이 달라져서, 금속과 고무가 다르게 보인다.
  • 거꾸로 밝기를 읽어 모양을 알아내는 방법도 있다.

다음에 게임 화면이나 애니메이션을 볼 때, 캐릭터 얼굴의 밝은 쪽과 어두운 쪽을 한번 찾아보자. 그 경계선이 어디에 있는지 보면, 빛이 어디서 오는지 알 수 있다.

그걸 알아채는 순간, 화면은 더 이상 평면이 아니게 된다.

출처

광고

리깅 파이프라인 자동화 도구

반복 작업은 스크립트에게. 현업에서 쓰는 리깅 툴 모음.

리깅 도구 보기