각 레이어의 캔버스 위치를 유지하려면 전체 문서나 아트보드를 내보내기 영역으로 설정하고 해당 레이어만 내보내세요. 주변의 투명한 공간이 정렬을 유지하도록 모든 파일에서 해당 영역과 출력 크기를 동일하게 설정하세요.

이 가이드에서는 현재 Mac용 Affinity 데스크톱 앱을 사용해, 다시 겹쳐 놓았을 때 서로 정렬되는 개별 파일을 만드는 방법을 다룹니다. Affinity의 최신 도움말에서는 전용 내보내기 작업 공간을 Slice Studio라고 부릅니다. 문서에 설명된 다음 구분이 중요합니다. 레이어에서 만든 슬라이스는 원본 레이어를 내보내지만, 직접 그린 슬라이스는 사각형 안에 있는 모든 표시된 레이어를 내보냅니다. Slice Studio를 사용한 내보내기

레이어를 개별적으로 내보낼 때 캔버스 정렬이 어긋날 수 있는 이유

Affinity는 레이어, 그룹 또는 객체에서 만든 슬라이스의 크기를 해당 항목의 범위에 맞게 자동으로 설정합니다. 작은 에셋을 내보내는 데는 유용하지만, 결과물의 내보내기 영역에 원래 캔버스의 여백이 포함되지 않을 수 있습니다. 직접 그린 슬라이스는 다른 방식으로 작동합니다. 사각형이 내보내기 영역을 정의하며, 그 안에 있는 다른 레이어의 표시된 콘텐츠도 포함됩니다. Slice Studio를 사용한 내보내기

따라서 실제 작업에서는 콘텐츠 선택과 내보내기 경계 설정을 별도로 결정해야 합니다. 원하는 결과물을 정하는 것은 선택한 레이어입니다. 해당 콘텐츠가 나타나는 좌표계를 정하는 것은 문서 또는 아트보드 경계를 유지하는 일입니다.

예를 들어 1000 × 1000픽셀 문서에 왼쪽 위 모서리가 x = 120, y = 240에 있는 파란 사각형이 있다고 가정해 보겠습니다. 전체 캔버스를 내보내면 사각형 주변의 여백이 유지됩니다. 사각형에 맞춰 영역을 좁게 설정하면 주변 공간이 사라집니다. 그런 다음 두 파일을 모두 같은 왼쪽 위 원점에 배치하면, 사각형이 서로 다른 위치에 나타납니다.

내보낸 모든 파일의 크기를 같게 하는 것은 요구사항의 절반에 불과합니다. 모든 파일의 내보내기 원점과 배율도 같아야 합니다. 잘라낸 파일을 1000 × 1000픽셀로 확대하면 빠진 여백이 복원되는 것이 아니라 배율이 바뀝니다.

전체 캔버스를 사용해 한 번에 보이는 레이어 하나씩 내보내기

페이지가 하나인 문서에서는 일반적인 레이어 표시 설정과 Whole document 내보내기를 함께 사용하는 것이 가장 직접적이고 공식적으로 지원되는 방법입니다. Affinity 문서에 따르면 숨긴 레이어는 내보내지지 않으며, 내보내기 대화상자에서 문서, 페이지, 선택 영역, 이름이 지정된 아트보드 등을 내보내기 영역으로 설정할 수 있습니다. 아래 절차는 이 문서화된 컨트롤을 조합한 것입니다. 레이어 패널, 내보내기 대화상자

문서와 투명 배경 준비하기

표시 여부를 바꾸기 전에 작업 문서를 저장하세요. 문서의 목표 너비와 높이를 확인하고, 각 결과물이 될 레이어나 그룹을 정하세요. 예를 들어 원과 함께 표시되는 중립적인 텍스트가 한 그룹에 들어 있다면, 두 개가 아니라 해당 그룹 전체가 하나의 출력물이 될 수 있습니다.

Mac에서 Document > Setup > Document Setup을 여세요. 페이지를 투명하게 만들려면 Transparent background를 켜세요. 설정 대화상자에서 문서 크기를 확인하되 변경하지 마세요. 사용할 수 있는 설정은 문서에 페이지나 아트보드가 포함되어 있는지에 따라 달라집니다. 문서 설정(데스크톱 전용)

페이지를 투명하게 설정해도 그림 뒤에 그려 둔 단색 사각형이 사라지는 것은 아닙니다. 각 파일을 내보내기 전에 배경 객체를 숨기세요. PNG와 SVG는 투명도를 지원하므로, 별도의 출력물을 겹쳐 놓을 때 불투명한 페이지가 아래쪽 그림을 가리지 않도록 해야 한다면 적합한 형식입니다. 화면에서 인쇄물까지: 디지털 및 인쇄용 로고 전달 방법

첫 번째 결과물만 표시하고 관련 없는 콘텐츠 숨기기

레이어 패널이 보이지 않으면 Window > General > Layers를 여세요. Toggle Visibility를 사용해 의도한 출력물은 표시하고 관련 없는 레이어는 숨기세요. Affinity에서는 레이어를 Control-클릭했을 때 표시되는 컨텍스트 메뉴의 Hide Others도 사용할 수 있습니다. 내보내기 전에 캔버스를 확인하세요. 레이어 패널

의도한 모양을 만드는 데 필요한 콘텐츠를 함께 유지하세요. 결과물이 중첩된 콘텐츠를 포함한 그룹이라면 해당 그룹을 출력 단위로 사용하세요. 일부러 제외한 구성 요소의 시각적 효과를 파일 하나만으로 재현할 수는 없습니다.

문서 경계를 내보낸 다음 반복하기

  1. File > Export > Export를 선택합니다.
  2. 적절한 PNG 프리셋을 선택합니다.
  3. 페이지가 하나인 캔버스에서는 Area를 Whole document로 설정합니다. 특정 아트보드를 내보내려면 해당 아트보드의 이름을 선택합니다.
  4. 미리보기를 확인하고 출력 크기가 목표 캔버스 크기와 일치하는지 확인합니다.
  5. Ask for Location을 선택하고 Export를 클릭한 뒤, 파일 이름을 정해 저장합니다.
  6. 레이어 패널로 돌아가 내보낸 결과물은 숨기고 다음 결과물은 표시합니다. 같은 영역과 크기로 반복합니다.

메뉴 경로, 영역 선택지, 저장 순서는 Affinity의 내보내기 대화상자 설명서에 나와 있습니다. 너비와 높이는 기본적으로 이미지의 원래 크기를 사용하지만 변경할 수 있으므로, 이전에 사용한 프리셋의 크기가 맞다고 가정하지 말고 확인하세요. 내보내기 설정

아트보드가 여러 개라면 대상 아트보드를 명시적으로 선택해 혼동을 피하세요. 문서에 설명된 Whole document 동작은 문서의 아트보드를 각각 별도의 이미지 파일로 만들 수 있습니다. 이는 “선택한 레이어의 아트보드만 내보내기”를 뜻하지 않습니다. 내보내기 설정

Slice Studio에서 전체 캔버스 크기로 레이어를 일괄 내보낼 수 있나요?

Slice Studio에서는 레이어에서 만든 여러 슬라이스를 다양한 형식과 크기로 내보낼 수 있습니다. 하지만 설명서에는 모든 레이어를 각각 독립적인 전체 캔버스 크기의 파일로 만드는 단일 명령이 나와 있지 않습니다. 자동으로 만든 레이어 슬라이스는 원본 항목의 범위에서 시작합니다. 일괄 선택과 캔버스 여백 유지를 별개의 요구사항으로 다루세요. Slice Studio를 사용한 내보내기

내보내기 방식 설명서에 명시된 콘텐츠 경계 이 작업에서의 의미
레이어에서 만든 슬라이스 원본 레이어만 포함하며, 처음에는 해당 항목의 범위에 맞춰 크기가 설정됨 자동으로 만드는 것만으로 전체 캔버스 여백이 확보되지는 않습니다.
Slice Tool로 그린 슬라이스 사각형 안에 있는 모든 표시된 레이어 전체 캔버스 사각형을 사용할 경우 결과물마다 표시 여부를 바꿔야 합니다.
관련 없는 레이어를 숨긴 상태에서 전체 문서 내보내기 문서 내보내기 영역과 표시된 콘텐츠 정렬된 개별 파일을 간편하고 반복적으로 만드는 방법입니다.

위의 슬라이스 구분은 Slice Studio를 사용한 내보내기에, 일반적인 숨김 레이어 동작은 레이어 패널에 설명되어 있습니다.

재사용할 내보내기 영역이 필요하면 고정된 슬라이스를 직접 그리기

직접 그린 슬라이스는 더 큰 구성에서 공통 출력 영역을 특정 사각형으로 지정해야 할 때 유용합니다. Affinity 설명서에 따르면 Slice Tool로 만든 슬라이스의 크기와 위치는 Slice Studio의 Transform 패널에서 정확히 설정할 수 있습니다. 공통 사각형을 하나 정의한 뒤, 내보낼 때마다 일반 레이어의 표시 여부를 바꿔 결과물 하나씩 분리하세요. 슬라이스 내보내기

이름을 각각 따로 지정하는 결과물을 수동으로 내보내려면 Continuous를 끈 상태에서 표시 여부를 변경한 뒤 매번 직접 내보내세요. Continuous 내보내기는 문서 콘텐츠나 슬라이스 설정이 바뀔 때 체크된 슬라이스를 다시 내보냅니다. 따라서 연속해서 변경한 여러 표시 상태를 각각 별도의 결과물로 보존하려는 경우에는 적합하지 않습니다. 슬라이스 내보내기

Affinity에서는 레이어에서 만든 슬라이스의 크기를 바꾼 뒤 Revert to auto sized로 복원하는 방법도 설명합니다. 이 명령은 슬라이스를 원래 크기로 되돌릴 뿐이며, 전체 캔버스에 정렬하는 명령은 아닙니다. “캔버스 위치 유지” 또는 “모든 레이어를 캔버스 크기로 내보내기”라는 컨트롤이 있다고 가정하지 마세요. Slice Tool

PNG와 SVG에서 어떤 설정이 중요할까요?

PNG의 경우 전체 내보내기 영역, 투명도, 목표 픽셀 크기를 유지하세요. 레이어마다 너비나 높이를 바꾸지 마세요. 모든 결과물을 의도적으로 배율 조정한다면 좌표계를 서로 호환되게 유지할 수 있도록 모든 파일에 같은 배율을 적용하세요. Affinity 설명서에는 래스터 내보내기의 너비, 높이, 가로세로 비율 컨트롤이 나와 있습니다. 내보내기 설정

슬라이스 배율은 추가로 확인해야 합니다. 문서 DPI와 슬라이스 배율의 관계에 관한 Affinity 설명서에 따르면 1x가 항상 문서의 픽셀 크기와 같지는 않습니다. 설명서의 예시에서는 144 DPI의 64 × 64픽셀 문서가 1x에서 32 × 32픽셀로, 2x에서 64 × 64픽셀로 내보내집니다. 슬라이스를 사용할 때는 실제 출력 크기를 확인하세요. Slice Studio를 사용한 내보내기

SVG에서도 동일하게 표시 여부를 설정하고 전체 영역을 내보내세요. Affinity 설명서에 따르면 view-box 데이터가 활성화된 경우 SVG viewBox가 내보내기 영역과 일치합니다. 따라서 먼저 선택 영역을 좁게 설정하면 view-box 출력을 활성화해도 문서의 여백을 복원할 수 없습니다. 전체 문서나 이름이 지정된 아트보드를 내보내기 경계로 선택해야 합니다. 내보내기 설정

SVG에는 별도의 모양 관련 한계도 있습니다. 일부 디자인 속성은 래스터화해야 합니다. Affinity의 Rasterize 설정은 지원되지 않는 속성을 래스터화할 수 있으며, Nothing을 선택하면 해당 형식에서 지원하지 않는 요소가 생략됩니다. 따라서 캔버스 위치를 유지한다고 해서 내보낸 모든 요소가 편집 가능한 벡터 아트워크로 남는 것은 아닙니다. 내보내기 설정

나머지 레이어를 내보내기 전에 정렬 확인하기

문서 전체에 이 절차를 반복하기 전에 간단한 출력물 두 개로 확인하세요. 다음은 실제 테스트 결과가 아닌, 가상의 그림을 사용한 진단 방법입니다.

  1. 원본 문서에서 위치가 확연히 다른 중립적인 모양 두 개를 사용합니다.
  2. 같은 전체 캔버스 경계와 출력 크기로 각각 내보냅니다.
  3. 내보낸 파일을 열어 전체 크기를 확인합니다.
  4. 투명한 여백을 자르지 않은 상태로 두 파일을 모두 같은 왼쪽 위 원점과 크기의 대상 캔버스에 배치합니다.
  5. 원본 구성과 비교해 두 모양의 상대 위치를 확인합니다.

파일 크기가 다르면 내보내기 영역과 크기 설정부터 살펴보세요. 크기는 같은데 그림이 이동했다면 한 파일에서 다른 슬라이스 원점을 사용했는지, 대상 애플리케이션이 콘텐츠를 자르거나 가운데 정렬했는지 확인하세요. 원치 않는 그림이 나타나면 표시 여부를 확인하고, 겹치는 표시 레이어를 포함하는 직접 그린 슬라이스를 사용했는지도 살펴보세요.

두 파일 확인이 끝나면 나머지 결과물에도 같은 경계, 크기, 표시 여부 설정을 반복하세요. 내보내기와 배치 과정에서 주변의 빈 공간을 유지하세요. 이 공통 캔버스가 있어야 개별적으로 내보낸 레이어를 원래 레이아웃으로 다시 구성할 수 있습니다.

출처