# NFT 호환 프레임 만들기

### NFT 호환 프레임 만들기&#xD;

![](https://4143380045-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MO_j99BJEXK4zHqxgqS%2F-MlCk5NAJODvaQYKlmwR%2F-MlEIkGg_10M8hqkpAtv%2FVoxEdit_Frame_Header_01.png?alt=media\&token=5e517fa7-0cd2-4bc2-aac6-229cc8344e91)

이 페이지에서는 **커스텀 NFT 프레임**을 생성하여 게임 메이커를 이용해 경험 안에서 사용할 수 있는 **NFT 디스플레이 컴포넌트**를 제작하는 법을 알아봅니다.

{% embed url="<https://www.youtube.com/watch?v=gAm3jKWu2jw>" %}

### &#xD;새 프로젝트 생성&#xD;

**복스에딧**을 실행해 화면 왼편의 옵션에서 '**모델러**'를 선택합니다. 다음 화면에서 '**새로운 애셋 만들기**'를 선택하고 원하는 위치에 프로젝트를 저장합니다.

![](https://4143380045-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MO_j99BJEXK4zHqxgqS%2F-MlCk5NAJODvaQYKlmwR%2F-MlEL7jkwwKHG7f0NoXF%2FVoxEdit_NewProject_01.png?alt=media\&token=c2d0fb10-3768-4395-bcc8-ae50954ef8ce)

### &#xD;프레임 제작&#xD;

프로젝트가 생성되면 **뷰포트에 세 가지 선**이 표시됩니다. **X축은 빨간색**, **Y축은 초록색**, **Z축은 파란**색입니다. 화면 상단에 같은 색으로 표시된 박스 안의 숫자를 수정하여 선의 길이를 조정할 수 있습니다.

NFT 프레임을 제작하기 위해서는 **최소 두 개 복셀 이상의 깊이**를 설정해야 하므로 공간 깊이 설정부터 시작해 보겠습니다.

![](https://4143380045-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MO_j99BJEXK4zHqxgqS%2F-MlCk5NAJODvaQYKlmwR%2F-MlENAQSKcSDDF5Hix_e%2FVoxEdit_Depth.png?alt=media\&token=6bfad443-87c4-43ab-ae8e-303708075846)

화면 상단에서 **Z축**에 해당하는 **박스를 클릭**하고 기본 설정인 32를 **2로 수정**합니다. 그러면 파란색 선의 길이가 줄어들어 깊이가 수정된 것을 확인할 수 있습니다.

{% hint style="info" %}
**복셀 깊이가 1**일 경우 NFT 프레임이 **작동하지 않으며 최소 2개 이상**의 복셀이어야 합니다.
{% endhint %}

### 프레임 크기 설정&#xD;

예를 들어, **큰 크기의 NFT 프레임**을 만든다고 가정해 봅시다.

X축 박스에 **300을 입력**하면 최대 256을 초과할 수 없다는 **에러 메시지**가 표시됩니다. 따라서 설정 가능한 **최대 크기는 256**임을 알 수 있습니다.

그러면 **X축과 Y축에 256**을 입력해 보겠습니다. 이제 작업 공간이 256x256x2로 설정되었습니다.

{% hint style="info" %}
**고유한 치수**의 특정 NFT용 프레임을 제작하는 경우 커스텀 프레임의 사이즈를 정할 때 주의해야 합니다.
{% endhint %}

### &#xD;공간 채우기&#xD;

작업 공간의 크기가 설정되었지만 **아직 공간이 복셀로 채워지지 않았습니다**. **생성 모드** (단축키 2)를 선택하여 박스 도구 (R 키)를 이용해 수동으로 복셀을 추가하거나 **채우기 도구 (Y 키)**&#xB97C; 이용해 한 번에 이 **공간을 채울** 수 있습니다.&#x20;

왼쪽 패널에서 **채우기 도구**를 선택해 **뷰포트에서 마우스 왼쪽** 버튼을 클릭하면 설정된 공간이 채워집니다.

![](https://4143380045-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MO_j99BJEXK4zHqxgqS%2F-MlCk5NAJODvaQYKlmwR%2F-MlEPTKp1z6ro55mZ_9b%2FVoxEdit_Fill.png?alt=media\&token=faa7771b-af7e-4056-8b2b-05983a98195c)

카메라를 회전하여 위치를 변경해 **프레임이 2 복셀 깊이**인지 확인하세요. 문제가 없다면 다음 단계로 넘어갑니다.

{% hint style="info" %}
화면 상단의 값을 변경하여 언제든지 설정 공간의 크기를 조정할 수 있습니다.
{% endhint %}

### 피벗 포인트 설정&#xD;

피벗 포인트는 **애셋의 원점을 정의**하고, **회전 시 중심**이 되며 게임 내 포지셔닝을 용이하게 합니다.

왼쪽 패널에서 **피벗 도구를 클릭**하거나 **단축키 P**를 눌러 시작합니다. 애셋의 **중간 지점 하단 모서리**를 따라 피벗 포인트를 원하는 지점으로 이동합니다.

![](https://4143380045-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MO_j99BJEXK4zHqxgqS%2F-MlCk5NAJODvaQYKlmwR%2F-MlER7ec2v8RU_dMFZML%2FVoxEdit_Pivot.PNG?alt=media\&token=08086816-be4b-44f6-8277-99c74874308d)

이 경우에는 너비 (X축)이 256이므로 **중간 지점 (X, 128)**&#xC5D0;서 **복셀 (Y, 0)의 하단**을 따라 정렬되도록 피벗 포인트를 조정합니다.

### 프레임 정의하기&#xD;

다음으로, **NFT 프레임**과 연관되는 영역을 설정해야 합니다.

왼쪽 툴바에서 피벗 도구 바로 밑에 위치한 **프레임 도구를 선택**합니다.

선택한 다음, **클릭 후 드래그하여 프레임**을 생성합니다.

결과에 따라 **전체 표면을 사용**하거나 NFT를 표시하려는 영역만 한정하여 사용할 수 있습니다.

{% hint style="info" %}
**애셋 하나**당 **하나의 프레임** 영역만 허용됩니다.
{% endhint %}

이 예시에서는 전체 표면을 프레임으로 사용할 것이므로, **오른쪽 코너**를 클릭하고 **드래그하여 반대편 왼쪽 코너**까지 내려갑니다.

![](https://4143380045-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MO_j99BJEXK4zHqxgqS%2F-MlCk5NAJODvaQYKlmwR%2F-MlESoUcZxtk-wt8mQaU%2FVoxEdit_FrameTool_01.png?alt=media\&token=ec31d874-8cba-4095-9608-bc7a5763ee13)

코너에서 코너로 마우스를 드래그하면 선택한 영역이 **핑크색에서 초록색**으로 바뀐 것을 확인할 수 있습니다.

### 프레임 내보내기&#xD;

지금까지 잘 따라왔다면, 다음으로 넘어가기 전 **저장**을 합니다.

이제 인터페이스 왼쪽 상단의 '**파일**'을 클릭한 후 '**내보내기**'를 선택 후에 '**마켓플레이스로 내보내기**'를 클릭하여 더 샌드박스 마켓플레이스로 애셋을 내보냅니다.

그러면 애셋의 **썸네일으로 사용할 사진**을 고르는 팝업창이 뜨고, **썸네일**용 사진을 선택한 후 '**내보내기**'를 클릭합니다.

![](https://4143380045-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MO_j99BJEXK4zHqxgqS%2F-MlCk5NAJODvaQYKlmwR%2F-MlEWNbaSbhf-gx02pKl%2FVoxEdit_Export_01.png?alt=media\&token=2954f9a4-1a21-4baf-ab8d-4e469ad5a976)

'내보내기'를 클릭하면 브라우저 창에 **더 샌드박스 대시보드**가 열립니다. **내 계정으로 로그인**했는지 확인해 주세요.

애셋 업로드 화면에서 '**새로운 애셋**'을 생성할 것인지 '**애셋 교체**'를 할 것인지 선택해야 합니다. 이 예시에서는 '**새로운 애셋**'을 클릭하겠습니다.

다음 페이지에서 애셋의 **이름과 설명**을 작성합니다.

![](https://4143380045-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-MO_j99BJEXK4zHqxgqS%2F-MlCk5NAJODvaQYKlmwR%2F-MlEXUFyTuOsaaWIjAG_%2FVoxEdit_Export_02.png?alt=media\&token=cae281cb-a606-43dd-a2d9-822c834f919a)

모두 완료되면 '**계속**' 버튼을 클릭합니다.

이제 내가 제작한 애셋이 생성되었으며 다음 두 페이지 (**카테고리와 요약**)는 **프레임이 내 경험에서 작동**하는 데 큰 영향을 미치지 않습니다.

### 게임 메이커에서 내 프레임에 액세스하기&#xD;

게임 메이커가 오픈되어 있다면, 새롭게 추가된 애셋이 라이브러리에 표시되기 전에 **경험을 새로고침**해야 합니다.

새로고침 후, **L 키를 눌러 라이브러리를 오픈**하고 내가 만든 프레임 **애셋의 이름**으로 애셋을 검색합니다.

게임 메이커에 내 프레임이 보이나요? 그렇다면 성공입니다! **나만의 프레임을 성공적으로 제작하여 게임 메이커로 불러왔습니다**.

이제 경험에 프레임을 **드래그하여 배치한 후 그 안에 NFT를 추가**합니다. 더 자세히 알아보려면 [**NFT 이미지 디스플레이**](https://sandboxgame.gitbook.io/the-game-maker-academy_kr/QXVjiJZSETueiVsHSiOX/components/types-of-components/displaying-external-nfts) 페이지를 참조하세요.
