Photoshop의 이미지 자산 기능을 사용하여 해상도가 다른 선험 전자계산기 이미지를 한 번에 보내는 방법과 도면층 복사 스크립트

배경.

최근에 Mac의 데스크톱에 사용할 아이콘을 설정할 기회가 생겼습니다.
프로그램의 아이콘은 그림을 설정하면 끝나는 것이 아니라 데스크톱에 놓거나 알림 영역에 표시하는 등 다양한 해상도를 설정하는 아이콘입니다.
이번에는 맥을 위한 데스크톱 앱으로 설정해야 할 이미지는 16px, 32px(retina), 32px, 64px(retina), 128px, 256px(retina), 512px1024px(retina) 10종이다.
적절한 해상도로 출력해야 합니다.9번이나 10번의 크기와 저장된 지령도 번거롭기 때문에 다시 변경할 필요가 있으면 수정된 내용을 다시 복제해야 한다.이렇게 되면 엔지니어처럼 자동화되어야 한다.
16×16 또는 32×32 등 아이콘의 경우 안티 믹싱으로 확대 축소하기보다 포인트로 그린 요령을 손책으로 쓰면 더 좋은 결과를 얻을 수 있으니 품질을 추구할 때는 손으로 하세요.이번에는 노동력과 자재를 줄이는 방법이다.

TL;DR

Photoshop의 이미지 자산 기능을 사용하면 저장할 때 여러 도면층을 여러 파일로 출력합니다.

한 층을 여러 층으로 복사하고 이름을 바꿔야 하기 때문에 스크립트를 만들었습니다.

이미지 자산 기능

제목과 같이 이번에는 포토샵으로 아이콘 이미지를 만들기로 했다.
포토샵은 이미지 자산 기능이 있는데 이걸 쓰면.psd 파일을 저장할 때 그림층으로 내보낼 수 있습니다.
나는 이 간단하게 사이즈 조정된 그림을 아이콘으로 쓰고 싶다.
이미지 파일의 형식과 해상도를 설정하려면 이미지 자산으로 쓸 도면층에 적당한 이름을 붙여야 합니다.예를 들어 층 이름32 x 32 logo.png을 설정하면 32px 사방의 pg 이미지를 지정할 수 있다.

원래 복사하고 이름 바꾸기 귀찮아요.

이번에는 오리지널 도면층을 바탕으로 9차례 복제·이름 변경이 이뤄져야 한다.거기서 자동화하기 위해 번거롭게 이름을 바꾸는 건 단순해.jsx 스크립트를 썼습니다.
대본이 30줄 정도밖에 안 되기 때문에 파일을 다운로드하거나 편집기에 복사하거나 적당히 로컬로 가져가세요.

각본

// Photoshopの画像アセット生成用に、Mac OSXアプリ用のアイコンをレイヤーに自動複製してくれるスクリプト v1.0
// author trpla226 2020/12/7
// Adobe Photoshop 2021で動作確認

(function () {
// 初期化・参照キャッシュ
var document = app.activeDocument
var layer = document.activeLayer

// 設定
var ext = ".png"
var baseResolutions = [16, 32, 128, 256, 512]
var multipliers = [1,2,3]

var baseName = layer.name

alert("現在選択中のレイヤー「" + layer.name + "」を複製して画像アセット用のレイヤーを作成します。");

for(resolutionIndex in baseResolutions) {
    for(multiplierIndex in multipliers) {
        duplicateLayer(baseName, layer, baseResolutions[resolutionIndex], multipliers[multiplierIndex])
    }
}

// 関数定義
function duplicateLayer(baseName, layer, baseResolution, multiplier) {
    var newLayer = layer.duplicate(layer, ElementPlacement.PLACEAFTER);
    var res = baseResolution * multiplier
    var m = multiplier === 1 ? "" : "@"+multiplier
    newLayer.name = res + " x " + res + " " + baseName + baseResolution + m + "x" + ext 
    return newLayer
}

})()

사용법

다음은 창고 README에 대한 설명입니다. 참조하십시오.
https://github.com/trpla226/layercopier