메뉴 건너뛰기

창조도시 기록보관소

extra_vars1 캐릭도트 
extra_vars2
extra_vars3
extra_vars4
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색 밖에 사용할 수 없는……등의 제한이 있는 일도 있습니다.

■보충
그래픽 형식의 여러 가지

위에서 소개한 GIF나 BMP 형식 이외에도, 그래픽 형식은 여러 가지 있습니다. 여기서 Windows에서 자주 사용되는 그래픽 형식의 특성을 소개해 둡니다

BMP
비트 맵으로 불리는, Windows 표준의 그래픽 형식입니다. 만들기시리즈에서도, BMP 형식의 그래픽을 지원하고 있어, BMP로 작성한 화상을 게임 속에서 사용할 수 있습니다. 흑백, 16색, 256색, 24 Bit 칼라와 같은 BMP 형식중에서도 보존 형식 종류가 풍부한 것이 특징으로, 그 화상의 용도에 맞추어 구분하여 사용합니다. 만들기시리즈의 경우, 대부분이 256색형식(8 bit 칼라)이 이용되고 있습니다.

JPG
「JPG」는 확장자로, 정식명칭은 JPEG(제이펙) 형식이라고 합니다. 풀 컬러의 그래픽은 용량이 크고, 메일로 전송 하기에도, 게임에서 사용하기에도 취급이 큰 일입니다. 거기서, 보존할 경우에 화상을 압축해, 조금이라도 용량을 줄이려고 태어난 그래픽 형식입니다. 보존할 경우에, 압축의 퀄리티를 선택할 수가 있어 퀄리티를 높게 하면 압축율이 낮아져 용량은 커지며, 낮게 하면 압축율은 높아져 용량도 작아집니다. 풀 컬러 화상의 퀄리티 저하도 비교적 적고, 용량이 작아지기 때문에, 인터넷상에서 보급했습니다. 팔레트의 개념을 가지고 있지 않기 때문에, 게임용 그래픽으로서는 적합하지 않습니다. 색 가지수도 풀 컬러(24 bit) 한정입니다.

GIF
인터넷의 홈 페이지등으로 사용되는 것이 많은 형식입니다. 1개의 파일내에서 사용할 수 있는 색 가지수는 256색까지로 정해져 있습니다만, 그래픽 내에서 같은 색이 넓은 면적을 잡고 있는 경우에 용량이 작아 지기때문에, 넷상에서 보급했습니다.

보충:이 파일 형식에는 「LZW 압축 신장 알고리즘」이라고 하는 기술이 이용되고 있습니다. 미국의 Unisys라고 하는 회사가 특허를 가지고 있기 때문에, 본래는 자유롭게 사용할 수 없습니다. 라이센스를 취득하고 있지 않는 소프트웨어로 GIF를 작성해, 사용했을 경우, 개인이라도 Unisys사에 특허 사용료를 지불하지 않으면 안됩니다. 「캐릭터만들기 Pro」는, 정식으로 Unisys사로부터 라이센스를 얻고 있으므로, 안심하고 이용하십시오.

PNG
GIF가 라이센스를 취득하지 않으면 사용할 수 없기(무허가로 사용하면 특허침해가 되어 버린다) 때문에, 새롭게 만들어진 형식입니다. GIF보다 취급할 수 있는 색 가지수가 많아, 투명색도 복수 취급할 수 있는 것으로부터, 향후 넷상에서 보급되어 있고 주가되리라 생각되는 형식입니다. 또, 완전히 같은 내용의 화상이라면, GIF보다 다소 용량이 작아집니다. 기본적으로 팔레트 데이터는 보존됩니다만, 소프트웨어에 따라서는 미사용색이 삭제되어 버리는 경우가 있습니다. 아직 취급할 수 있는 소프트웨어가 적기 때문에, 앞으로가 기대되는 형식입니다. 만들기시리즈에서는 「RPG 만들기 2000」와「RPG 만들기 2003」이 대응하고 있습니다.

CRA
「캐릭터만들기 Pro」전용의 그래픽 형식입니다. 색 가지수는 256색까지 사용할 수 있습니다. 레이어 정보, 알파 채널 정보, 환경 설정 정보등을 보관 유지하고 있기 때문에, 독자적인 형식이 되어 있습니다. 이 파일은 「캐릭터만들기 Pro」로 밖에 읽을 수 없습니다. 작성한 레이어나 알파 채널 정보를 보관 유지해 두고 싶은 것 보고 선택합시다.


팔레트를 만든다
도트 그림을 작성할 때 색의 관리를 실시하는 것이 「칼라 팔레트」입니다. 풀 컬러의 화상의 경우, 자유롭게 좋아하는 색을 사용할 수 있기 때문에, 이 칼라 팔레트의 개념이 없습니다. 칼라 팔레트는, 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를 약간 낮은값으로 하면 작성할 수 있습니다.

- - - - - -


[3]색을 보충한다
위에 있는 6색만으로는, 로 한 밋밋한 그림이 되어, 입체감을 낼 수 없습니다. 거기서, 각각의 색의 그림자가 되는 색을 작성합니다. 이 때, HSV 방식을 이용해, V(명도)를 변경하면, 간단하게 작성할 수 있습니다. 반대로 그 색이 빛나고 있는 부분……즉 하이라이트의 부분도, 이 V를 조작하는 것으로 간단하게 작성할 수 있습니다. 또, 테크닉으로서 S(채도)를 조금 낮은 값으로 설정하면, 미묘하게 깊이 있는 세련된 색을 만들 수 있습니다.

 

- - - - - -
- - - - - -

[4]색의 추가
한 색에 대해, 명도의 차이가 2 단계 밖에 없는 것은, 입체감을 낼 때 약간 어딘지 부족할지도 모릅니다. 그렇지만, 이대로 만들어 버리면, 앞으로 3색 밖에 추가할 수가 없습니다. 이 경우, 벌써 작성한 색에서는 대용할 수 없는 색을 찾아내 추가하는 것이 포인트입니다.

이 경우, 엷은 녹색과 살색의 하이라이트는 흰색으로 대용 가능하고, 엷은 녹색의 제일 어두운 부분은 파랑의 어두운 색으로 대용 가능하고 살색의 어두운 부분은, 빨강의 어두운 색으로 대용이 가능합니다. 조금 무리가 있어도, 가능한 한 유용하게 운영하는 것이 요령입니다. 그 결과, 물색, 핑크 등, 어떻게 노력해도 대신할 수 없는 색을 추가합니다. 또, 아직 색을 추가할 수 있을 여유가 있어도, 정말로 필요하게 되었을 때를 위해서 남겨 두는 것도 요령입니다.

토오루 - - - - - -
- - - - - - -




 

 




*본 강좌는 일본의 사이트에 올라온 강좌의 번역본 입니다*