Getting the Best from Sketch
Sketch is a great piece of UI design software, it’s enormous success proves it. There is however, much more power under-the-hood than you may initially see. When discovering these features, you’ll soon realize just how astonishingly powerful Sketch can be. Here, I’d like to share a few tips and tricks I’ve picked up along the way, to get the best from Sketch.
Customize the Application
Most people don’t actually realize that you can customize a handful of Sketch’s features out-of-the-box. This can be very handy, especially for different users such as designers and dev’s who’ll require specific tools to work with.
Rebuild the Toolbar
Navigating through Sketch is simple as hell, however, you can still customize a few bits and adapt it to your own needs. Secondary click on the top bar, click on “Customize Toolbar” and drag-and-drop tools as you need them.
Shortcuts FOR THE WIN!
I’ve never truly understood people who don’t use shortcuts, they’re one of the most powerful features in any software, Sketch included. Some tasks which may take a few seconds can be executed instantaneously, simply by remembering a few key presses.
Whilst learning, these may initially seem to take longer, but as you begin to use them, you’ll soon notice the significant speed improvement and benefits. Here is a list of some of the handiest shortcuts:
Add Artboard A Create line L Create ellipse O Create rectangle R Create a rounded rectangle U Switch to pen tool P Slice item S Duplicate item cmd + D Rename layer cmd + R Group selected items cmd + G
Furthermore, there are special shortcuts such as “duplicate last copy”. First drag-and-drop any layer holding “alt”, this will create a copy at your desired position, if you left a 20px margin from the top object, next time just hit “cmd + D” and it will create a new item 20px away from the last one. Awesome for creating lists or grids!
Saving Time with Plugins
If I needed to narrow down Sketch’s best features to just one, it would have to be plugins. Plugins allow you extend the software’s capabilities beyond imaginable limits.
Don’t be afraid! You don’t need to know how to code (unless you want to develop your own ones), luckily there’s a whole group of enthusiasts creating some amazing plugins that will increase your productivity with Sketch and even ease some of the most common processes while designing.
There are many different categories of plugins. Some add missing features to Sketch that might aid your needs, others may boost your performance by adding new interactive methods.
These are some of the plugins I frequently use on a day-to-day basis:
- Sketch Toolbox: The main plugin source, a third-party app which enables you to download/install/update plugins by cloning them directly from GitHub (where most of them are located).
- Craft by InVision LABS: Not just a tool for uploading your own designs directly to InVision, but also to boost performance by adding a handful features such as “content generation” or “documentation”. This tool is also great as it allows you to sync .sketch files for use with InVision’s new “Inspect” feature ;)
- Sketch Runner: Can you imagine having a Spotlight-style search feature right inside the app? Or run any command by typing it? Well, now you can!
- Font Finder: When working with templates, you may end up adding undesired fonts to your document. Using this plugin, you can quickly discover which fonts you’re using and replace them with your own selection.
Often, third party services such as prototyping tools develop their own Sketch plugins allowing you to directly sync from the app itself instead of having to export the render and manually upload them.
Symbols Are Your Best Friends!
When symbols first appeared in Sketch, you could just copy the whole structure of an item and repeat it through your design like a common component, it was however, quite limited until now. A recent update has given symbols a boost adding “Overrides”, an AWESOME feature you should be using right away!
Imagine you need a list of items, each one might contain different information but the overall content is the same. Let’s start by creating the shape as you usually would. Put everything inside a folder with a component name.
In my example above, I have a user avatar, some text fields and a line which acts as a separator, all within a folder I’ve called “List item”. Next, let’s convert it into a symbol. Secondary click over the main folder and click on “Create Symbol”, give it a name and click “OK”.
It’s now a symbol and you’ll see it turn into a single layer (similar to how smart objects work in Photoshop). By double clicking the item, or the layer, you’ll see a page called “Symbols” where all are available for modifications.
To take advantage of this feature, duplicate the symbol you’ve just created a few times, select one and you’ll see a panel appear on the right-hand side called Overrides. Here, any text or images can be swapped, for this copy only. It’s really one of the best Sketch additions.
Always Keep Exploring
Installing a ton of plugins or having lots of shortcuts isn’t the path to improving performance, but choosing the ones you actually use on a daily basis, noticeably will. At the beginning you’ll probably have to spend some time getting used to these plugins, however, eventually, it will become a natural way of working and will definitely decrease the amount of time needed to perform common tasks.
Most plugins have been created by individuals and are not supported directly by Sketch. This means they may eventually stop offering updates or support. Some have unfortunately faded away, but there are new plugins released each and every day. I recommend keeping an eye on the sites below to get the latest plugins.
Do you work with Sketch? Do you have any doubts or any new tips you’d like to share with us? Don’t be shy and leave a comment below!
If you enjoyed this post, visit our blog for more.
