도트 도트 그리기 강좌 2-01 [색을 마스터 하자]
2005.03.25 00:51
| extra_vars1 | 캐릭도트 |
|---|---|
| extra_vars2 | 1 |
| extra_vars3 | 1 |
| extra_vars4 | 2 |
| extra_vars5 | |
| extra_vars6 | |
| extra_vars7 |
| 캐릭터만들기 Pro 도트 그림 강좌 STEP 2-1 | |
●색을 마스터하자!●
| ［STEP2］에서는, 보다 전문적인 설명에 들어갑니다. 조금 이론이 많은 부분이 있습니다만, 원리를 아는 것만으로 능숙해지는 기술도 있습니다. 우선은, 파일 형식과 사용할 수 있는 색의 제한의 관계에 대해 설명하겠습니다. |
| 사용할 수 있는 색의 수, 파일에 대해 |
| 도트 그림을 작성할 때, 자신이 좋아하는 색을 마음껏 사용해서 그릴 수가 없는 경우가 있습니다. 그 것은, 작성하는 그래픽의 보존 형식(그래픽 형식이라고 말한다)이 크게 관계하고 있습니다. 홈 페이지에서 많이 사용되고 있는 「GIF」라고 하는 그래픽 형식의 경우, 1개의 그래픽으로 256색의 색을 사용할 수 있습니다. 다시말해, 256색까지 밖에 사용할 수 없다고 하는 것입니다. Windows 표준의 보존 형식인 「BMP」라고 하는 그래픽 형식의 경우, BMP라고 하는 파일 형식중에서도, 흑백 2색(2 bit 칼라), 16색(4 bit 칼라), 256색(8 bit 칼라), 풀 컬러( 약 16만색·24 bit 칼라)라고 하는 4 종류의 형식이 있어, 용도에 맞추어 선택할 필요가 있습니다. 이와 같이, 사용하는 그래픽 형식에 의해 사용할 수 있는 색의 수가 정해져 옵니다. 또, 작성하는 게임이 작동되는 하드웨어에 따라서도, 미리 결정된 600색 속으로부터 4색 밖에 사용할 수 없는……등의 제한이 있는 일도 있습니다. |
| ■보충 그래픽 형식의 여러 가지
|
| 팔레트를 만든다 |
| 도트 그림을 작성할 때 색의 관리를 실시하는 것이 「칼라 팔레트」입니다. 풀 컬러의 화상의 경우, 자유롭게 좋아하는 색을 사용할 수 있기 때문에, 이 칼라 팔레트의 개념이 없습니다. 칼라 팔레트는, 256색이하의 화상을 작성할 경우에 필요하게 되는 것입니다.
캐릭터만들기 Pro의 칼라 팔레트 이 칼라 팔레트는 그래픽 작성 소프트웨어에 의해, 여러가지 형태가 있습니다만, 세로 16 칸×가로 16 칸에 줄지어 있는 것이 일반적입니다. 또, 왼쪽위로부터 오른쪽아래를 향해, 0번에서 255번까지, 합계 256번까지의 색번호로 관리되고 있습니다. 제일 왼쪽위의 흰 테두리로 둘러싸진 장소가 0번으로, 거기에서 오른쪽으로 차례로 줄서 있어 제일 오른쪽 아래가 255번이 됩니다. 도트 그림 속에서 사용되는 색은, 색의 모습이나 색의 RGB치보다, 이 색번호로 관리되는 것 쪽이 많아집니다. 이것은, 그 그래픽이 사용되는 프로그램이 색을 인식하기 위함으로, 사용되고 있는 색을 「빨강이다」라고 인식하는 것보다, 「색번호의 3번의 색이다」라고 인식하는 편이 빠르기 때문입니다. 도트 그림을 그리는 경우, 이 특성을 이용하는 그리는 방법이 종종 등장합니다. 지금은 지식으로서 기억해 둡시다. 위의 그래픽에서는, 여러가지 색이 줄지어 있습니다만, 새롭게 그래픽을 작성할 때는 아직 새까만 상태로, 색이 이와 같이 줄지어 있지는 않습니다. 1 칸씩, 필요하게 되었을 때에 색을 작성해, 색을 늘려 갑니다. 색을 만드는 방법에 대해서는, 아래에서 설명합니다. |
| 투명색이란 |
| 투명색이란, 핑크라든지 초록이라고 하는 색을 실제로 가지고 있는데, 투명한 것……즉 없는 것으로서 취급할 수 있는 색을 말합니다. 그 밖에 배경색, 투과색, 빼기색 등, 여러 가지 말이 있습니다만, 여기에서는 「투명색」으로 통일하겠습니다. 이 투명색은, 실제로 그림을 작성할 경우에도 중요합니다만, 가장 중요한 것은 게임상에 표시시킬 때입니다. 예를 들어 RPG의 캐릭터는, 몸의 윤곽에 맞추어, 제대로 배경이 보이고 있는군요? 이것은 캐릭터의 주위를 투명색으로 바르고 있으므로, 게임의 프로그램이 그것을 인식해, 그 부분을 표시시키지 않게 하고 있기 때문에 할 수 있는 것입니다. 이러한 사용법을 하기 위해, 게임상에서 투명하게 해 두고 싶은 부분은, 미리 결정해 둔 투명색으로 발라 둡니다. 이러한 투명색을 포함한 화상을 「스프라이트」라고 말합니다. 지식으로서 기억해 둡시다. 그런데, 여기서 주의하지 않으면 안 되는 것은, 투명색은 스스로 자유롭게 결정할 수 없는 경우가 많다는 것입니다. 대부분의 경우, 그 화상이 사용되는 게임(프로그램)의 사양(룰)에 의해, 어느 색이 투명색이 될지가 결정할 수 있습니다. 그러므로, 도트 그림을 작성할 때는, 어떤 투명색이 요구되는지, 미리 알아 둘 필요가 있습니다. 그러면 어떤 경우가 있는지, 참고로 소개해 둡니다. ●0번에서 255번까지 있는 칼라 팔레트 가운데, 0번을 투명색으로 하는 경우. 이 경우, 0번의 색을 무슨색으로도, 스스로 설정할 수가 있습니다. 「RPG 만들기 2000(2003)」에서는, 표준으로 이 방식을 채용하고 있습니다. ●색의 번호에 관계없이, 무조건 검은색을(RGB치가 모두 0 상태)을 투명색으로 하는 경우. 만들기시리즈에서는, 「2 D격투 만들기 2nd. 」가 이 방식을 채용하고 있습니다. 색번호를 의식할 필요가 없는 반면, 머리카락 등, 그래픽 속에 검은색을 사용하면, 거기도 투명하게 되어 버리므로 주의가 필요합니다. ●그래픽의 제일 왼쪽위(그래픽내의 좌표가 X：0, Y：0의 위치)의 색을 투명색과 설정하는 경우. 만들기시리즈에서는 채용되고 있지 않습니다만, 다른 프로그램에서는 가끔 채용되는 일이 있는 방식입니다. 물론 이 밖에도, 임의로 설정한 투명색을 사용할 수 있는 소프트웨어도 있습니다. 팔레트의 0번을 투명색이라고 인식하는 「RPG 만들기 2000」도, 다른 색도 투명색으로서 취급할 수가 있습니다. |
| 투명색의 실제 사용 예시 | |||
 배경이 되는 그래픽 우위에 겹쳤을 때, 핑크 부분이 투명하게 됩니다.  투명색을 취급할 때 주의해야하는 것은, 투명색으로서 지정한 색을 그래픽내에 사용하지 않는 것입니다. 또, 그래픽내에서 사용한 색을, 투명색으로서 지정하지 않는 것입니다. 그렇지않으면 이와 같이 투과 시키고 싶지 않은 부분까지, 틈이 생겨립니다.
배경의 변화에 투명색은 영향을 받지 않고,투명한 그대로.  게임중에서는, 이러한 처리가 되어 있습니다.  더욱 위에, 그래픽을 덧입히는 일도 가능합니다. |
| 시스템색에 대해 |
| 시스템색으로서 대표적인 것에 「Windows 표준의 시스템 20색」이 있습니다. 이것은, Windows 자체가 항상 사용하고 있는 색으로, 주로 아이콘이나 윈도우 칼라, 폰트 칼라로서 사용되고 있습니다. 그 그래픽이 사용되는 프로그램에 의해, 그 시스템색을 칼라 팔레트에 포함할 필요가 있는 경우와 없는 경우가 있습니다. |
 |
선두의 10개와 마지막 10개가 Windows 표준의 시스템 20색입니다. 최근, 이 시스템색을 포함하지 않으면 안 된다라고 하는 룰은 없어지고 있습니다. |
Windows 표준의 시스템 20색에 한정하지 않고, 그 화상이 사용되는 프로그램에 의해, 독자적으로 지정하는 칼라 팔레트의 룰이 있거나 합니다. 그 룰을 지키지 않으면 디스플레이에 표시되는 색이 이상해지는 「색 깨짐」이 발생하거나 프로그램에 의한 팔레트 조작(게임이라면, 화면을 어둡게 한다든가 붉게 하는등의 처리)으로 색이 변환되지 않는등의 에러가 일어나는 원인이 되므로 주의합시다. |
| 만들기시리즈 마다 있는 팔레트의 제한 |
| 그럼 여기서, 만들기시리즈 마다 있는 칼라 팔레트의 제한을 모아 둡시다. 특히 「RPG 만들기 95」로 「시뮬레이션 RPG 만들기 95」의 2개는, 게임 속에서 사용하는 그래픽 모든 것이, 완전 같은 내용의 칼라 팔레트를 사용하지 않으면 안 된다라고 하는 룰이 있습니다. 이것은 최근 없어지고 있는 룰입니다만, 이 2개의 소프트웨어의 경우 이것을 지켜 두지 않으면 확실히 색 깨짐이 발생하므로 주의합시다. |
|
RPG만들기95 |
투명색：0번 |
시스템색：필요 |
|
모든 그래픽이 동일한 팔레트 |
총색 가지수：256색 |
지원 형식：BMP |
|
시뮬레이션 RPG 만들기 95 |
투명색：0번 |
시스템색：필요 |
|
모든 그래픽이 동일한 팔레트 |
총색 가지수：256색 |
지원 형식：BMP |
|
RPG만들기2000&2003 |
투명색：0번 |
시스템색：불필요 |
|
그래픽 한 장당 1 팔레트 |
총색 가지수：256색 |
지원 형식 : BMP, PNG, XYZ |
|
2D격투만들기2nd. |
투명색：검은색 |
시스템색：필요 |
|
그래픽 한 장당 1 팔레트 |
총색 가지수：256색 |
지원 형식：BMP |
| 색을 만드는 방법(RGB와 HSV) |
| 색을 작성할 때, 색을 만드는 방법으로서는 R·G·B(R=빨강, G=초록, B=파랑의 3색)의 농도를 조정해 만드는 방식과 H·S·V(H=색상, S=채도, V=명도의 3개)를 조정해 만드는 방식의 두가지 방법이 있습니다. PC의 디스플레이로 표시되고 있는 색은, 모두 이 RGB(또는 HSV)에 의해 표현되고 있습니다. RGB의 바탕으로 되는, 적, 록, 청은 빛의 3원색이라고 해 이 3색의 농도에 의해 색의 차이가 생깁니다. RGB도 HSV도, 각각이 0~255까지의 폭으로 수치를 설정할 수가 있습니다. RGB의 룰로 해 우선 먼저 기억해야하는것은, 「RGB=0.0. 0」은 검은색, 「RGB=255.255. 255」는 흰색이 된다고 하는 것입니다. 즉, 큰 숫자라면 밝은 색이 되고, 낮은 숫자라면 어두운 색이 된다고 하는 것입니다. 또, R(빨강)의 수치를 다른 것보다 높였을 때는 빨강이, G(초록)의 수치를 다른 것보다 높였을 때는 초록이, 작성되는 색 속에서 강하게 나타난다고 하는 일도 기억해 둡시다. 이 강약의 밸런스로 색을 표현해 갈 것입니다. 덧붙여 세 수치를 완전히 같게 했을 경우, 그 색은 회색이 됩니다. HSV(또는 HSB라고 표기하는 경우도 있다)의 룰은, 우선 색상·채도·명도가 어떤 것인지를 알아 둘 필요가 있습니다. H(=색상)는, 빨강이라든지 오렌지라든지, 초록이라든지 파랑이라든지, 전부 256 단계로 나누어진 기본의 색이라고 생각해 둡시다. 이미지로서는, 빨강으로부터 시작되어 물색을 중심으로 해, 또 빨강으로 끝나는 그라데이션……이라고 하는 느낌입니다. S(=채도)는 선명함입니다. 선명하다라고 말하는 것은, 색이 선명해 탁함이 없는 상태를 가리켜 말합니다. 채도를 내리면, 그 색은 생기잃어, 색이 자꾸자꾸 회색에 가까워집니다. V(=명도)는, 순수하게 밝은가 어두운가의 차이입니다. 명도가 높으면 흰색에 근처 되어, 반대로 명도가 낮으면 검은색 근처 가 됩니다. 명도의 경우, 수치적으로 정확히 중간(128)이, 명암에 영향을 받지 않는 색이라는 것이 됩니다. 어쨌든, 어떤 수치의 조합이 어떤 색이 되는지, 곧바로는 모를겁니다. 이것도 자신에게 과제를 주어, 예를 들어 눈앞에 있는 것의 색을 재현 해 보는 등의 연습이 필요합니다. |
| 실제로 색을 작성해 본다 | |||||||||||||||
| 그러면 실제로 색을 만들어 봅시다. 갑자기 256색의 색을 만드는 것은 어렵기때문에, 여기에서는 16색모드의 칼라 팔레트를 만들어 봅시다. [1]필요한 색을 써낸다 대충 아무렇게 색을 만들면, 실제로는 사용하지 않게 되어 버리거나 만들 수 있는 색이 부족하게 되어 버리는 일이 있습니다. 미리, 어떤 색이 필요한가를 생각해, 메모 해 둡시다. 예를 들어 캐릭터의 그림을 그릴 때, 푸른 머리카락이라면 파랑이 있어야하고, 살색은 물론 있어야하고, 투구와 갑옷을 입고 있다면, 회색도 필요하게 될 것입니다. 미묘한 색의 차이는 일단 접어두고, 우선은 파랑이라든지 빨강이라든지, 간단하게 써내 둡시다. 주의하는 것은 투명색을 포함할 필요가 있는 경우, 1색은 투명색의 용으로서 취해 두지 않으면 안 된다고 하는 것입니다. 즉, 16색의 경우, 실제로 사용할 수 있는 색 가지수는 15색이 됩니다. | |||||||||||||||
[2]기본의 색의 작성 미리 필요로 결정한 색을 우선 만들어 봅시다. 우선 처음은 RGB로 만드는 편이, 하기 쉬울 것입니다. 살색은, R와 G의 값을 높이고, B를 약간 낮은값으로 하면 작성할 수 있습니다.
| |||||||||||||||
|
| |||||||||||||||
[4]색의 추가 한 색에 대해, 명도의 차이가 2 단계 밖에 없는 것은, 입체감을 낼 때 약간 어딘지 부족할지도 모릅니다. 그렇지만, 이대로 만들어 버리면, 앞으로 3색 밖에 추가할 수가 없습니다. 이 경우, 벌써 작성한 색에서는 대용할 수 없는 색을 찾아내 추가하는 것이 포인트입니다. 이 경우, 엷은 녹색과 살색의 하이라이트는 흰색으로 대용 가능하고, 엷은 녹색의 제일 어두운 부분은 파랑의 어두운 색으로 대용 가능하고 살색의 어두운 부분은, 빨강의 어두운 색으로 대용이 가능합니다. 조금 무리가 있어도, 가능한 한 유용하게 운영하는 것이 요령입니다. 그 결과, 물색, 핑크 등, 어떻게 노력해도 대신할 수 없는 색을 추가합니다. 또, 아직 색을 추가할 수 있을 여유가 있어도, 정말로 필요하게 되었을 때를 위해서 남겨 두는 것도 요령입니다.
|
댓글 10
-
류지연
2005.08.22 00:48
어려움...|+rp2+|267|+rp3+|lesson_graphic -
산수-_-음류
2005.11.06 08:24
무슨말인지 @_@....|+rp2+|268|+rp3+|lesson_graphic -
푸푸푸푸훗
2006.01.06 10:36
읽기 귀찮아서 혼자 팔레트 갖고 놀다가 터득한....ㅇㅅㅇ;|+rp2+|269|+rp3+|lesson_graphic -
畵影
2006.01.17 23:50
홋.,.. 이거 이아래글 안티 에어리징 에서 검은색 원을 이용할|+rp2+|270|+rp3+|lesson_graphic -
로컬인트라넷
2006.01.18 18:52
저게 뭔소립니까? GIF가 라이센스를 취득하지 않으면 안된다니 ㅡ.ㅡ|+rp2+|271|+rp3+|lesson_graphic -
윤수마루
2006.01.25 13:40
으아아아! 내 머리! 내 머리! ㅠ.ㅜ|+rp2+|272|+rp3+|lesson_graphic -
Kr_FoF
2006.04.21 21:57
아앍! 머리가 깨지려고 해!|+rp2+|273|+rp3+|lesson_graphic -
레아냥
2006.04.23 07:03
....머리가 .... . |+rp2+|274|+rp3+|lesson_graphic -
안경잡이....
2006.06.06 00:41
무슨 소리 머리가 터졌다 |+rp2+|275|+rp3+|lesson_graphic -
☜날ge를...☆
2007.11.11 19:43
.. ;;
XP는 어떻게 저장을 해야하는건지.. ;;|+rp2+|454|+rp3+|lesson_graphic
