The Magic Folder

The following tutorial is for Mac computers

It’s a simple folder action. To get it you just a little bit of terminal skills. Ask your coder friend if you’re entering unchartered waters.

Install npm

Tutorial on e.g. teamtreehouse.com

Install SVGO

Type this in your terminal

sudo npm install -g svgo

Create a folder

I’ve called mine SVGO and put it inside my home directory but anything goes.

Add the folder action

Open Automator.app on your mac and create a new folder action. Choose your SVGO folder. Then drag “Run AppleScript” into the flow and replace the example code with the following:

Save

That’s basically it. Now whenever you add a .svg file to your SVGO folder it get’s optimised automagically.

If the end result is too distorted you will have to increase the size of your drawing prior to exporting it. So if your viewbox is e.g. 48x48 then try to increase it to 480x480 as in the example above.

The distorting occurs because we round all values to integers. That rounding will be relatively bigger the lower the resolution the canvas has.