Mobile app version of vmapp.org
Login or Join
Correia448

: Exporting multiple web design views or phone app views into phone wrappers? I am using Illustrator CC to design web sites and mobile apps. Each view is in its own artboard which means that

@Correia448

Posted in: #WebsiteDesign

I am using Illustrator CC to design web sites and mobile apps. Each view is in its own artboard which means that I get about 20 different artboards in the end. In photoshop I have a phone mockup file and I want each of the Illustrator artboards to be wrapped in that file.

I usually export a pdf with 20 pages from Illustrator and then wrap each page in Photoshop and export a jpg from there. This is a time consuming process and I wonder if there is any automatic way to do it?

What I want is to add a "frame" (a phone mockup) to each artboard in Illustrator when exporting it (and exporting all at once).

10.01% popularity Vote Up Vote Down


Login to follow query

More posts by @Correia448

1 Comments

Sorted by latest first Latest Oldest Best

 

@Turnbaugh909

The easiest to do this would be to export all the Views from Illustrator as individual images with a sequential numbering and common file name.

e.g.

View0001.png
View0002.png
View0003.png
.....
etc.


Importantly, all in a fresh new, and otherwise empty folder.

Then use the batch processing facilities and Action recording of Photoshop to load each of these and either wrap them or insert them into your Phone mockup file and export via the batching.

This will require you learn how to record Actions and use the batch processing features of Adobe Photoshop.



After Effects Alternative Approach (AEAA):

AE can export image and PSD sequences, and you could load in the Views as individual frames from that same folder, and this will free you from learning about Actions and Batch processing in Photoshop. But you will need to learn rudimentary file handling in AE in order to do this.

10% popularity Vote Up Vote Down


Back to top | Use Dark Theme