본인이 짧은 시간 인겜갤을 둘러보며 아트에 대한 개발자들의 고초를 자주 봐왔다. 보통은 내가 아는 선에서 짧게 댓글을 남겼지만 좀 더 자세한 가이드가 있다면 더 유익할 거라고 생각하여 귀한 시간을 쪼개 이 글을 남긴다.
이 글은 단기적으로 손쉽게 써먹어볼 수 있는 꼼수부터 장기적으로 득이 되는 기반 지식을 알려주어 게임개발 질을 향상시키는 데에 의의를 두고 있다. 가급적 쉬운 설명과 예제를 곁들였으므로 분명히 도움이 될 거라고 장담하는 바이다.
다만 나는 게임 개발 경험이 없으므로 이쪽 업계에서 쓰는 용어에 많이 무지하니 양해해주길 바란다.
역시 다른 의견이 있거나 틀린 부분에 대해서는 가감 없이 지적하여 주시길 바란다.
가독성을 위해 자의적 판단으로 문단을 바꾸었다.


1. 왜 하필 색인가?
개발자라면 누구나 멋드러진 그래픽을 꿈꾸지만 인디의 여러 사정 때문에 타협할 수 밖에 없다.
널린 프리 소스를 짜깁어 어보미네이션을 만들든가, 직접 찍어바르든가, 백년지계로 그림 공부를 시작할텐데, 만일 그림 공부를 한다면 뭐부터 해야 될까? 유튜브 강의? 책 구매? 잡지떼기? 시간도 여유롭지 않은데 언제 하나부터 열까지 다 밝고 올라가는가?
우리는 그림을 잘그리려는 게 아니라 그래픽을 봐줄만하게 뽑기 위한 것이다. 딱 필요한 부분만 취해야 한다는 것이고, 무언갈 취한다면 그 중에서 "색"이 가장 노력 대비 성능비가 높은 요소라고 주장한다.
색깔 하나만 감 잡으면 다음과 같은 요소들을 보완할 수 있다. 아래의 짤을 보라.

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fe2ebc65d9c26be176b9a5a68



(짤 출처 [링크], 아주 적절해서 퍼옴. 글도 좋음.)
흔한 게이머들 기준으로 왼쪽 스샷(스트리트 파이터)이 오른쪽(니드호그)을 씹압살하는 그래픽이다. 여러분도 둘 중 한 그래픽팀을 고용할 수 있다면 왼쪽을 선택할 거다. 그러나 현실적으로 그럴 수 없고 또 니드호그 개발자 역시 그랬을 것이다. 그래서 그는 색이라도 영리하게 사용하였다.

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb7eceeba219d384acc68624d



첫짤에 모자이크 효과를 주었다. 물체를 더 이상 구별할 수 없는 스파에 비해 니드호그는 여전히 구별이 됨을 알 수 있다. 적절한 색배치로 가독성을 살린 것이다.
(스트리트 파이터가 형편없다는 뜻이 아님을 밝힌다. 높은 해상도로 디테일하게 구현하였고 격투 게임 특성상 단 두 개의 물체만 격렬하게 움직이기 때문에 심미성을 위해 가독성을 일부 죽여도 괜찮다 판단했을 것이다.)
또한 색은 형태보다 뇌에 쉽게 각인된다. 인터넷을 하다보면 아래 같은 양식의 짤을 보았을 것이다.


viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fe7bc0b38109a82c2df8225fc

스즈미야 하루히(왼)와 스트리트 파이터(오)의 등장 인물들이다. 단순한 색의 나열로 고유한 정체성을 알아볼 수 있다는 게 재밌는 짤이다. 심지어 스트리트 파이터 중 네 명은 거의 똑같은 색상을 썼는데도 말이다.

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb4bf689f24549e4b110997f9



그림을 잘 그린다면 주로 떠올리는 게 형태, 얼마나 현실처럼 손가락을 그릴 수 있는가, 얼마나 예쁘게 얼굴을 그릴 수 있는가가 먼저 떠오를테지만 대개 색을 잘 찍어바르는 게 훨씬 쉽고 효과적이다.
특히 픽셀 아트처럼 형태가 생략된 표현 방식이라면 더더욱 색이 두드러질 수 밖에 없다.
이렇게나 중요한 요소인 색인데 여러분이 색에 막연히 겁을 먹거나 포기했다는 걸 걸 알게 되었을 때 매우 안타까웠다.


2. 색감은 키워질 수 있는가?
당근빠따다.
심지어 우리는 태어나면서부터 이미 색깔에 대해 훈련을 하고 있었다. 어떤 색은 빨갛다, 어떤 색은 파랗다, 우리는 알고 있다. 심지어 누군가는 빨간색이 따뜻한 느낌을 주고 파란색이 차가운 느낌을 준다는 것까지 알고 있을 것이다.
그래서 오천만 국민, 칠십억 지구촌 사람들이 모두 디자이너냐 하면 당연히 아니다. 그렇다고 천재가 아니면 말짱황인 것 아니냐 하면 그것도 아니다.
우리 주변에는 옷을 잘 입는 친구가 하나쯤 있다. 옷을 잘 입는다는 건 뭘까? 핏을 잘 살리고 질감 좋은 옷을 고르는 것도 있지만 깔맞춤이라는 말처럼 바로 어울리는 색을 걸치는 것이다.
과연 옷을 잘 입는 그 친구들이 수준 높은 미술 교육을 받아서일까? 아니다. 인터넷에서 글을 읽고 남을 따라 입어 훈련한 색능력을 옷으로 나타낼 수 있게 된 것이다.
여러분은 색고자가 아니다. 색고자는 눈이 안보이는 것이지, 여러분은 그냥 색아다다. 이 글을 읽고 색을 쓰는 방법을 알면 충분히 색쓰킹이 될 수 있다. 그리고 색쓰킹이 되기 위한 방법으로 소거법을 추천한다.
원숭이가 무한대의 시간으로 타자기를 두드린다고 가정하자. 그렇다면 언젠가 우연하게 '김하너'라는 단어를 조합해낼 것이다. 당연히 ㄱ,ㅣ,ㅁ,ㅎ,ㅏ,ㄴ,ㅓ 를 제외한 자판을 모두 뽑아버린다면 더 자주 '김하너'라는 단어를 완성하지 않을까?

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb0ed5e1b9a4ae9849d1f1594


DB16의 팔레트가 여러분에게 도움이 되는 이유는 24비트 트루컬러가 가진 16,777,216가지 색 중에쓸만하고 어울리는 색들만 남기고 소거하였기 때문이다. 
누군가 미리 구성한 팔레트는 당장에 효과적일 수 있으나, 더 나아가 이것의 원리(어째서 이런 색들을 팔레트에 넣었는지)와 스스로 활용할 수 있는 방법을 알려주고 싶다.
이미 소거된 것보다 소거할 수 있는 능력이다.


3. 어울리는 색을 쓰는 방법
줄여서 색쓰방.
색을 고르는 가장 기초적인 여섯 방법에 대해 설명해주는 영상이다. 이 글에서 알려줄 팁이든 다른 곳에서 얻을 팁이든 이 영상의 내용을 알지 않으면 제대로 활용할 수 없다. 이 동영상을 보는 즉시 여러분을 레벨업 시켜주지 않지만 머리 속에 넣어둔다면, 앞으로 색감에 대해 쉽게 이해할 수 있는 이른바 경험치 +50% 버프다.
색깔에 대해 막힐 때마다 시청한다면(그 내용이 이해가 안간다 해도) 어느 순간 스스로 색을 고를 수 있는 기초색감을 갖게 될 것이다.

(금칙어 문제로 링크 대체)
앞부분에서 채도(색의 진하고 옅음)와 명도(색의 밝고 어두움), 색으로 분위기 내는 법(소풍과 병원)에 대해 중요한 설명을 하나, 뒤에 나온 여섯 가지 색조합에 대해서만 첨언하겠다.

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb0ecc48d8a841e93edd086e6


한가지 또는 비슷한 색계열을 빼고 나머지를 소거하는 방법이다. 
색은 혈연 지연 학연이 같은 출신이면 튀지 않고 잘 어울린다. 즉, 자연스럽고 안정적이다. 주어진 컨셉에만 충실하기 때문에 주로 배경에 써먹기 좋다.
이를 활용한 배경을 두 장 가져왔다.



viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fe4b148a042dd70d821c04508


viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762adaa77e6b04dfa0823dda50e5b9f4a15eee12347197df277640d191


2번 색조합을 위와 같이 오브젝트에 적용해도 괜찮다. 다만 같은 계열로만 묶인 캐릭터는 특정색에 가독성을 침범당하기 쉬우므로 배경 선정을 계획적으로 해야될 것이다.
위의 피터팬 같은 경우 후크 선장과 피아식별하기에 용이하지만 배경이 노란색이나 청록색이면 피터팬은 묻히게 된다.



viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb0baab056cbf77c89ead0810


삼국지 컬러.
동영상을 시청하면서 의아한 사람도 있었을 것이다. 색만 봐도 굉장히 촌스럽고, 예시랍시고 가져온 그림들도 한물 갔거나 유치한 느낌이 진하다. 오히려 쓰면 안되는 것에 가깝지 않을까하는 생각도 든다.
이제 아래의 짤을 보라.


viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762adaa77e6b04dfa0823dda50e5b9f4a15eee146724c7dc7a7640d191

삼국지 컬러로 대표되는 캐릭터들이다. 분명 유명하긴 한데 촌스럽다고 느껴지는 이유는 세 가지 색의 비율이 균등하거나 두 가지 색의 비율이 균등하고, 설상가상으로 채도도 전부 높다. 색들의 출신이 서로 다른데 주인공 자리를 놓고 서로 반발하여 어우러지지 못한다.
하지만 이제 나올 그림도 삼국지 컬러라는 걸 알면 생각이 달라질 것이다.
한가지 알아둘 점은 색조합에서 흰색과 검은색은 일반적으로 색조합 엔트리에 치지 않는다. 또한 융통성으로 피부색 같은 것을 엔트리에서 빼거나 넣곤 한다. 다시 말해 꼭 해당 색만 쓰라가 아니라 해당 색을 중점으로 쓰라고 이해했으면 한다.
찾다보니 자꾸 의도찮게 씹덕 그림을 가져온 점 사과한다. 정말 가져올 예시가 씹덕 그림 밖에 없다...

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fe1ba0ecc818cfefd7f6f18ad

(마이크에 빨간색 있음.)


위에 세 그림들은 노란색 계열, 빨간색 계열, 파란색 계열의 삼국지 컬러를 교과서처럼 지키고 있다. 첫번째 버블스는 피부색을 빨간색 계열로 볼 수 있는데, 나머지 둘은 빨간색을 소량만 사용해 포인트 컬러로 사용하고 있다.
익숙해진다면 나름 조화롭게 색을 구성하면서 눈에 띄게 만들 수 있으니 캐릭터 같은 오브젝트에 쓰기 알맞다.

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762adaa77e6b04dfa0823dda50e5b9f4a15eb9443571968f7c7640d191


반대로 색이 서로를 견제하는 특성을 이용하면 심미성은 떨어져도 시인성을 추구할 수 있다.


viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb0ed084e9c19ead29d1f1594


이 둘은 제일 다루기 쉬워 많이 쓰는 방법이다. 뛰어난 범용성으로 어느 요소에나 차용하기 좋다. 혈연 지연 학연이 통하는 색의 질서에서 이 조합은 상극이다. 
그러나 혼돈이 아닌 통제된 규칙성에 놓인 반발성은, 극 중 인물끼리의 갈등이나 스포츠 경기처럼  착한 경쟁과 같아서 눈길을 끌기 좋다. 연습할 때 활용할 색조합으로도 추천한다.
흔한 만큼 예제가 많아 몇가지 게임 캐릭터를 따와 분석했다.


viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb1ed004b3c0834a8774e4e37


하반신이 명도가 어둡고 채도가 낮은 것은 MOBA에서 가독성을 위해 쓰는 방식이라 팔레트에 따로 포함하지 않았다. 

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb1ed011b6c5830ab774e4e37


자칫 산만할 수 있는 노란색 빨간색 투톱 체계를 녹색당이 과반수로 잘 품어내고 있다. 잘 들여다보면 무기의 회색도 쌩회색이 아닌 청녹색에 가깝다는 걸 알 수 있다. (쌩회색에 관한 설명은 이따 나옴)

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb6bbe7109c07e18c4801a0e6


요즘 게임들은 거의 색조합 규칙을 병적으로 따르고 있고 특히 롤이나 도타처럼 색상 선택에 자유롭고 가독성을 중요시 여기는 게임들은 무조건 활용하고 있다.
심심하면 그래픽이 예쁘다고 생각됐던 게임의 오브젝트들을 한번 연구해보라. 거의 대부분은 이 색조합에 쏙 들어맞는다.

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb0b82b3c858d9385829d8256


겉보기에 꽤나 요란스럽고 어려워보이지만 4, 5번에 익숙해진다면 금방 응용할 수 있다. 이는 오브젝트에 써도 괜찮지만 배경과 어우러짐을 고민할 때 해결책이 된다.

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fb4eddbb23f5a95d1936e07e1

(적절한 예제를 찾지 못할 뻔 했다가 등잔 밑에서 발견함. 너무 뿌듯해서 적어봄.)

잘못 사용하면 끔찍한 혼종이 탄생할 수 있지만 비율을 잘만 조절하면 어느 배경에 놓이든 잘 읽히는 탄탄한 가독성을 보유할 수 있는 게 장점이다.

viewimage.php?id=2abcdd23dad63db0&no=29bcc427b28777a16fb3dab004c86b6f4fce3bfc395ceae176db8d02ca05ad3a27762a9ffb280007d7a4863cd33fe1b01bfb2077ce19bb48d522


배경과 오브젝트를 같이 고려하여 나눈 경우다. 다만 예시는 메인 캐릭터와 맵 오브젝트, 적 캐릭터가 같은 색계열로 묶여 있기 때문에 색분배를 다시 하여 가독성을 높이면 좋다. 메인 캐릭터는 어디서나 잘 보이도록 구성하여 따로 떼어두되, 배경과 등장할 오브젝트를 색조합에 맞게 구성한다면 컨셉과 가독성을 살릴 수 있다.

이상 여섯가지 색조합 방법을 살펴보았다. 직접 그리지 않더라도 애셋을 구입할 때 방향 제시가 되며 간접적으로라도 도움이 될 것이다.
그리고 내가 처음 이 영상을 보았을 때 느꼈던 감정을 되새기며 깜짝 Q&A를 준비했다.

Q : 봐도 모르겠는데 어쩌죠?
A : 당장 몰라도 된다. 다만 이런 게 있다는 것만 알고 있으면 된다. 아는 것과 모르는 건 큰 차이다.

Q : 제가 반골기질이 있어서 남들하고 똑같은 걸 싫어하는데 어떻게 하죠?
A : 이건 음악으로 따지면 아주 기초적인 화음 맞추기에 불과하다. 같은 색조합을 쓰더라도 채도, 명도, 배합률, 조형에 따라 완전히 다른 결과물이 나온다.

Q : 꿈보다 해몽이라고 그냥 끼워 맞춘 거 아녜요?
A : 아니다.

Q : 코에 걸면 코걸이 귀에 걸면 귀걸...
A : 아님.

(첨부파일 갯수 제한 문제로 2부에서 계속됩니다...)