Pixel Map Maker 사용 설명서

타일맵 제작, 픽셀 텍스처 편집, 에셋 배치, 3D 프리뷰, 협업, 저장과 내보내기까지 사이트의 주요 기능을 빠르게 확인할 수 있는 설명서입니다.

온라인 협업형 에디터 기준
사용설명서 HTML 다운로드

1. 시작하기

로그인 후 프로젝트를 열고, 왼쪽 패널에서 타일 또는 에셋을 선택해 작업합니다.

상단 상태

온라인 N명, 편집 모드, 로그인 사용자 상태를 확인합니다. 온라인 인원에 마우스를 올리면 접속 중인 사용자 목록을 볼 수 있습니다.

새로고침

최초 접속 또는 F5 새로고침 후에는 프로젝트가 열려 있어도 선택 타일/에셋 없음 상태로 시작합니다.

2. 프로젝트

새 프로젝트

빈 프로젝트를 생성합니다.

프로젝트 선택

GitHub 프로젝트 또는 로컬 폴더에서 프로젝트를 불러옵니다.

저장하기

덮어쓰기 또는 다른 이름으로 저장을 선택할 수 있습니다.

내보내기

PNG, Unity용 데이터 등 외부 사용을 위한 결과물을 생성합니다.

Ctrl + S 는 현재 프로젝트의 덮어쓰기 단축키입니다. 브라우저 기본 페이지 저장은 사용하지 않습니다.

3. 타일과 레이어

타일은 목적에 따라 그룹으로 나뉘며, 좌측 패널에서 관리합니다.

구분용도
오브젝트 타일기본 타일 위에 올라가는 오버레이 계층. 기본 타일이 없는 칸에는 배치하지 않습니다.
기본 타일맵의 주된 바닥/벽 타일 계층입니다.
심층 타일기본 타일 아래쪽의 깊이 표현용 계층입니다.
최하단 바닥맵 최하층 배경/바닥 계층입니다.

텍스처 유형

고립형

주변 타일과 연결 규칙 없이 독립적으로 표시됩니다.

같은 연결

같은 타일이 인접한 방향에 맞춰 연결 상태를 표시합니다.

다른 연결

다른 타일이 존재하는 방향만 연결 텍스처를 적용합니다. 같은 타일이 있는 방향에는 생성하지 않습니다.

연결 텍스처 적용 범위는 우측 설정에서 접기/펼치기로 조절합니다.

4. 픽셀 편집

타일 또는 에셋의 텍스처를 직접 수정합니다.

기본 도구

펜, 지우개, 채우기, 직사각형 채우기, 올가미, 디더링 등.

브러시 설정

펜 크기, 불투명도, 정사각/원형 브러시 형태를 조절합니다.

색상

색상환, HSV, HEX 등으로 색상을 지정합니다.

레이어 효과

타일 레이어의 색조/채도/명도 등을 조절할 수 있습니다.

프로젝트 데이터를 변경하는 모든 편집 작업은 Ctrl+Z / Ctrl+Y로 되돌리기/다시 실행할 수 있습니다. 연속 슬라이더나 드래그 조작은 한 번의 조작을 하나의 Undo 단계로 처리합니다.

5. 맵 에디터

선택한 타일을 맵에 배치하고, 선택/채우기/삭제/이동 등의 작업을 수행합니다.

타일 배치

타일을 선택한 뒤 맵을 클릭하거나 드래그하여 배치합니다.

선택/채우기

사각 선택, 올가미, 영역 채우기 등으로 범위를 편집합니다.

2D 조작

휠로 커서 기준 확대/축소, 휠클릭 드래그로 화면 이동.

3D 프리뷰

높이/등고선과 타일의 입체 배치를 확인합니다.

맵 타일 배치는 맵 단위 Lock을 사용합니다. 누군가 같은 맵의 타일 배치를 작업 중이면 다른 사용자는 그 맵에서 타일을 배치하거나 제거할 수 없습니다.

6. 에셋

에셋은 타일 크기와 독립적인 자유 크기 이미지 리소스입니다.

에셋 생성/편집

빈 에셋

원하는 폭×높이로 새 에셋을 만듭니다.

이미지 가져오기

원본 이미지 크기를 유지해 에셋으로 추가합니다.

레이어

래스터 레이어, 폴더, 표시/숨김, 이름 변경, 복제/삭제, 순서 이동을 지원합니다.

합성

불투명도, Multiply/Screen/Overlay/발광 계열, 클리핑, 투명 픽셀 잠금 등을 사용할 수 있습니다.

에셋 배치

  • 클릭한 위치를 에셋 중심점으로 사용합니다.
  • 같은 좌표를 클릭하면 크기가 다른 에셋도 중심점이 동일한 위치에 배치됩니다.
  • 배치된 에셋 위에서 휠클릭 + 드래그하면 위치를 이동할 수 있습니다.
  • 에셋 관리 영역에 현재 맵의 배치 개수를 표시합니다.
  • 배치한 에셋 삭제는 해당 에셋의 현재 맵 배치 인스턴스를 즉시 제거하며 확인창 없이 실행됩니다.
  • 원본 에셋 삭제는 확인창을 표시합니다.

7. 온라인 협업

텍스처 편집과 맵 배치는 서로 다른 잠금 규칙을 사용합니다.

작업동시 작업 규칙
타일 텍스처타일별 독립 Lock. A가 타일 1을 수정 중이어도 B는 타일 2를 수정할 수 있습니다.
에셋 텍스처에셋별 독립 Lock. 서로 다른 에셋은 동시에 편집 가능합니다.
맵 타일 배치맵 전체 Lock. 한 사용자가 맵 배치를 시작하면 다른 사용자는 같은 맵의 타일 배치를 할 수 없습니다.
에셋 배치독점 Lock 없음. 배치/제거/이동 시 최신 서버 상태를 읽고 operation 단위로 병합합니다.
A: Tile 1 편집 ──┐ ├─ 동시에 가능 B: Tile 2 편집 ──┘ A: Map 1 타일 배치 → Map 1 Lock B: Map 1 타일 배치 → 차단 A/B: 에셋 배치 → 변경 시 서버 최신 상태와 병합 → 실시간 공유

다른 사용자의 저장 때문에 내가 작업 중인 다른 타일/에셋 텍스처가 초기화되지 않도록 변경된 리소스만 부분 갱신합니다.

8. 내보내기

PNG

맵 레이어를 PNG로 출력합니다. 배치한 에셋 포함 토글을 켜면 맵에 배치한 에셋도 PNG 결과에 반영합니다.

에셋 파일

에셋은 맵 레이어와 분리하여 별도 출력합니다.

Unity

맵과 에셋을 별도 프리팹 구조로 출력합니다. 에셋 레이어는 Unity 출력 시 자동 병합합니다.

정렬 기준

맵 레이어는 동일한 캔버스 크기/원점/PPU/피벗을 유지하여 재조립 시 어긋나지 않도록 합니다.

맵 레이어 병합 대상은 타일 레이어 + 최하단 바닥이며, 에셋 원본은 맵 레이어와 별개입니다.

9. 단축키 / 마우스 조작

조작기능
Ctrl + Z직전에 프로젝트 데이터를 변경한 작업을 되돌립니다. 그림, 배치, 삭제, 이동, 레이어/설정/수치 변경 등에 적용됩니다.
Ctrl + YCtrl+Z로 되돌린 프로젝트 변경을 다시 실행합니다.
Ctrl + S현재 GitHub 프로젝트를 덮어쓰기 저장합니다. 저장 직전 상태는 자동 백업됩니다.
Q / W / E / R / A / S픽셀 편집 도구를 각각 펜 / 디더링 / 지우개 / 채우기 / 올가미 / 직사각형 채우기로 전환합니다. 입력칸에 타이핑 중일 때는 실행되지 않습니다.
Esc열려 있는 사용 설명서 패널을 닫습니다.
마우스 휠맵/프리뷰 확대·축소
휠클릭 + 드래그일반 영역: 화면 이동 / 배치 에셋 위: 해당 에셋 이동
좌클릭현재 선택 도구 실행 또는 타일/에셋 배치
우클릭도구별 제거/반대 동작

10. 저장 백업 정책

GitHub 덮어쓰기 저장 전에 이전 프로젝트 상태를 자동 백업하는 안전장치입니다.

덮어쓰기 / Ctrl+S ↓ 현재 GitHub 프로젝트 상태 확인 ↓ 48시간이 지난 백업 정리 ↓ 저장 직전 프로젝트를 새 Snapshot으로 백업 ↓ 프로젝트별 백업이 20개를 초과하면 가장 오래된 백업부터 삭제 ↓ 백업 성공 확인 ↓ 실제 덮어쓰기 저장
보관 기간

각 백업은 최대 48시간 유지합니다. 시간이 지났다고 즉시 삭제하는 것이 아니라 다음 저장 시 정리합니다.

최대 개수

프로젝트당 최대 20개. 초과하면 생성 시각이 가장 오래된 백업부터 제거합니다.

프로젝트별 분리

각 프로젝트의 백업은 서로 영향을 주지 않도록 별도 관리합니다.

저장 안전성

백업 생성에 실패하면 원본 프로젝트를 먼저 덮어쓰지 않도록 합니다.

내보내기 · Unity Prefab

내보내기 창의 추출 맵에서 출력할 맵을 선택합니다. 등고선 텍스처 적용을 끄면 높이 데이터는 프로젝트에 유지한 채 출력 이미지에만 등고선 색상 효과를 적용하지 않습니다.

Unity 출력은 선택한 맵의 맵 Prefab 1개와 프로젝트의 각 에셋별 Prefab 1개로 분리됩니다. 맵 Prefab의 타일 출력 그룹 이미지는 모두 같은 캔버스 크기·중심 Pivot·PPU로 생성되어 위치가 틀어지지 않습니다. 에셋은 사이트에서 보이는 최종 합성 결과(가시성·투명도·블렌드·클리핑 반영)를 단일 Sprite로 합쳐 에셋당 하나의 Prefab으로 생성합니다. 에셋 배치 인스턴스는 맵 Prefab에 합치지 않습니다.

공통 텍스처 레이어 · 선택 변형 · 저장 상태

에셋뿐 아니라 타일과 최하단 바닥의 각 텍스처도 레이어/폴더/불투명도/블렌딩/클리핑/알파 잠금을 사용할 수 있습니다. 영역선택(직사각형/올가미) 후 선택 내부를 드래그하면 픽셀을 이동하고, 선택 가장자리를 우클릭 드래그하면 중심 기준으로 회전합니다. 이동·회전은 픽셀아트가 흐려지지 않도록 Nearest Neighbor 방식으로 처리됩니다.

저장 중에는 상단 상태가 저장 중…으로 표시되며 진행 표시가 나타납니다. 실제 서버 저장이 끝난 뒤에만 저장됨저장되었습니다. 알림이 표시됩니다. 저장 도중 추가 수정이 발생하면 해당 수정은 저장되지 않은 상태로 유지됩니다.