development process for inkatlas-utils

notes.md

Development process for inkatlas-utils

Create Adobe project

When developping with inkatlas-utils, you first have to create an Adobe Project with a Photoshop Plugin from Adobe Console.

Build plugin

Then, run npm run build from local inkatlas repo.

⚠️ DO NOT FORGET to edit dist/manifest.json to set its id to the Plugin id of your project. Also edit the manifest name to create a unique name.

⚠️ Be careful that manifest is overriden on each build, so you might want to stash the changes to be able to re-apply them quickly after each build.

Load Plugin

Open your Adobe UXP Developer Tool and Create Plugin: fill-in the same infos as for previous steps.

Once done, click on Actions then Load.

Your plugin is now ready for test in Photoshop!

plugin.md

Plugin personal notes

The following are personal notes that can be useful to you or not. They are mostly a reminder to myself.

Atlas generation

I also suggest editing atlas.js:

function generateAtlasMappings(activeDoc) {
  const allLayers = activeDoc.layers;
  return allLayers
    // add additional filter condition on 'locked'
    .filter((layer) => layer.name !== "Background" && !layer.locked)
    .map((layer) => generateAtlasMappingForLayer(activeDoc, layer));
}

By filtering locked layers out, you can have locked layers for icon graphics while also have identically named layers as placeholders: to make sure e.g. that the final icon will always make 64x64px, no matter if its graphics are smaller.

Export as TGA

There's usually no need to show "Background" layer in export.js, before save as targaFormat action:

{
  // set to "hide"
  _obj: "hide",
  null: [
    {
      _name: "Background",
      _ref: "layer",
    },
  ],
},