레이어에서 이미지 정보 생성

레이어 이름에 파일 확장자를 추가하면 Photoshop의 Generator가 저장할 때마다 이미지 파일을 자동으로 생성합니다. 이렇게 하면 여러 형식이나 크기가 필요한 웹, 앱, 다중 디바이스 프로젝트에서 반복적인 내보내기 단계를 없앨 수 있습니다.

반응형 디자인용 @1x, @2x, @3x 버전을 제작하는 경우처럼 여러 형식이나 해상도에서 일관되고 반복 가능한 내보내기가 필요할 때 이 워크플로가 가장 효과적입니다. 일회성으로 내보내거나 형식별 컨트롤이 필요하다면 대신 [파일] > [내보내기] > [다른 이름으로 내보내기]를 사용하십시오.

Generator는 에셋 전용 폴더를 만들고 작업하는 동안 파일을 자동으로 업데이트합니다. 하나의 레이어에서 여러 형식을 생성하고, 품질 설정을 지정하고, 에셋을 다양한 크기로 조정하고, 출력을 하위 폴더로 구성할 수 있습니다. 이 모든 작업은 레이어 이름 지정 규칙만으로 수행됩니다.

• 이름이 지정된 레이어 또는 레이어 그룹이 있는 Photoshop 문서
• 문서를 확인 가능한 위치에 저장됨(그렇지 않으면 에셋이 데스크톱에 표시됨)
• 프로젝트에 필요한 출력 형식에 대한 이해

이미지 에셋 생성 활성화

Photoshop은 저장한 문서 옆의 하위 폴더에 이미지 파일을 생성합니다. 문서를 아직 저장하지 않았다면 에셋은 데스크톱의 새 폴더에 표시됩니다. Generator는 계속 활성 상태를 유지하므로 Generator가 활성화된 레이어를 변경하면 해당 에셋이 자동으로 업데이트됩니다.

하나의 레이어에서 여러 형식 생성하기

하나의 레이어로 서로 다른 형식, 크기, 품질 수준의 에셋을 동시에 생성할 수 있습니다. 레이어 이름에서 각 에셋 사양은 쉼표 또는 더하기 기호로 구분하십시오.

Photoshop은 동일한 레이어 콘텐츠에서 세 개의 개별 파일을 생성하므로, 같은 그래픽을 여러 형식으로 수동으로 내보낼 필요가 없습니다.

화면별 품질 관리 및 에셋 크기 조정하기

품질 접미사는 JPG 파일의 압축률(1~100)을 제어하고, PNG 파일의 비트 심도(8, 24 또는 32)를 제어합니다. 크기 접두사는 상대적 배율을 위한 백분율 또는 절대 픽셀 치수를 사용할 수 있습니다.단위를 혼합해서 사용할 수 있습니다. 예를 들어 "10in x 5cm banner.jpg"처럼 지정하거나, 치수 중 하나를 생략해 비율에 맞게 크기를 조정할 수 있습니다. "1080 x icon.png"는 종횡비를 유지하면서 폭을 1080px로 설정합니다.

상대 배율 예시:

200% logo.png는 에셋 크기를 두 배로 늘립니다

50% thumbnail.jpg는 에셋 크기를 절반으로 줄입니다

절대 크기 지정 예시:

300 x 200 hero.png는 300×200px 크기의 이미지를 생성합니다

10in x 5cm banner.jpg는 서로 다른 단위를 혼합하여 사용합니다(폭 10인치, 높이 5센티미터).

1080 x icon.png는 폭을 1080px로 설정하며, 높이는 비율에 맞게 조정됩니다

에셋을 하위 폴더로 정리하기

기본적으로 생성된 모든 에셋은 PSD 파일 옆의 단일 폴더에 저장됩니다. 파일 이름 앞에 하위 폴더 이름을 추가하면 생성기가 해당 하위 폴더를 자동으로 만들고 사용하도록 지정할 수 있습니다. 이렇게 하면 폴더를 수동으로 관리하지 않고도 관련 에셋을 체계적으로 정리할 수 있습니다.

레이어 이름에 슬래시(/)를 사용하여 하위 폴더 경로를 포함하세요: subfolder/filename.png 또는 icons/logo.svg. 여러 레벨을 중첩할 수 있습니다. 예: assets/icons/logo.png.

에셋을 특정 폴더로 내보내기

Photoshop이 폴더 구조를 자동으로 만들고 각 에셋을 지정된 위치에 배치합니다. 하위 폴더를 크기 접두사 및 품질 설정과 함께 조합하면 에셋 구성을 완전히 제어할 수 있습니다. 예: mobile/200% button@2x.png, desktop/button.jpg90.

문서 전체 기본값 설정

모든 생성된 에셋에 적용되는 기준선 설정을 지정하려면 특수 레이어를 만드세요. 이렇게 하면 개별 레이어 이름에서 매번 매개변수를 지정하지 않아도 됩니다.

빈 레이어를 만들고 원하는 설정 앞에 "default"를 붙여 이름을 지정하세요. 일반적인 구성으로는 모든 에셋 크기를 200%로 조정하는 "default 200%", 모든 항목을 assets 하위 폴더에 저장하는 "default assets/", 또는 모든 파일 이름에 @2x 접미사를 추가하는 "default @2x"가 있습니다.

여러 기본값을 조합할 수도 있습니다. "default 200% retina/ @2x"는 모든 에셋 크기를 200%로 조정하고, retina 하위 폴더에 저장하며, 파일 이름에 @2x 접미사를 추가합니다. 개별 레이어 설정은 문서 기본값을 재정의합니다. 예를 들어 기본값이 "default 200%"로 지정되어 있어도 레이어 이름에 "50% thumbnail.png"가 포함되어 있으면 해당 레이어는 50%로 생성됩니다.

클라우드 문서로 작업

클라우드 문서에서는 생성된 에셋이 PSD 파일과 같은 위치가 아니라 로컬에 저장됩니다. Photoshop은 로컬 콘텐츠와 클라우드 동기화 콘텐츠를 구분하기 위해 이 분리를 유지합니다.

클라우드 문서의 에셋은 다음 위치에 표시됩니다.

• Windows: C:\Usersusername>\Documents\Adobe\Photoshop Cloud Associates
• macOS: /Users//Documents/Adobe/Photoshop Cloud Associates

각 클라우드 문서는 이 디렉터리 안에 자체 하위 폴더를 만듭니다. 작업하는 동안 에셋은 자동으로 생성되지만, Creative Cloud에서 명시적으로 공유하거나 동기화하기 전까지는 로컬 컴퓨터에만 유지됩니다.

에셋 생성 비활성화

한 번 활성화하면 문서의 이미지 에셋 생성은 세션이 바뀌어도 계속 활성 상태로 유지됩니다. 이 기능은 저장할 때마다 에셋을 자동으로 다시 생성하므로, 복잡한 문서에서는 성능이 느려질 수 있습니다.

현재 문서의 생성을 끄려면 파일 > 자동화 > Generator Plugins > Image Assets 선택을 해제하세요.이렇게 하면 자동 에셋 만들기는 중지되지만 기존 에셋과 레이어 이름은 유지됩니다.

모든 문서에서 생성기를 전역적으로 끄려면 편집 > 환경설정 > 플러그인을 선택하고, 생성기 활성화의 선택을 해제한 후 확인을 선택합니다. 이렇게 하면 [환경설정]에서 다시 활성화하기 전까지 생성기 기능이 완전히 꺼집니다.