Become a Sketch Guru in 3 Easy Steps

Do you know what is really, really comfortable?

Your comfort zone – and we all have one.

Each of us has those four or five applications that we could almost use in our sleep. Those hundreds of hours of muscle memory, shortcuts and familiar quirks that make these apps feel like a cozy, old armchair. They also make switching to a new app feel so... clunky – at least for the first few weeks.

We all want to jump to that productive, intermediate level as quickly as possible.

So, today we're here to fast-forward your Sketch App skills by giving 3 tips normally only seen amongst the more experienced Sketch gurus.

Tip #1: Be a keyboard shortcut ninja

Sketch’s keyboard shortcuts are as minimal as can be. Most of the time it’ll be command + something and sometimes it’ll be a singular-lettered key such as “A” for Artboard, but there’s one thing for sure and it’s that you’ll never have to engage in a game of finger-twister when designing in Sketch App.

Some of the shortcuts are fairly obvious or they’re exactly the same as the Photoshop shortcut, so for that reason some of them have been omitted - these are the most useful ones.

Single-key shortcuts

• A: Artboard
• T: Text
• V: Vector
• O: Oval
• R: Rectangle
• U: Rounded Rectangle

Multi-key shortcuts

• Z + click/drag-select: zooms into a specific region
• Enter: enables edit-mode for the layer currently selected
• Shift + Tab: reverse-cycles through layers (opposite of “tab”)
• Option + drag layer: duplicates a layer and moves it
• Option + hover layer: shows the distance between two layers
• Command + click: select layers inside groups
• Command + R: rename artboards and layers
• Command + Shift + H: Show/hide layers
• Command + directional arrow: Resize
• Command + Shift + E: Activates export mode
• Command + Option + C: Copy layer style
• Command + Option + V: Paste layer style

It’s not for me to say which shortcuts are the most important, because that really depends on your screen resolution and the type of work that you create, but if you’re interested to explore many more keyboard shortcuts, Jean-Marc Denis has curated a complete Sketch App keyboard shortcut list.

Tip #2: Organise pages and artboards carefully

If you’re using Sketch App to design user interfaces then it’s quite likely that you’ll be mocking up multiple versions of the same screen either to explain user interactions or to demonstrate mobile-optimisation. You could easily end up with anything between 2 and 10 artboards for each screen, depending on the amount of dynamic content that screen has.

When you create a new artboard (CMD + A, if you forgot) it will appear directly to the right of the last artboard that was created (even if it was moved); so essentially, they form in a row about 100px apart. You might not necessarily desire the artboards to be in that order, but like any other type of selection they can be moved on the X and Y axis.

A neat way to organise your screens is to display them from left-to-right/desktop-to-mobile (or the other way around if your approach is mobile-first!) and have each screen variation on a new line. What you should end up with is a highly organised horizontal and vertical display of artboards for each screen.

When you need to design an entirely new webpage you can create a new page in Sketch App, which can be done in the layers sidebar by clicking the “+” icon. You might find it especially time-saving by right-clicking and selecting “Duplicate Page”, allowing you to duplicate all of your artboard sizes and common elements. After than, simply delete what you don’t need.

Continue reading %Become a Sketch Guru in 3 Easy Steps%

by Daniel Schwarz via SitePoint