뒤통수가 개방된 모자

# 학습 과정 소개

뒤통수가 개방된 모자 제작 방법을 알아봅시다. 기본 모자의 색상을 변경하고, 악세사리를 그릴 수 있습니다. 모자는 복잡한 구조로 바지나 신발 아이템 제작에 익숙해진 후 작업하는 걸 권장합니다. [아바타 아이템 제작의 기본 개념](/docs?postId=588%7B%22target%22:%22_self%22%7D)을 참고해 아바타의 기본 개념을 먼저 숙지하길 바랍니다.

# 사전 준비

아이템 제작을 위해선 Adobe Photoshop이 필요합니다. 해당 소프트웨어를 설치한 후 아래 파일을 받아 엽니다.

$$attachFile {"name":"Avatar_Cap_A1.psd","url":"https://mod-file.dn.nexoncdn.co.kr/storage/Avatar_psd/version4_230221/Avatar_Cap_A1.psd"} $$ $$attachFile {"name":"Avatar_Cap_A2.psd","url":"https://mod-file.dn.nexoncdn.co.kr/storage/Avatar_psd/version5_230602/Avatar_Cap_A2.psd"} $$ $$attachFile {"name":"Avatar_Cap_Ani.psd","url":"https://mod-file.dn.nexoncdn.co.kr/storage/Avatar_psd/version4_230221/Avatar_Cap_Ani.psd"} $$

> Tip. 모자는 아바타 발을 기준으로 최대 120x120 안에서 제작을 권장합니다. [png](16769485559327fc72cf03aca4128998b423540c3e049)

# 제작 시트 설명

모자 제작 시트는 회색, 빨간색, 노란색 레이어로 구분되어 있습니다. 회색 레이어는 이미지를 데이터화하기 위한 data 폴더, 이미지 제작에 도움을 줄 아바타 body 레이어, 가이드용 선 레이어가 있습니다. 회색 레이어는 모두 잠겨있고, 작업 중에 수정은 필요하지 않습니다. 노란색 레이어는 크리에이터가 실제 아이템을 그릴 수 있는 곳입니다. 빨간색 레이어는 모자와 헤어의 우선순위를 결정하는 역할을 합니다.

> Tip. 모든 레이어의 이름을 수정하거나 삭제할 경우 아이템을 제작할 수 없습니다. 절대 이름을 변경하지 마세요.

### 회색 레이어/빨간색 레이어

  1. data 폴더: data 폴더는 아이템을 데이터화하기 위해 필요한 폴더입니다. 이미지 제작에는 영향을 주지 않습니다. 
     * data:origin: 빨간색 점으로 데이터의 중심을 표시합니다.
     * data:type:Cap: 어떤 종류의 데이터인지 알 수 있습니다.
     * data:use_zmap_preset1: 아바타를 구성하는 이미지는 층층이 쌓여 만들어집니다. 아바타의 다양한 몸동작을 만들기 위해 몸을 바탕으로 옷, 방패, 무기 순으로 이미지가 층층이 위에 쌓이는 구조입니다.  
아이템에 따라 분리된 각 Sprite의 높이가 순서대로 정리된 파일이 zmap입니다.
  2. guide_ 레이어: 아바타의 샘플 body입니다. 레이어 이름 뒤에 붙은 숫자가 클수록 아래에 배치되는 내부적인 규칙입니다.  

     * guide_backHairBelowCapWide_samples_94, guide_backHairBelowCapNarrow_samples_95는 모자 모양에 따른 넓은 헤어와 좁은 헤어의 샘플입니다.  
[png](16457811937535becc03a37664135889302106c115bff)
  3. (빨간색 레이어) data:vslot:CpH1H5: 빨간색 레이어는 모자에만 있는 개념입니다. 모자 제작 파일에서의 vslot 레이어는 머리카락과 모자가 겹칠 경우 보이는 우선순위를 결정하는 역할을 합니다.



[png](1677032356769c4bb8003ae4447ab8b8f3f11c31e2428)

### 노란색 레이어

노란색 레이어에 크리에이터가 제작할 모자를 그릴 수 있습니다.

#### 앞모습에서 헤어 앞에 1개의 레이어만 있는 모자 (Avatar_Cap_A1)

  * case1.front: 모자의 앞모습을 그릴 레이어와 앞모습의 일반 헤어와 눌린 헤어 샘플이 포함되어 있습니다. 
    * edithere:cap_cap_34: 모자의 앞모습을 그릴 수 있는 레이어입니다.
  * case2.back: 모자의 뒷모습을 그릴 레이어와 뒷모습의 일반 헤어와 눌린 헤어 샘플이 포함되어 있습니다. 
    * edithere:cap_backCap_92: 모자의 뒷모습을 그릴 수 있는 레이어입니다. [png](16770399860801689e03a56a847c6b3082835b716c0f9)



#### 앞모습에서 헤어 앞뒤로 2개의 레이어가 있는 모자 (Avatar_Cap_A2)

  * case1.front: 모자의 앞모습을 그릴 레이어와 앞모습의 일반 헤어와 눌린 헤어 샘플이 포함되어 있습니다. 
    * edithere:cap_cap_34: 모자의 앞모습을 그릴 수 있는 레이어입니다.
    * edithere:cap_frontBackCap_92: 헤어 뒤에 오는 모자의 앞모습을 그릴 수 있는 레이어입니다.
  * case2.back: 모자의 뒷모습을 그릴 레이어와 뒷모습의 일반 헤어와 눌린 헤어 샘플이 포함되어 있습니다. 
    * edithere:cap_backCap_92: 모자의 뒷모습을 그릴 수 있는 레이어입니다.



[png](16856818406522ccc7186c35648dd8beb320cfcc7a07b)

> 더 알아보기 뒤통수가 개방된 모자(Avatar_Cap_A)를 작업할 때는 guide_backHairBelowCapWide_samples_94, guide_backHairBelowCapNarrow_samples_95의 헤어 샘플 중 Wide와 Narrow 이미지가 동일한 001번 샘플을 사용합니다.

#### 이펙트가 있는 파일(Avatar_Cap_Ani.psd)

아바타 시트에서 앞모습은 4프레임의 애니메이션, 뒷모습은 2프레임의 애니메이션 규칙이 있습니다. 해당 프레임을 모자 이펙트로 적용합니다. 애니메이션 레이어 순서에 따라 재생될 모자와 이펙트를 각각 그려야 합니다.

  * case1.front : 모자의 앞모습과 이펙트를 그릴 레이어들이 animation 폴더에 들어있고, 아바타 샘플이 포함되어 있습니다. 
    * animation 폴더: 모자의 앞모습과 이펙트를 그릴 수 있는 레이어 4장이 있습니다. 동일한 모자를 모든 레이어에 그려야 합니다.
  * case2.back: 모자의 뒷모습과 이펙트를 그릴 레이어들이 animation 폴더에 들어 있고, 아바타 샘플이 포함되어 있습니다. 
    * animation 폴더: 모자의 앞모습과 이펙트를 그릴 수 있는 레이어 2장이 있습니다. 동일한 모자를 모든 레이어에 그려야 합니다. [png](16770332160558c40d4d45b4349d29f54ace53eec586e)



> 더 알아보기 'stand', 'walk', 'fly', 'rope', 'ladder' 동작에서만 이펙트가 재생됩니다. 다른 동작들에서는 첫 번째 프레임만 보입니다.