Export Sketch dashboard to PNG…use as smart object in Photoshop

Question

I'm creating iPhone app mockups in Sketch 3, and exporting them to PNG. I like showing them to clients in a realistic iPhone 6 mockup/photo.

Ideally, I would like every time I export my artboard from Sketch that it auto updates my smart object in my Photoshop mockup. It doesn't seem to be working, because each time I export from Sketch, it's essentially overwriting the same PNG file (filename stays the same) that's being referenced in Photoshop.

In mockups where I'm always directly editing the same PNG and re-saving it (not overwriting it), it will ask me if I want to "Update Layers" in Photoshop...essentially saying that it sees that I've made changes.

Is there a way to accomplish what I'm trying to do?

Answer 1

Great question. I’ve done some testing and found a way to get it working.

1. Export all your PNGs from Sketch.
2. Open your master layout Photoshop document (or mockup for clients etc).
3. Use File → Place Linked for each PNG file.

If you overwrite your PNGs, they will now magically update in Photoshop. If they don’t, you can use Layer → Smart Objects → Update All Modified Content.

The Photoshop document will have to be open and Photoshop will have to be in focus for the PNG to update.

The important part here is that Photoshop can use any kind of linked file, not just Linked Smart Objects (my initial reaction was to try to convert the PNGs to PSDs somehow).

Edit: Maybe I misread the question a bit. Hopefully Update All Modified Content helps though? At the very least, that will update all PNGs with one command.