Why we love Sketch

Why we love Sketch

This blog post was originally written for LegRoom Agency and was published in March, 2017.

Although we’re well-versed when it comes to technology, we’re all for tools that feel similar to our preferred environments (dev, of course!). Photoshop is great, and up until this point, has been the only real solution for web design and served as the industry standard. But as soon as Sketch was introduced, it was something we were eager to familiarise ourselves with, and many of our clients felt the same way.

Why, you ask?

It thought about us

Sketch operates like a development tool as much as a design tool. And while we’re extremely comfortable using Photoshop, we love that Sketch was created with developers in mind. It feels a lot like a good framework – easy to use, with a simple and consistent API.

It’s like the lovechild of Photoshop and Illustrator

Inheriting the best elements from both parents – 100% vector artwork from Illustrator, and the ease of working with layers from Photoshop.

Retina displays and mobile devices have been the cause of designers and developers banging their heads against the wall for too long – the idea of redesigning an application or website so that it meets the requirements of retina displays is ridiculous. If there’s a tool out there which is flexible, supports infinite zooming, 2x export with the click of a button, and pixel-perfect exports for various resolutions, why wouldn’t you use it?

PsAi.png

It’s removed ‘Slicing’, Photoshop’s evil step-child

Say goodbye to slicing elements and exporting them one-by-one. Not only is it a pain, it’s incredibly time-consuming. Granted, slicing does exist in Sketch, but it simplifies the export process exponentially by incorporating an ‘export all’ feature, which allows us to do so as JPG, PNG and PDF. And exporting in 2x is incredibly simple, so retina displays are still safe!

It doesn’t make false promises

Sketch promotes code-friendly designs. YES! All of the effects or properties created in Sketch are able to be replicated in CSS.

Photoshop was originally created as a photo editing tool, so there are a tonne of features that are completely redundant when it comes to web design (but props for being a versatile tool!). So while those multi-directional light sources might look incredible, they’re not a great solution when it comes to developing a site.

It understands our love/hate relationship with CSS

Speaking of code-friendly designs, Sketch also speeds up our development process by allowing us to grab the CSS directly from an element created in the app!

For something like a button, Sketch will generate the styling for the button itself, as well as the text inside. Although the code that’s produced almost always needs some fine-tuning, it provides us with enough properties to streamline the development process. And it even allows us to set custom browser prefixes!

Screen-Shot-2017-03-09-at-3.46.31-PM.png

It supports our beliefs; in documentation we trust

We love document styles. The ability to see the document inventory is a lifesaver for developers, in the beginning of the build and as a reference when refining the project. It helps us set up the document, organise exceptions, structure our code accordingly, and eliminates one of our least favourite things: surprises!

There’s nothing worse than finding an element which makes us trawl through our code with a fine tooth comb, and create a tonne of additional classes, or rewrite certain sections. Especially on a tight deadline!

It understands our obsession with grids

It’s no secret that the key to a beautiful layout is in the grid. Sketch’s grid system is easy to customise and apply across multiple devices. And the measurement tool is seamless and incredibly easy to use – we’re sticklers for numbers and producing a pixel-perfect build for each project, so these are crucial to us here at LegRoom.

It wants to grow

There are endless plugins to enhance Sketch’s already impressive wheelhouse, for both designers and developers – the colour picker, text styles, element and shape resizing, symbol libraries, artboard functionality, UI templates… the list goes on. And on. And on some more.

Above all though, Sketch streamlines the development process, and once you’re able to get used to it, we’re confident it would streamline the design process. And there are thousands of designers who can attest to that.

Of course, it all comes down to personal preference, and as developers, we need to be flexible and work with our clients to provide a great build. We’re not ready to say goodbye to Photoshop just yet.