Out With the Old, in with the Sketch3

Initially, upon opening sketch, things were daunting and slightly scary… It’s a native Mac app so is utilitarian in appearance (beneficial in many ways) and just creating a mask for an image took much longer than it needed to, the same went for other simple things like finding out how to modify the radius of only one corner of a box.

For the first 30 or so minutes, I sucked. Rapidly getting frustrated because I didn’t know where things were, so nearly went back to my beloved Photoshop, but “sucking at something is the first step at becoming sorta good at something” (…yes, that is a quote from adventure time). So I stuck with it… and once you find your way around, it’s glorious!

Simple functionality such as Dynamic Properties allowing us to be pixel perfect in placing objects, creating text styles to use consistently throughout a project, accurate font rendering so we see exactly what the browser or app will display and let’s not forget that everything is vector so everything is scaled to the nearest pixel – no more pesky half pixels ruining designs!

Consistency seems to be the best thing about Sketch and with this in mind, one thing that is set to make our lives easier are the ‘Symbols’. In UI design, there are a lot of repeated design patterns such as buttons, navbars, pop-ups, links… all kinds of things really.

“Copying and pasting soon becomes unworkable for big documents, when you make a change and need it to be reflected across every repeat. Wouldn’t it be awesome if Sketch could do this automatically for you? With Sketch 3, it can.”
The next thing that will save us unimaginable amounts of time will be the exporting functionality of Sketch. Now usually you need to export, resize repeat. This is time and sanity lost. Enter Sketch3 to save the day! It’s all vector, and can do all of this for you in one export!

One quote I found in my research for this post from Cemre Güngör I think sums it up well.

“Sketch’s rendering feels closest to the end result (fonts, etc). Photoshop’s output feels like an estimation.”
There are many more features that I could go on and on about that are epic like the CSS Styles, Grids, Layer styles and don’t get me started on the Mirror app. All of these are set to make our lives as designers easier.

We’ll likely be writing more about Sketch in the coming months, as we’re looking to improve our general sign-off process. We’re also considering using Sketch as a wireframing tool to make for an efficient transition from wireframe to design and will be keen to share this experience.