iPad Pro Screenshot Frames Workflow

Showcase your iPad Pro screenshots in a device frame using Workflow on iOS

workflowheader.png

In my quest to learn and do useful things with Workflow (soon to be Shortcuts), I’ve been looking to solve a concrete problem: making device frames for the iPad Pro.

There have been a few takes on solving this problem already, most notably Jordan Merrick’s excellent multi-device workflow, but I wanted something that worked with both iPad Pro sizes and didn’t rely on external files (Jordan’s grabs the blank device frames from a web URL and unpacks them on its first run—more on this at the end).

Enter Frameshot X.

Image.png

Frameshot offers a perfect solution, but Marcin Chrobak’s original only offers iPhone X support. I’ve taken the liberty of expanding on Marcin’s efforts by creating two parallel workflows: one for the iPad Pro 10.5”, and one for the iPad Pro 12.9”:

iPad Pro 10.5” Frames
iPad Pro 12.9” Frames

Like the original Frameshot X, these two workflows will prompt you to select a device colour, then one or more screenshots. It automatically detects screenshot orientation and turns the device frame accordingly. You’ll be shown a preview and then asked if you want to save or resize the resulting image.

These workflows dramatically simplify the process of preparing images for articles. Now I can just collect the screenshots and run them through the appropriate workflow in a batch, and I’m done in a fraction of the time. It’s a fun example of where iOS is faster than a desktop environment. Rather than opening a graphics program, opening a device frame mock-up, then placing each screenshot and saving out the result, Workflow lets me accomplish the same task in a few taps.

iVBORw0KGgoAAAANSUhEUgAACO4AAAxgCAYAAABnN8W7AAABS2lUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJl-2.png

For Workflow geeks, the reason I preferred Marcin’s approach is because he’s come up with a way to include images in a workflow despite not being allowed to embed files.

His method is clever: instead of requiring a download of files from a server, it “embeds” the blank frame images by encoding the files as base64 strings and then using Workflow’s built-in base64 decode function to turn them back into image files during the workflow’s run.

This means the workflow is entirely self-contained, and will work offline right from the start.

In any event, I had a fun time figuring out how the original worked and then preparing the required device frames to make these two parallel versions.

I hope you find them as useful as I do!

 
13
Kudos
 
13
Kudos

Now read this

iPad Photography Workflows →

The iPad has been on my mind a lot lately. I bought my first in 2011, and it’s remarkable to see how far the device and my impressions of it have evolved over the years. In particular, the advent of the iPad Pro has accelerated a process... Continue →