Okay, for whatever reason you want to take a bunch of screenshots all of the exact same dimensions. 

In my case, it was because I wanted to have an image carousel of some “key features” of this open source software project I’m contributing to called Arvados.

mmm, such bouncing on the image carousel. :/

Well, it’d be nice to visually select what area to screenshot, while keeping the dimensions constant. The default Gnome / Ubuntu screenshot tool, while versatile, does not enable this.

quick tangent: screencast gif

how did I make that gif? very fast:

https://gist.github.com/paulirish/b6cf161009af0708315c

sudo add-apt-repository -y ppa:fossfreedom/byzanzs
udo apt-get update
sudo apt-get install -y byzanz
byzanz-record --duration=5 --x=318 --y=205 --width=650 --height=450 filename.gif

drag-and-drop into gfycat, done. (ubuntu 14.04)

I wish this byzanz thing had a visual interface to select the area you want to screencast, but failing that, you can use shutter to pick out the start x, y coordinates as well as the width and height by using shutter’s visual interface:

back to screenshots: taking them properly the first time

Alright, let’s fix this bouncing-image-size problem.

$ sudo apt-get install shutter

Then, simply go to Edit > Preferences > Advanced and enter the size of the screenshots you want to take. As to how to find the appropriate x, y pixels, I trial-error’d it / used shutter’s interface itself (as shown above, where it shows you the x,y coordinates of your mouse) in order to find the correct starting point. I believe it marks the top left edge of the selection box, with the origin starting at the top left of the monitor, but who knows.

Image 2

Voila, as shown in Image 1 above, when you hit “selection” it auto-starts the rectangle selection box at the correct place and with the correct dimensions. You can click-drag the box around to fine-tune the placement. Sadly, you can’t “click under” the selection box to interact with the window below, so if you need to adjust anything, “esc” key out of the selection interface.

Done!

but what about re-cropping a ton of images

There’s easy was to automatically resize images down to a certain size, but I wanted to do more of a manual re-cropping process, since most of the images were “pretty-close” to the correct size. I found a decently streamlined way to do this.

I settled on using GIMP. First, start GIMP. ( optional: make a first layer bigger than all pictures). Then, File > Open as Layers… and select all the images you want to crop.

Then, edit the crop tool options. Fixed “Size”, Current layer only, Allow growing. Click-drag-release, you’ll get a selection box you can move around or even off the page.

 

Crop as desired. Pro-tip: You can shift-click the “eye” column to view a single layer. Make sure to also click on that layer, or else  you’ll crop the active layer which is not visible.

$ gimp --new-instance

then drag-and-drop each layer into the main window of the new GIMP instance, which will auto-create a new image. Right-click > Remove alpha channel if you want to fill transparent spaces with white. Then,

Ctrl-E (export), select the file you wish to replace, enter-enter-enter (accept default PNG options), ctrl-w (close image), ctrl-d (confirm closing image).

Drag the next image over, rinse and repeat.

tangent

there was a sweet “export layers as individual images” python plugin, and it seemed like all you need to do was download the zip, copy the folder  and .py script inside to ~/gimp-2.9/plugins, and restart GIMP. Unfortunately I could not get it to work.

Failed to execute child process "/home/nrw/.gimp-2.8/plug-ins/export_layers" (Permission denied)

Oh well. As described above, I found a workaround. Slightly more tedious, but fine for the two dozen images I had.

tangent: sweet bash one-liner: list image sizes in directory

say you want to quickly check how many different file sizes you have in a directory

$ identify -format "%f: %wx%h\n" *.jpg *.gif *.png | cut -d: -f2 | sort -u | sed 's/x/\t/g'

You need imagemagick and sed installed. Thanks to stackoverflow for the identify line.

This outputs a width, height tab-delimited list of filesizes in the current directory (I’m trying to see how many different sizes of images I have in my directory)

   909    503
 924    503

notes

Example output, first part:

jobs8.png: 909x503
jobs.png: 909x503
lobstr.png: 924x503

Second part, cut out filename:

 909x503
 909x503
 924x503

Remove duplicates:

 909x503
 924x503

Make pretty with tabs:

 909    503
 924    503

or use gThumb

gThumb quickly shows you in a GUI the sizes of your images

 

(no, I don’t know why all my GUI buttons are on the top of my windows :/ it’s really disorienting to hit “cancel” on your titlebar…)

btw, failed methods

Alt-printscreen (screenshot of active window) to take a screenshot of a firefox window tiled using cinnamon’s window tiling features, so theoretically always of the same size (1/4 of the screen) as long as I’m using the same monitor. But I didn’t want to keep cropping the firefox tabs and stuff out of the picture.

FireShot: I used these for the original screenshots. But the screenshots vary in size depending on whether there are horizontal scrollbars / vertical scrollbars present, which led me to my bouncing-carousel predicament when I thought all the pictures were the same size. A pretty sweet tool, though.