이번 기수 등록 마감까지 남은 시간은?

DAY

:
:
수강 신청하기
로그인

|

내 강의실

|

마이페이지

그린채널

공지사항 게시글 보기 : 번호, 제목, 조회수, 작성일 등 정보제공
그라디언트(기울기)로 표현하는 그라데이션 조회수 24265




안녕하세요 그린컴입니다~ :)

포토샵이나 일러스트와 같은 컴퓨터 그래픽툴 작업을 하다보면 #그라데이션 툴은 없고,

대신 ' #그라디언트 툴 '로 그라데이션을 적용하는 모습을 볼 수 있는데요. 그라데이션과 그라디언트의 차이는 뭘까요?

그라데이션이란, 색이 단계적으로 점점 변화하는 것을 말하는 예술기법 용어입니다.

그라디언트는 그런 그라데이션을 구현하는 데 있어서 필요한 기술 용어라고 생각할 수 있습니다.

그라디언트부터 차례대로 정의와 원리에 대해서 알아보며, 그라데이션에 관하여 낱낱히 파헤쳐봅시다!

그라데이션

Gradation


[출처] Dribbble

그라데이션(Gradation)이란 어떤 색조, 명암, 질감을 단계적으로 다른 색조, 명암, 질감으로 바꾸는 예술 기법을 의미합니다.

그라데이션을 통해 공간, 거리, 분위기, 부피, 곡선/곡면 등을 표현할 수 있습니다. 하나의 색채에서 다른 색채로 변하는 단계, 혹은 그러한 기법을 의미하는 단어입니다. 순우리말로는 '바림', 한자어로는 계조(階調)라고 합니다. 일본어 잔재 현장 용어로는 보카시라고도 합니다. 사진이나 영상 전문가들은 계조라는 표현을 상당히 쓰는 편입니다. 서양에서는 'Gradation(그라데이션)'보다 'Gradient(그라디언트)'라는 표현을 더 많이 씁니다.



위의 이미지는 검정색에서 하얀색으로의 단계적 변화를 보여주는 그러데이션 일러스트입니다.

미술가들은 재료와 원하는 효과에 따라 블렌딩, 해칭, 크로스해칭 등 다양한 기법을 통해 그러데이션 처리를 합니다.

디자인 입시를 시작하면 가장 기초로써 배우는 원기둥, 원뿔, 구(도형), 정육면체를 채색하는 과정(명암)

그림에 입체감을 주기 좋은 기초적인 기법입니다.

그라디언트

Gradient

그라디언트(Gradient, 그레이디언트, 기울기, 경사, 구배)란 벡터 미적분학에서 스칼라장의 최대의 증가율을 나타내는 벡터장을 뜻합니다.

갑자기 생소한 단어들이 나와서 당황스럽죠? 간단하게 말해서 그라디언트란 공간에 대한 기울기를 뜻합니다.

물리학에서 유체의 흐름이나 중력장 등의 각 점에서의 크기와 방향의 나타내기 위해 사용된 벡터장(기울기를 나타냄)을

화살표로 표시할 때 화살표의 방향은 증가율이 최대가 되는 방향이며, 화살표의 크기는 증가율이 최대일 때의 증가율의 크기를 나타냅니다.

아래 이미지를 보면 이해가 쉽습니다.




두 그림에서 회색의 밝기는 스칼라계의 크기를 뜻하며, 스칼라계의 기울기는 파란색 화살표로 표시되었습니다.

화살표가 가르키는 방향으로 갈수록(증가율이 최대에 가까워질수록) 색이 짙어지는 것을 확인할 수 있습니다.

즉, 컴퓨터로 색(그라데이션)을 표현하는 기술적인 방법으로 그레이디언트를 사용한다는 것을 알 수 있습니다.

그라데이션의 종류


(좌)수평선형, (중) 수직선형, (우) 대각선형

선형(Linear): 가장 기본적인 그라데이션으로, 색의 변화가 직선입니다. 수평, 수직, 대각이 있습니다.


(좌) 방사형, (중) 극좌표형, (우) 자유형

방사형(Radical):

가운데에서 바깥으로 뻗어 나가는 형태의 그라데이션으로, 크게 원형 방사형과 다각형 방사형이 존재합니다. 원과 사각이 있습니다.

극좌표형(Polar): 한 바퀴 빙 돌아가는 형태의 그라데이션으로 위의 선형 그라데이션을 원뿔 모양으로 이어붙인 형태입니다.

일상 속의 그라데이션



극단적인 빛의 파장 차이가 나는 경우에는 자연스럽게 가시광선 대역에 걸쳐 색이 나타나므로 자연에서 쉽게 발견할 수 있습니다.

노을진 하늘에서 붉은색-어두운 파란색으로 이루어진 그라데이션을 볼 수 있으며, 분광 프리즘으로 볼 수 있는 무지개도 마찬가지입니다.

현재 한국이나 일본 등은 무지개를 7가지 색으로 구분하지만 '모든 색'을 포함하고 있다는 특성상 문화권에 따라 색을 구분하는 개수가 달라집니다. 과거에는 우리나라에서도 5가지 색으로 무지개를 구분했다고 합니다.





앞서 말했듯이 그라데이션은 일상생활, 자연 곳곳에 있습니다.

우리의 눈이 단색이라고 인지하고 보는 것도 빛에 의해 명암이 생기니 실제로는 그것조차 그라데이션인거죠!

빛이 비추어지는 각도나 양에 따라 실질적으로 인지하는 색상은 달라지니, 그라데이션이 없으면 생동감이 없다고 할 수 있습니다.

명암이 전혀없는 단색 컬러는 실제로는 세상에 존재하기 어려운 색이라는 사실도 알 수 있죠.

컬러밴딩 현상

또한, 컴퓨터나 인쇄물에서 표현할 수 있는 색공간의 한계가 있으므로 그라데이션을 잘못 사용하면 부드러운 색상 변화가 나타나는게 아니라 색의 층이 지게 되므로 이러한 점을 잘 고려하지 않으면 결과물의 질을 저하시키게 됩니다. 모니터도 마찬가지, 싸구려 모니터라면 이 문서에서도 그라데이션에 층이 지는 것을 볼수 있습니다. 이를 컬러밴딩이라고 합니다.


[출처] Pinterest

*컬러밴딩 현상(Color Banding) : 그라디언트가 등고선마냥 보이는 현상.

동영상 등의 계조에서 사람의 눈에 인식되는 색 차이가 크게 나서 마치 등고선 그은 것 같이 보이는 선이 보이는 현상입니다.


(좌) 아이폰 어플들, (중) 염료가 사용된 티셔츠, (우) 그라데이션이 돋보이는 선미 앨범

하나의 색에서 다른 색으로 단계적으로 변화하는 것인 만큼 컴퓨터 그래픽으로 구현하기 용이하고 널리 사용되고 있지만 수작업으로 구현할 수 없는 기법도 아닙니다. 이를테면 최근에는 프라모델이나 네일아트에 주로 사용되는 에어브러시는 원래 보다 점도가 낮은 도료를 공기압으로 뿌려서 그라데이션같은 효과를 내는게 원래 목적입니다. 순우리말인 '바림' 역시 원래 수작업으로 직물을 염색하는 사람들 사이에서 쓰는 단어였습니다. 물론 컴퓨터에서는 단순히 RGB를 계산하여 만들어낼 수 있으므로 누구나 쉽게 표현 가능합니다.

하지만 무턱대고 그라데이션을 남용하면 전체 디자인이 촌스러워 질 수 있기 때문에 디자인에 기본값으로 많이 넣으면 마이너스가 됩니다.

전체 디자인 컨셉에 맞춰 적당히 사용하는 편이 좋습니다. 잘 사용한다면 신의 한수가 될 수 있는 그라데이션 기법! 어떠신가요?