Sketch vs. Photoshop: Oh, the struggle.

Sketch vs. Photoshop: Oh, the struggle.

Okay, Okay. We've all been there. You're teetering on the brink of a major tool transition and you just can't make the jump. So many new things to learn. How will you become efficient? How will this affect your workflow? Is it really worth the time and effort? You know the ins and outs of your current tool - is it really slowing you down that much? 

It's all too much. You're sweating. And potentially running to the kitchen every 5 minutes for, what I like to call a "distract snack". 

As an avid Photoshop user FOR YEARS AND YEARS, I was terrified to make the jump over to Sketch. All the designers were doing it. It was all the rage. Yet for some reason I just couldn't trade my beloved Adobe for Bohemian. I needed to be wooed a bit more. Have those Bohemian folks mail me a box of chocolates or a ticket to see Star Wars.

Enter Usher with "You make me wanna leave the one I'm with, start a new relationship with you..." (Which I, coincidentally, just spent singing all weekend with my dearly, beloved husband during one of our epic 90s music flashback sessions.)

. . .

A few years back, while continuously arguing with myself (and my Stone Table counterpart, Phil) about making the switch to Sketch, our client politely requested that we start using the program to help with developer efficiency. 

This sent me flying off the wall because now it wasn't an option. It was a request. Which was the nicest way of saying, "get your asses up to speed with the new technology, you design people, you". 

Oh, the pressure.

I politely fought back for a few weeks, flaunting our Photoshop experience and speed. Hoping he would succumb to the ever-so-effective "efficiency" argument. No client can argue with efficiency. It's faster. It's cheaper. It's pretty much all things awesome wrapped into one concept. It was the perfect out. 

And then it happened. Phil and I tried Sketch for the first time.

I replicated an entire iOS mobile screen in about 20 minutes, had all my layers perfectly organized, and understood more tools in said 20 minutes than I had known in Photoshop in 5 years. 

The wooing had begun. 

Okay, so efficiency had just kicked my ass. My argument was all lopsided now because I was officially a believer and that made arguing against Sketch even harder. I went crawling back to my client with my tail between my legs. He was right and I told him we were ready to make the jump.

As a UI/UX designer, Sketch just makes more sense. It was built entirely for this purpose, while photoshop wears many hats. Sure, we still use Photoshop weekly - generally for photo updates and or the occasional complex masking system that Sketch has yet to offer. Pixel based software will always have its place in my heart and in my business. For now, however, Sketch helps me do my job with more efficiency than I know what to do with. You can read an awesome article here about Sketch vs. Photoshop by InVision - InVision, another amazing tool (I'm sure you're familiar with) integrates with both Sketch and Photoshop but, in my opinion, kills it on the Sketch integration, hands down.

Here are my top 3 "efficiency" reasons for why Sketch kicks Photoshops butt as a UI/UX tool:

It's vector based.
This is by far my biggest argument for UI/UX designers to switch to Sketch. While Photoshop is pixel based, Sketch, similar to Illustrator, is vector based. When I first purchased my retina iMac, I was in tears over how files looked in Photoshop. Being that I was now viewing designs at 2x resolution, 100% pixel size now appeared at 50%. In other words, I could not view 1x designs at their full size on my new machine. THIS WAS IMPOSSIBLE. I was constantly zooming in to try and get the full perspective. How the hell are you supposed to design a web page when you can't view it clearly at 100% size? You just can't - or at least I couldn't find a way after browsing online help forums for weeks. We also found ourselves designing in 2x size so that we could view our designs at 100%. Big problem here, folks. Our files were so giant that dropbox would go into seizure mode and all hell would break loose. 

That takes me to my next point...

Drastically smaller files.
Holy crap. I can't express how many times Phil and I would lose our Skype or Slack call due to dropbox or google drive overload. "Syncing" became a swear word because PSDs were taking over our CPU and our lives. Sketch files, on the other hand, have transformed our workflow. They're the cutest, most compact little bundles of joy. They take moments to sync even with full imagery and numerous artboards. Dropbox and google drive syncing issues are now a thing of the past. 

Asset management is a breeze.
There was a time when exporting assets used to make our skin crawl. We had spent days, weeks, months, perfecting our asset exporting process in Photoshop - labeling layers with the utmost accuracy, spending excruciating time on perfecting the pixels of each icon, and we educating ourselves on the dimensions and requirements for each iPhone/Android resolution (including the wicked "multiples of 3" rule for Android devices - insert cringing face emoji here). Photoshop tried and tried to help with asset management. Their updates were frequent and while sometimes beneficial, we found ourselves constantly adjusting to keep up with the changing dialogue boxes. Upon switching to Sketch, a light shone down on the world of assets and offered a simple and trustworthy solution. All assets can be exported individually or as a group. You can name your layers however you please and this will not affect the export process. You can even adjust your vector icons in pixel format, using Sketch's "show pixels" tool in the header menu. Thank you, Sketch, for kicking asset ass.

Of course, it's great to remember that every tool has it's positives and negatives. For those UI/UX designers that decide to stick with Photoshop - power to you! I will always understand and appreciate the amazingness that is Photoshop. It's truly about finding a tool that works best for you, your clients, and your developer team. 

Here are some other resources you will find beneficial if you decide to switch to Sketch:

Sketch App Resources - All kinds of free stuff exclusively for Sketch.
InVision - Incredibly awesome prototyping that integrates with Sketch and Photoshop.
Craft - An amazing InVision plugin that makes syncing and code inspecting super easy.


The Mysterious Life of UX Designers

The Mysterious Life of UX Designers

Mantras For Your Monday

Mantras For Your Monday