Sketch Plugin Developer: Jason Burns

It’s always impressive when you find that one “must-have” plugin that gets daily or weekly use in your workflow. It’s even more impressive when the same developer is responsible for multiple essential plugins.

I’ve come to rely on the full set of plugins created by Jason Burns. The plugins Symbol Organizer and Symbol Instance Renamer are the top two that I use daily. Check out his entire suite of Sketch app plugins:

Plugins by Jason Burns

Sketch Library Thumbnail Preview Icon Template Freebie

Ever since Sketch Libraries were released in version 47, many people have been asking how to create a custom thumbnail preview that appears in the Preferences panel for their own Sketch Library files.

I’ve created a ‘template’ Sketch file that has the preview artboard already setup so you can quickly get started creating your own preview design. The free download also includes instructions on how to include the preview in your library file.

This template was inspired in part by Stewart Curry’s article “Customising the Sketch Library Preview Image — beta”. One key difference of this template, relative to the article, is that I’ve used an artboard that is @2x the preview size. This appeared to create better image quality on retina displays than a proportionally larger design & has the advantage of being easier to preview at 50% (target size).

Grab the file from github and use the issues tab to report any problems or feature requests.

Things to Consider Before Updating to the Latest Version of Sketch app

Updated October 3, 2017

Sketch app is a great tool and has become the primary design environment for many professionals. However, like all software it is vulnerable to having bugs whenever there’s a major release. On top of that, the various 3rd party plugins may also become unstable or broken when major updates initially arrive.

Here are some suggestions that will hopefully make each Sketch app update a smooth one.

In North America, there’s a famous fire safety campaign called “Stop, drop and roll“. In that spirit, this guide is structured with the derivative and less memorable theme of “Stop & Think, Initiate Backup Plan, Proceed” (aka STIBPP, just kidding).

Stop & Think

Take stock of what you are currently working on. Are you in the middle of any important client projects? Are you about to reach a major milestone? Is your workflow currently reliant on one or more “must have” 3rd party Sketch plugins? Does your version of macOS meet the current system requirements of the latest version?

Imagine a scenario where there is a bug in the software, a change in the implementation of a feature, or an incompatible Plugin you rely on. Could you afford the extra time and stress of mitigating this based on your current workload? If your answer is no, then you should either hold off on updating or consider some of the next steps.

Initiate Backup Plan

You should be backing up your important files. All of them, not just Sketch files. Never work on a project file in a brand new version of Sketch (or any other app for that matter), before making a backup of the last state of the file that was worked on in the now-previous version of the app.

In addition, frequently saving Sketch files on a service such as Dropbox, or one of the recent Git-style version control services for Sketch now on the scene, can be very helpful way to retrieve past versions if things go wrong. This is even more critical if you have turned off Auto-save.

Sketch files are not always backward compatible. It depends on the version of Sketch that was used to create or last modify the file. Don’t assume that any work you make in the brand new version will result in a file you could later open with a past version of the app. Consider the impact of losing recent changes, if you wind up having to roll back to a past version of a file.

If you have covered your bases using the steps above, you will have the option of using a previous version of Sketch even after you updated to the current release.

You can have multiple copies of Sketch app on your Mac. If you upgrade to the latest version, but also want to have a past version, simply Download a past version of Sketch and place it in a Folder within your Applications, or elsewhere on your drive. You will have to be very aware of which version you have open, as double clicking a Sketch file will always open the most recent version of the app.

Proceed

OK, you’ve taken some steps to protect yourself from the unknown. If you think it’s time, go for it. Update and enjoy the latest version of Sketch!

 

A Roundup of Sketch Libraries Articles & Videos

Updated 12/02/17

Sketch 47 with Libraries Has Been Released!


After many months of rumors and hints, Sketch Libraries are close to public release and available for testing with version 47 Beta.

This feature is really going to be a game changer for design teams of all sizes and configurations. I could go on and summarize the general features here, but some other folks have already done a great job at that. Here’s a roundup or recent articles and videos.

Articles

Videos

Sketch Libraries from Beta 47 from Pablo Stanley’s Sketch Together

Everything about Sketch Libraries by KVN

SketchCasts Free Video Overview of Sketch Libraries

P.S. Thanks to everyone on Twitter who shared links for this roundup! If I missed anything, let me know.

Comparing Two Raster Image Compression Plugins for Sketch App

Back in the early days, a Sketch designer typically had to export uncompressed PNG or JPG images from Sketch and then choose a means for compressing those files (if desired) using a 3rd party utility. This approach can add to the cumulative production time spent by a designer, particularly if you have lots of images or tend to iteratively revise those images.

These standalone utilities have included Mac apps and web services like ImageOptim, TinyPNG and at the enterprise level Kraken.io.

About a year ago, Bohemian Coding released two important Sketch plugins that allowed for compression to be applied to both Raster and SVG images upon export – no additional workflow steps required! These were Sketch (Raster) Image Compressor Plugin and SVGO Compressor Plugin.

Well, it’s summer of 2017 and a new ImageOptim Plugin is available. This gives users a new option for automatic PNG and JPG compression upon image export from Sketch.

Sketch plugins for automatic raster image compression

It’s Not Just About Compression

There are too many variables to allow for an easy one-size-fits all test to declare a winner between theses two raster compression plugins. So instead, here are some highlights of each. Trying them both with your own designs, and see which combination of workflow and compression results suit your working style.

Regardless of which one you choose, it’s a useful practice to compress your exported raster files somehow.

Sketch Image Compressor Plugin

Using the Sketch Image Compressor Plugin is definitely a more seamless experience. Once installed, it offers an option that requires no special action (i.e. it just works when exporting vs requiring you to trigger it from the /Plugins menu). It applies “Quick Compression” when you export one or more assets using the export button in the lower right of the Sketch UI. This option lives up to its name, and quickly produces noticeably compressed images.

If you want to get the smallest possible file size from this plugin or “Full Compression” (aka slower process), that does require you to choose Plugins › Sketch Image Compressor › Export.

Because of these two options, and the fact that it only requires a plugin and no other installed application, this is probably the simplest and easiest option for everyday use.

ImageOptim Plugin

If you are already a fan of the ImageOptim Mac app, then this plugin will make you very happy. The plugin requires that you have the Mac app installed. However, it saves you lots of time by integrating with Sketch and sending assets directly into the ImageOptim Mac app (no need to export files to your drive and then manually run them thru the app).

The plugin will open ImageOptim automatically when you export individually selected assets. You can also export all assets via the Plugins menu. There’s no concept of ‘Quick’ or ‘Full’ compression within the plugin itself, because you must configure the supporting ImageOptim Mac app with your desired compression settings (set and forget or fine tune each time). Depending on how you configure the app, your compression speed and file sizes will vary. If you invest the time in understanding the app, it seems likely that you could squeeze out smaller file sizes than what Sketch’s plugin produces.

Overall the process can feel less streamlined and slower, because it involves launching the ImageOptim Mac app do it’s job.

ImageOptim isn’t just about optimization, it’s about options. If you really want complete control over your compression settings and results, then you may prefer using the ImageOptim plugin – despite the additional steps in the overall UX.

The Future?

Seeing as Bohemian Coding’s plugin is still marked BETA perhaps they’ll just bake compression options right into a future version of Sketch, ahem.