I use Anki to study foreign language vocabulary. It’s the de facto spaced repetition software for memorization.^[Yes, I’m aware that others exist. I’ve tried many but always have come back to Anki.] When making flashcards for language learnings, I try to use imagery as much as possible. So a card may have a Russian word on one side and just an image on the opposite side. (Since I already know the English word that the image represents, why not try to engage a different part of the brain to help with memorization?)

If you use Anki on multiple devices, then synchronization is a key step. However, image size becomes a limiting factor for sync speed. Since only a small image is often necessary to convey the intended meaning, we can improve the sync efficiency by using them while not sacrificing any meaning. Bulk, efficient resizing of images for Anki cards is an important part of the process for me.

Here I’ll describe a process of automatically processing images for use on Anki cards using Hazel and ImageMagick. Sorry, PC and Linux users, this is OS X only.

Hazel

Hazel is an indispensable tool for OS X automation. It’s a little hard to describe all of the things that it can do, but suffice it to say that it is a background application that watches folders and then performs rules on the contents of those folders. You will need to buy it for this process to work.

ImageMagick

ImageMagick is a well-known Swiss army knife of image process. You will need to install it which you can do using Homebrew or this installer

The process

I created two directories on the Desktop: ankibound and ankidone. Incoming images go into ankibound. The rule we create in Hazel will watch ankibound, convert the image to a smaller size, adjust the quality slightly, strip the unused metadata and move the processed file to ankidone.

Hazel rule to process incoming images

If you are not familiar with creating Hazel rules, you first add the folder to be watched (ankibound) and add a new rules which we’ve cleverly named “Resize images for Anki.” Then we just need to add the criteria and the steps for the rule.

We’ve specified the type of file to be processed inside of ankibound and added two actions:

• resize incoming images using ImageMagick on the command line, and
• move the processed images to ankidone.

The code for image scaling is simple, it’s just:

/usr/local/bin/convert "$1" -adaptive-resize 150x150 -quality 80\
 -density 72 -strip "$1"

Now, any image that you save to ankibound will get resized to 150px in its largest dimension and moved to ankidone, ready to import into your Anki cards. Of course, you could also use the ImageResizer add-on for Anki but I like being in control of my own process and being able to deal with images without having to get them onto the clipboard. Either way works.

References

• Automatic image resize and ftp upload with Hazel 3.1 - original inspiration for the methodology
• ImageMagick home page
• Adjusting size, resolution and quality using ImageMagick
• Using -strip option in ImageMagick to remove metadata
• Hazel - directory automation for OS X
• Possible alternative to ImageMagick - you could use sips on OS X in place of ImageMagick. It should work, but I haven’t tried it. From a brief glance, it doesn’t seem to support everything we are doing with ImageMagick, but I could be wrong.
• sips man page - this is the man(1) page for sips(1) on OS X.
• Anki ImageResizer add-on - another alternative leveraging the Anki plugin architecture

Hexo, the static blogging system that I use is very extensible and provides numerous hooks into generation pipeline.

While working on a Russian language blog that’s coming online soon, I had the opportunity to write a filter to render Cyrillic text in a different font than the rest of the body text.

I wanted to set the Cyrillic text apart both in color, typeface, and font weight. Although I could have extended Hexo using a new tag, I decided to use a filter so that after rendering HTML anywhere on the blog, items demarcated by double pipes || would be replaced by a new <span>.

I used an npm module to deploy the filter. You can find it on the npm and at its GitHub repo

Here’s the very short code for the filter itself:

hexo.extend.filter.register('after_render:html', function(str,data) {
    var re = /(\|{2}?)((.|\n)+?)(\|{2}?)/gm;
    var result = str.replace(re,'<span class="rsb">$2</span>');
    return result;
});

The regex in the second line just identifies a block of text fenced by double pipes and replaces it with a span with the class that specifies the styling to be applied. In the future, I’d like to identify Cyrillic text with a regex and not have to use a fence at all.