My Sketch Stack

Stu Smith
4 min readJul 7, 2017

--

Recently, I was helping my wife with a problem she was having in Adobe Illustrator and I had the sudden realization that I’ve been using these apps for half of my life. Fifteen stinking years! I remember right where it all started too: my sophomore Year Book class. It was just me, Illustrator 10, a Power Mac G4, and a ton of teenage angst. I still love my Adobe apps after all of these years and I’m amazed at the staying power of the entire Creative Suite. After all these years, they feel like home in many ways.

But, if you’ve read the title of this post, you know I want to talk about Sketch. Now, I’m definitely not one of those people that spends much time participating in the Sketch vs. PSD holy wars on Twitter. I think that whole thing is silly. What is true for me is that switching my interactive work to Sketch has dramatically changed my day to day productivity. I bit the bullet in November of 2015 and haven’t looked back since.

A System, not a Suite

Aside from being incredibly easy and intuitive to use, the big benefit for me is that you can build up your own Sketch instance with plugins and apps to be exactly what you need. Better still, this is how Sketch is made to work…not a hack. Every time I tried to trick out something in Adobe, it ended up biting me later on.

I feel like almost every week, I find something new that dramatically changes the way I work within Sketch. Sketch allows a designer to build their own design environment in a similar way to how an engineer builds their dev environment. Below are the things I’ve been using in conjunction with Sketch to build Cratejoy’s new design system. I really couldn’t imagine using Sketch without any one of these.

Abstract

Abstract is an amazing tool that allows me to keep track of each revision I make in my files. If you’re familiar with Git, it’s the same basic idea but built for designers. In the context of a larger team, Abstract helps by providing documentation for every update showing what was changed and by which designer. I find this particularly helpful for updates to my component library. The freedom to roll back to a previous version is fantastic.

Sign up for access to the public Alpha: abstractapp.com

Runner

Runner is my favorite timesaving Sketch plugin. By simply keying Command ‘, I’m able to launch Runner and do simple things like unlock all of my layers, jump to a different page or install plugins.

Sketchrunner.com

Brand.ai

Brand.ai, is the main place that I store and manage all brand elements (components, symbols, type and color) to be used across all of my files. This is an amazing time saver and also allows me to share this information with other people working on the same UI projects in real time.

brand.ai

Craft by Invision

I have been an Invision user since 2013, using the very earliest versions of their app. Invision has contributed so many ideas to the design community and Craft has been one of their most innovative. Craft lives in the sidebar of Sketch and has been steroids for my work.

I mainly use Craft to:

  • Generate randomized data (Names, Addresses, Cities)
  • Import holder photos (unsplash or uifaces mostly)
  • Import data from Cratejoy listings
  • Sync my prototypes directly to Invision (this has saved me hours of exports and uploads)

invision.com/craft

Zeplin

Zeplin is the main tool that helps me communicate the particulars of my design comps to one of my teammates on the engineering team. Confused about that hexadecimal color over there? Well.. Zeplin has that info right here for ya, bud.

Zeplin has been around for a big par of Sketch’s lifespan, but adopting this earlier this year has been a game-changer for collaboration.

zeplin.io

So what do you use to speed up your Sketch workflow? Shoot me a line or hit me up on Twitter. I’m all ears.

Huge shout out to other Sketch friends like Brendan Pittman and Andrew Jasso who have turned me on to many of these assists.

For bonus points, and really no point at all. Check out Looper.

--

--