Sketch is a vector-based digital design app for Mac, focused entirely on user interface design. Simple and easy to use, you can train up in Sketch quickly and utilise a tool that’s a fraction of the cost of Photoshop. And the best part? You can try for free before you buy it.
Are you completely new to Sketch? Or like many designers, are you already using Sketch, but need some extra tricks of the trade? Academy Xi is offering a series of Sketch Workshops, starting with Sketch Series #1: Pre-prototyping to Wireframing and Flows. With 3 workshops in the series, you can graduate to interactive prototyping, and iterative workflow techniques to develop your skills.
In the meantime, here are a few tips that have helped create our designs efficiently, and we want to share the love. Try them yourself, or bookmark them to use later after you’ve finished an Academy Xi Sketch workshop!
The Craft plugin by InVision is by far one of the best plugins you can use with Sketch. It can duplicate content on your artboards, and provide content, images and custom code to be used with your designs.
It’s very easy to use and has recently been updated to include prototyping within Sketch for click-through prototypes and syncing with InVision. Check it out!
We cannot stress enough how important it is to keep everything in unison and Sketch has an answer for that: SYMBOLS! Just like design masters with fixed elements that don’t change, you can create a master symbol and ensure it’s consistent across your artboards. What if you want to change the text of your button on one artboard but not globally? No problem: just create an override!
(Pro tip: If duplicating a symbol, you can group different colours of your symbol together — for example: button/red, button/blue, etc.)
Drag and drop is easy but first you need to locate the specific layer. Instead of finding the layer you need (those things play hide and seek easily), you can use the keyboard shortcuts below to easily control your layers and have them display exactly how you want them to.
Control your layers (like mind-control, but easier)
Command + Option + Up arrow
Command + Option + Down arrow
Move to Front Command + Option + Control + Up arrow
Move to Back Command + Option + Control + Down arrow
Something that saves a lot of manual effort is hotkeys. In order to utilise this timesaving hack, you can use the keyboard shortcuts below to easily replicate a style across other styles.
Command + Option + C
Command + Option + V
At the push of a few button(s) with an object selected, you can resize it. BOOM!
Increase: Hold Cmd + Down arrow
Decrease: Hold Cmd + Up arrow
When re-arranging objects, ever wondered exactly how far away an object is? Press and hold alt when you’ve selected an object and simply hover over other objects to know the distance from your selected object.
Customising the Sketch toolbar is necessary for both personalisation and efficiency. You can add, remove, and move around the items on your toolbar. Here are some options you can choose from:
Try out these tips in your own Sketch adventures, and let us know what other cool Sketch hacks you come up with!
You can learn how to use Sketch and develop other skills in your toolkit through our UX UI Design course.