The All-Powerful Sketch
Looking back on the last decade of screen UI design tooling, it sort of feels like this is how it went: Adobe rules over this kingdom with Photoshop and Illustrator, along comes Sketch, Sketch takes massive bite out of the market and designers rejoice.
I actually have no idea what the market share is like these days, and I suspect Adobe is doing just fine, but it does seem like of all the alternative design tools, Sketch is the biggest and most widely beloved. On macOS anyway, as Sketch isn’t available on any other platform.
These days, the design tooling landscape is blowing up! Affinity makes incredibly powerful desktop and iPad design tools. Figma brings modern web app sensibilities to the fold. Framer makes interaction design a first class citizen. Adobe is rethinking their approach with XD (hey maybe they’ll bring back Fireworks trollololol). Webflow makes responsive design just come along for the ride. Even InVision is stepping into the spotlight with Studio.
Will any of these newer become as popular and beloved as Sketch? Hard to say, of course. Let’s take a look at all the awesome stuff Sketch can do and maybe that’ll give all this some perspective.
Sketch is for screens
At the highest level, I’m sure the reason Sketch resonated so strongly with screen designers is that it’s whole tooling set seems to be based around that. Right down to the concept of Artboards. A single Sketch document can have as many Artboards as you like, encouraging designing for multiple screen sizes at once.
Not only can it handle multiple artboards, but it handles them very smoothly. If you have a project that needs dozens of them, Sketch will handle it smoothly, where a top criticism of Adobe tools is they start to get slow and unwieldy with more than a handful. And speaking of speed, Sketch opens rather instantly, which feels quite refreshing after the ~30 second app startup time we’re used to with Adobe products.
Sketch is great for building design systems
You might even argue that building systems is what Sketch is for. Look at that beautiful and emphasized Create Symbol button in the top bar.
Anything can easily be converted to a Symbol in Sketch. Make a button? It really makes sense to convert that into a symbol. Then you can re-use it over and over, like a front-end developer will do anyway with that button! And you aren’t locked into that symbol being 100% the same with every use. Buttons are a great example of that, where you might want to repeat the button style, but change the text within. Sketch makes that easy with Overrides. Plus, Symbols can be nested, allowing all kinds of elaborate design power. Not to mention global “Libraries” of symbols, so that Symbols need not be locked to an individual document.
Wanna learn more about Sketch and building design systems?
Sketch works with InVision
InVision is launching the own design tool, but it’s mostly known for being a tool that adds interaction and collaboration on top of your own design tools. Notably Photoshop and Sketch documents!
Beyond that, one of the things I’ve witnesses designers get the most passionate about is InVision’s Craft. It’s worth watching the video to understand it:
In a nutshell, it allows you to pull in real assets to design with. Imagine being able to pull in example data like names, usernames, and avatars with just drag and drop. Or content from live websites. Or stock photography. Or any API!
And that’s just part of what Craft does. It’s also a cloud-synced resource library, so everyone on a team has access to the same parts of a style guide. It literally even builds a style guide for you from those assets.
Sketch has an open file format
Earlier this year, without a ton of fan fare, Sketch revised their file format to be JSON format. Or Arbel has a great article called Everything you need to know about the Sketch 43 file format to catch you up. Having an open format for how you save files open it up for all kinds of interesting integrations. It’s like building a really low level totally open API.
The full potential of this surely hasn’t been quite realized, but there has been some quite a few powerful things as a result of it already:
Sketch has a command line
Well, not built in, but you can add on in the form of Runner. This is another thing I’ve seen designers be ecstatic about. Here’s a video intro:
Robin Rendle described it this way:
Runner is a plugin for the design tool Sketch. It lets you use your keyboard to run commands and order about other plugins. For example, by typing “vertical” into Runner then you can vertically align text much faster than moving your mouse to the button and clicking it.
I’ve seen some folks describe Runner as if it’s Sketch’s version of Spotlight or Alfred, as effectively their goals are one and the same: to speed up and organize your workflow.
Sketch does SVG well
Sketch even describes itself as a vector-based design tool. It feels that way. The vector editing tools you expect to be there are there (e.g. the pen tool) and the raster editing stuff isn’t (e.g. photo retouching tools).
I find the SVG exported from Sketch largely fine, but it’s pretty cool to see the team behind Sketch itself release plugins like svgo-compressor, which compresses SVG upon export without you doing any extra work at all.
Sketch has resources up the wazoo
There are so many it’s hard to make a decent list. Perhaps suffice it to say that major design resource retailers have categories for Sketch templates, like Envato and Creative Market.
When big design teams like Facebook see fit to drop a “Template of UI Elements Found in macOS” they do it as a Sketch template.
If you’re looking to browse around for more Sketch resources, check out Sketch for Designers.
Sketch is priced right
It’s $99, then you own it. If you want updates, you pony up $99 the next year. I think both the price point and the update model feels good to folks.
This ain’t the half of it
When asking around about what people like about Sketch, everybody seems to have a different answer.
What’s your favorite thing about Sketch?
