7 Days with Sketch 2

Day 1:

Upgrading to Sketch 2 was a cinch. Having bought the previous version from the Mac App Store, updating to Bohemian Coding’s latest and greatest Illustrator replacement was as simple as hitting the update button under Sketch 2’s product icon. And whilst the 16MB update downloaded in the background, I began to un-install Adobe’s prime creative application from my computer.

To say the least, I got rid of Photoshop. I had to get rid of it. Since I only use Photoshop for what Sketch does, I might as well go head-on with using Sketch 2 as a replacement. I needed to see what it could do.

The un-installation took me over half an hour. In the meantime, I played with the new version of Sketch to see most of its major and minor interface changes. It looked better than the last version, and that’s not to say the last version’s UI wasn’t great. The guys over at Bohemian Coding knew my taste. They’re good. Sketch 2’s UI felt more native, and that’s something I still haven’t grown accustomed to in much of Adobe’s apps (I’ll have to wait and see how

If you’ve never used Sketch before, then you should know this: unlike Photoshop, Sketch has an infinite canvas. There are no set sizes for the canvas, and everything you draw with Sketch is vector; infinitely scalable if drawn right. Now I’d say Sketch is more of a designer’s tool than Photoshop, because Sketch itself was built and designed by like-minded designers. (Not to say the guys at Adobe aren’t like-minded. Some of the guys there are pretty cool.)

As I tinker more, the Photoshop un-installer tells me it’s finished. It also says I’ve received over 3GB of disk space. Can you believe that? I use over 3GB for interface design — and that’s what Sketch does in a fraction of it!

I restart my Mac. I would imagine others in the same position I currently am, finally replacing clunky old Photoshop for something more simple, and well-designed. Though, I do hope Sketch 2 is viable; I still have my doubts — and I still wonder if I’ll go crawling back for the Adobe disk.

I log in and see Sketch 2 in all its glory: Re-opened windows. Sketch 2 does great at what Photoshop does terribly, and that is the ability to pick up where I’ve left off. The fact that it restored my window even though I haven’t saved the file is another that completely astounds me. I can imagine this being entirely useful during an unexpected, uninformed blackout. I’m already loving Sketch 2, and that’s still just one of the many features included in the app.

Day 2:

Serious work. I quickly needed to create some icons for a personal project for a friend of mine. Having become habitual typing “P-h-o” in Spotlight, it launched iPhoto instead of Photoshop. Like always, iPhoto on my Mac takes nearly 45 years to launch (realistically, that’s 45 seconds). And that’s almost about the same amount of time Photoshop takes to save a file. I launch Sketch 2 from the launchpad. Before I even decided to drag the icon to the dock (realistically, about 0.75 seconds), Sketch 2 was ready for action. Well worth it, I thought. I dragged Sketch 2’s icon to the dock, to be used for the days to come.

If you’ve ever used the pen tool before in Adobe Illustrator, or at least in Photoshop, then you basically already know how to use Sketch 2. What the brush tool is in Photoshop, the pen tool is in Sketch 2. It’s the beginnings of your work, and it will, I tell you, make up most of what you create. Why? Because using Sketch’s pen tool is a breeze. It feels fast, responsive, “smooth.” Compared to Photoshop’s (of which I’ve been using), where it feels small, off at times, and “rough.” The same goes for Illustrator.

I begin my icons. Simple, more or less. The same way I do them in Photoshop. Though, to begin with, I’m designing more of what’s usually called glyphs. Simple black on white shapes, aimed to visually represent something in a simple way. To me, that’s what I feel Sketch can do at its most, though, having seen some incredible pieces of work made entirely in Sketch 2, I might as well take the extra leap. But not for now. I’m more simply focused on if Sketch 2 really did improve in performance from its first version.

Sketch 2 feels slightly more 1-on-1 in terms of UI improvement. Unlike the first version (running in OSX Lion), Sketch 2 feels slightly less buggy and more responsive. Though, there are some gripes. The “boolean” parameters in Sketch feel somewhat jittery. For example, if I select one or more objects in Sketch and apply the “difference” boolean parameter, the app lags a bit, and the objects are thrown in random places around the canvas. And for that, having an infinite canvas is a pain — sometimes, and including the situation as mentioned before, duplicating an object brings its copy to somewhere far away from the original’s location. That means having to zoom out far to find it, which is even worse when you’ve duplicated something incredibly tiny.

Lo and behold, the icons I’ve made in Sketch 2, are pictured below. Not my best, not my worst either. But if I were to make them in Photoshop, I’d be spending more time trying to pixel-hint the vector shapes than actually focusing on what the icons look like.

Exporting the icons were incredibly fast. Sketch 2’s slicing feature was definitely easier than that of Photoshop. I began to think Sketch 2 was the web design application Jason Santa Maria was looking for. Probably. The fact that exporting large amounts of icons (including ones made in separate layers) was made easy in Sketch 2, it feels more and more that Sketch 2 really is “the app” for designers.

Day 3:

Sketch is fun to use. What began as playing around with its beautiful, customizable bezier-curve options ended as creating fun, cartoonish avatars for myself. In my wait for

Though I found out that the more time I spent with Sketch, the more I experienced some of its buggy shortcomings. In fact, I was quite frustrated enough that I decided to list a few of them:

In a concise nutshell, Sketch 2 still needs some work. Thankfully, that’s what updates are for. I’ve been informed that most of these have been taken care of in the recently submitted 2.0.1 update. The incredible features Sketch has, in my opinion, gives me enough to tolerate a few of my gripes.

Day 4:

I was just recently “inspired” by David Lanham’s style of illustration. I still kept thinking that Sketch felt more like an illustration app than a “serious” go-to design app. But that’s not the case for Sketch anyhow, as the quality of work is depicted by the tool’s user.

If you have the time to watch David Lanham illustrate on Vimeo, he uses a combination of an input sketching tablet and Adobe Illustrator to sketch his drawings. I was craving for that sort of thing with Sketch. Sadly, Sketch 2 isn’t much of a raster-drawing app, but more of a sketch app (go figure), so brush strokes and the like weren’t possible. Instead, I relied on some pencils, paper, Photo Booth and dragging & dropping to begin drawing some Lanham-esque illustrations.

The result? Thanks to Sketch 2’s brilliant color-picking bug as mentioned above, the wonderful ease of the pen tool and the flexible transformations of shapes, that video below shows how I used Sketch as a brilliant illustration tool.

What I found out too was that Sketch is extremely fluid, in a sense that it works so smoothly in terms of vector-sketching. What’s a plus even, is that in my opinion, Sketch feels like a “lightweight” app, very much like how Espresso for Mac feels for me. It’s simple and fast, yet well-designed and feature-packed.

Day 5:

I generally keep myself from trying some UI work in Sketch, but today, I tried anyway. This also gives me more time with its styles sidebar, or the inspector.

I started off by creating some buttons. Everyone likes buttons. I began with the oh-so common rounded rectangle shape. One key feature I like about Sketch 2 is the ability to adjust the rounded rectangle’s border-radius — even after drawing it. I played around with this one with so much enthusiasm that I practically laughed at where Photoshop once sat on my dock. How immature of me.

Navigating the inspector is so much easier than having to double-click a layer in Photoshop. Sketch is strong where Photoshop is weak. The UX trumps Photoshop’s feature-packed bloatness. (Though on the other hand, Photoshop is great for photographers.)

Sketch 2 had enough options to create the usual of a UI designer’s style. Borders, inner and outer shadows, gaussian blur, inner and outer glows, a handy “reflection” toggle, and blending modes, too. Surprisingly enough though, It misses some of the key things I use so commonly in Photoshop like bevels and satin. It was my first time too, trying to build a gradient in Sketch 2. It felt flimsy at first, but once you get the hang of it, you’ll be creating gradients as complex as double rainbows. Sorry, what?

After a few hours of gradients, borders, shadows and even amusing myself with Sketch 2’s ability to instantly add noise to any color fill/gradient, I created what you see below. Another by-product of having fun and trying to be serious about it.

Day 6:

I love the fact that almost everything you create in Sketch is vector and infinitely scalable. Usually, if a day spares me time, I trace over old font books in hopes of creating custom lettering for myself. It’s an art I love doing in Photoshop, and having to try to do the same in Sketch wasn’t at all different. If I ever finish tracing over and creating custom lettering in Photoshop, I end up slicing and saving them for the web, then copy them over to a Pages file to print. In Sketch, everything I do is greatly reduced: with Sketch 2’s feature for saving as either a PDF, EPS, or an SVG, I don’t have to worry about exporting the font at multiple sizes. Even more, I don’t even need to export the image — a simple copy and paste into Pages will do the trick.

The guys over at Bohemian Coding are very clever too. If you’ve been busy designing Retina-UIs at 1x, Sketch has a simple “export @2X” option, which to many is an incredible time-saver. Basically, if you’re thinking of designing your next iOS app — Sketch 2 is best for you. There’s no doubt about that.

Day 7:

With almost a week spent without Photoshop, the premise of using Sketch 2 as my only tool for designing is almost one I could live with. I say almost, because I’m an avid user of Photoshop alone. And of course, I and many others, would love to spend some time with Photoshop CS6 slew of new features. Other than that, Sketch 2’s capabilities are limited by that of the user.

In my seven days of using Sketch 2, I know for myself that I haven’t covered everything. In fact, I’ve so subconsciously been slightly annoyed that I’ve created a small list of things I may have missed from the days before. But I am as satisfied to know that I have touched on the main features that makes Sketch 2 the app that it is.

In conclusion, Sketch 2 feels to me like it is Photoshop, trimmed down to suit the very needs of us designers — the very same ones who only use the layer styles window and the vector shape tools in Photoshop. Sketch 2 is an app designed by the people it was designed for _ designers. Both with purpose and cleverness in mind at a fraction of the cost.

Sketch 2 costs $49.99 on the Mac App Store — get it.

Jumpstarting a Design Community

Understand Your Compensation

Designer Monoculture

The State of Design Leadership

The Science of Product Design

Interview with Michael Flarup: Co-Founder and Lead Designer at Robocat

The Importance of Design Conventions