If you're a UI designer, you probably have heard of Sketch by now. It’s the app that has taken the design world by storm in the past few years, and deservedly so. If you’re not familiar with it though, let’s take you on a journey on what this app does, why Sketch might be worth implementing in your design arsenal, and why Sketch and Vectornator work so well together.

The Story of Sketch

Like all softwares, Sketch began as a grassroots tool (some might even call it indie) introduced in 2010 to disrupt the web design market. And so it did.

Most veteran designers used Photoshop at the time (some still use it to this day) and although Adobe did release XD to feed the beast, many find that the Photoshop interface cannot compete with that of Sketch. The abundance of clutter, with menus, panels, and way too many extraneous options can be very distracting when all you want to do is design.

So it came to pass that UI senpai’s and kohai’s alike switched to a program that was a little more relevant to the digital designer of today. Sketch stepped up the mark at just the right time.

With over 1 mil users, it’s clear that Sketch has become the de facto application of choice for UX/UI design. But as with any good story, the narrative does not stop here. In the past few years we have seen a few new contenders to the Sketch throne. Adobe XD for one, as mentioned earlier. But few tool releases made such a bang as Figma did. If you’d like to read more about Figma and our integration with it go to [xxx].

Why is Sketch good?

Vectors

Something that is very close to our hearts - with Sketch, it’s vector day, every day. Every element you produce in Sketch is a vector, which for a UI designer is not only important, but it’s pretty much mandatory.

With swift changes that need to be made in the design process, having the possibility to resize and zoom into elements without loss of quality, you can understand why it’s such a must.

Decluttered interface

If you go from Adobe to Sketch, the first time you open the app you’ll be surprised at the pleasantly clean interface. If you’re a green UI designer starting off with Sketch, you’ll simply notice how the interface offers you exactly what you need in a very intuitive way.

The creators of Sketch decided to trim the fluff and allow you to focus on simply designing.

Plus, with such a smooth interface you should be able to learn the basics in just a few short hours.

Code friendly

All the features in Sketch are easy to reproduce with code.

When you create any borders, shadows, or gradients, for example, you can simply copy their CSS attributes with just one click. This vastly improves the workflow between a designer and a developer. Sketch brings you both onto the same page (literally). Gone are the days when developers would be blindsided by designs that look great ‘on paper’ but are hard to reproduce in code.

For this reason, Sketch can even be a great aid if you’re looking to jump ship from design into development. Or you want to do both!

Vectornator and Sketch, sitting in a tree

As a vector-based design tool ourselves, you might be wondering why we are hyping up Sketch so much.

First of all, we are definitely not gunning for the same piece of the pie. Sketch is completely focused on web design, while we do not have such a claim to UI fame. Having said that, Vectornator is still a great tool for designing any sort of interface, be it for a website or an app, so if you’d ever want to edit or improve a .sketch file in Vectornator you most definitely can. But you can also build an interface design from scratch too, of course!

Ultimately, we want to make your lives easier and not harder. We understand that some tools are better for specific purposes. Our goal is not to trap you into using any one tool, but instead we want to allow you to have complete creative freedom and take your designs wherever you want, whenever you want.

We want to collaborate with other tools in an open ecosystem, and these types of integrations will only take us one step closer to that goal.

How to import Sketch files into Vectornator

There are many ways to accomplish this:

1 – Tap and hold your .sketch file (or ‘right-click’ on Mac) to access the Sharing Options. Then choose Open In Vectornator.

2 – Alternatively, you can simply drag and drop the .sketch file into your Vectornator canvas by using the Split View (available only on your iPad).

3 – Drag & drop your .sketch file into the top Area of the Import Tab.

Learn More – A more detailed explanation you can find in the Import section of our Learning Hub.

So today we’ve learned that Sketch is great. But what about Figma? To find out more about the tool and how we integrate with it, go to the next section!