You’re on an old version of this site. Please visit danmall.com for the latest.

#sketchlive

Two weeks ago, I opened Sketch for the first time. Lots of people were raving about it as a great new tool for design, so I wanted to see for myself. I tweeted my stream-of-consciousness thoughts for 2 days. Here are the highlights.

Disclaimer: this post isn’t affiliated with Sketch or Bohemian Coding at all, other than me using the trial version of Sketch 3 for this experiment. Also, my point of comparison is Photoshop, an app I’ve used for about 15 years and is the second app I open every morning (after my email client). I’ve been on customer advisory boards for new and current Adobe products, but this post and experiment have nothing to do with my affiliation with Adobe. I have never received any compensation from Adobe for endorsing any products, but they did send me a sweet Photoshop pillow once.

I recently started a new project, redesigning a site for a media company. I learn better when I have an actual project with which to learn the new skill (as opposed to only doing tutorials and theoretical examples), so I dove in head first. On the first day, I had some challenges getting oriented…

… trying to overcome my muscle memory…

…and remembering to eat because hangry.

On day 2, I decided to switch from my current project to a slightly different one. My current project’s style guide relies on flat colors and utilitarian typography, and, even in a short day, I’m convinced that Sketch is great for designing sites like that. But, one of the reasons I continue to use Photoshop is that it’s equally flexible for all types of pixel pushing. Sure, there are features—like the ones in tools like Sketch—that would make some tasks much easier to accomplish, but for me to fully switch, I’ll need to be able to make a range of outputs with the tool.

I decided to replicate the Meet Your MX site, expertly designed by Brijan Powell. I loved this site from the instant I saw it, because it contains a lot of richness in typographic design, graphic design, and interaction design that I think is missing from a lot of sites nowadays. A good design tool should allow me to design a site like this without much friction. A great design tool should make it easier for me to design a site like this.

I think I did a decent job with the replication (using a separate model):

At the end of two days, I thought Sketch did a good job of getting out of my way in designing this interface. However, it didn’t really do anything to help me design the interface, at least not any more than Photoshop does. To boot, I do a lot of photo manipulation when I’m designing: dodging and burning, layer masks, level corrections, and more. Because Sketch doesn’t have these tools—at least for now—I still need to rely on Photoshop for them, which means I’m jumping back and forth between apps.

So far, Sketch certainly isn’t a Photoshop replacement for me, and, if I’m in Photoshop for part of the time, I’m having a hard time justifying not being in it all of the time.

the #sketchlive aftermath

I’ve continued to use Sketch for this media company redesign for the last two weeks. There are a few things that I’m really liking:

  • Export tools. By far the most impressive feature for me. Being able to select any layer or group and hit Cmd+Shift+E to generate an image—in lots of resolutions—and drag it out to anywhere is priceless. And lightning fast to boot? Photoshop’s Save for Web has a lot to learn from Sketch’s exporting.
  • Text styles. More Systematic thinking in a graphic design program is incredibly welcome. I use this a lot in Photoshop too.
  • File sizes. Seven full comps in one file with a file size of 6.7MB. My last equivalent PSD was 167MB.
  • Symbols. I love the idea of resuable elements because it relates to the way I think about developing these designs, but it’s taking me a while adopt the practice. I just don’t think about it yet. This week, I had to update the footer in all my comps. If I had used symbols, that probably would have been a breeze. But I didn’t. So it wasn’t.
  • Copy CSS Attributes, in theory. I haven’t built a site that was designed in Sketch, and I won’t be building this one myself. TJ Pitre will be building this one, so keep an eye on what he says about it.

Is all that enough to be a Photoshop killer? No. At least not yet. But Sketch definitely has a pretty steady place in the arsenal.

blog comments powered by Disqus

Article Info