The debate about Sketch vs Photoshop keeps on raging. There is no denying that, to this day, Photoshop is still the most commonly used tool for making mockups both for mobile and web designs. While it is true that Adobe Photoshop was primarily meant as a tool for photographers to edit their captured images, its compelling features empower web designers to come up with striking and useful websites, too.
What is Sketch ?
Photoshop is the most popular tool in graphic designing and you might hear about it. But you may not aware about the Sketch. Lets check what is Sketch and why we care about?
Sketch is a mockup / UX and UI development tool created by Bohemian Coding (someone other than Adobe; yes, I know it’s hard to believe), and the newcomer has managed to unsettle Adobe, which was the undisputed industry leader for decades.
What makes Sketch different?
In as few words as possible, Sketch promises faster workflow and easier use than its counterparts. You could think of Sketch as Illustrator with some Photoshop stitched together, but that’s only part of the story. Many Adobe features that you don’t use 90 percent of the time were stripped out, so what we end up with, is a streamlined tool, designed to quickly prototype everything from simple wireframes to complex mockups.
Sketch is only available for Mac OS X, sorry PC users, there’s no Windows version and you shouldn’t expect to see one soon.
If you are a designer you are probably using a Mac anyway, so the next few points ought to make it easier for you to decide if you should try convincing everyone else to switch to Sketch.
If you are planning on using Sketch mostly for wireframes, there is still hope for multi-platform compatibility since you can export files to SVG and PDF format; you can get some editing capabilities back once you open it in Illustrator.
The only other way of making sense of Sketch files on Windows is by employing specs tools, namely Avocode.
From time to time it does feel like the Sketch team decided to move things around just to differentiate their product from Photoshop.
This is when you pray the Undo button actually works (more on that later). I would say styles implementation is better (since you are forced to use them) than Adobe’s, where I have to spend time manually setting up styles and then forget to use them, anyway.
You will eventually learn to check if the styles dropdown is highlighted before you make any changes. However, you can still trigger it, maybe by resizing an element with text in it, thus changing the font size and triggering a global style change. It would be cool if there were a way to prevent this, maybe through some sort of lock button that you have to press before messing with styles. Or, perhaps, style application is cleared if you change an object (as in Photoshop), or only allow style changes from the designated Symbols / styles page.
Yes, it’s easier and faster to export in Sketch. Simply drag artboards to your desktop and it saves them, and it’s easy to specify the resolution, such as 2x, for Retina-class tablet displays and so on.
Not that you can’t do these things in Photoshop, which now has a “quick export to png” option when you right click on items; it’s just a little faster and better implemented in Sketch. However, you can’t export your entire screen, only artboards (as in Illustrator). It’s something to remember before you draw arrows between artboards to guide the wireframe flow.
Another significant plus for Sketch is that it’s a vector-based tool, just like Illustrator. Your design will look good on all devices and assets, it won’t be as huge as your Photoshop files, and you can even save them as SVGs.
Sketch may be described as the opposite. Sketch has a smaller footprint, it’s really fast, and allows me to have 40 artboards on screen and quickly move things between them without a hint of sluggishness. Unfortunately, this is where the good news come to an end. Despite being around for a few years, it still has a lot of bugs . Some users (including me) feel like they are using a beta product, and stability can be a deal-breaker for many people.
Thankfully, I never had it crash on me. However, you should expect some unexpected behavior like the undo function not working (this particular bug has been documented for a month now), or undoing some random step on some random art board without the ability to get it back. I actually had to stop using undo in my workflow because of this bug. In one instance, undo completely deleted one of my artboards and everything in it with no way of getting it back. This is not the only bug, although I found it the most frustrating. You should also be ready for inconsistent line spacing and text resizing. I remember one time I loaded a file for a client presentation and half my objects were moved to the right by about 20px, making me look like a noob designer who can’t align things.
Let me be clear. Sketch is buggy, but it is not buggy enough to be considered unusable or unsuitable for serious work. Having said that, I think many users will reach a point where these minor glitches start to annoy them to a point they consider switching back.
For me, it’s a tough choice. Because I have crush on Photoshop since 2009 but I really wanted to fall in love with Sketch, however some of its limitations creates burden. Yes, Sketch is faster and feels a lot more like an actual UI design tool than Illustrator or Photoshop. You will be able to build things much more quickly, even if you just moved from Photoshop and Illustrator.
Still, bugs will push the otherwise excellent speed back a notch, and Mac-only support really limits the scope of projects. For now, I am using Sketch solely for wireframes and smaller projects, and sticking to Photoshop for my main UI mockups.
Rakesh Sahu
Graphic/UI/Web Designer
Sketch is a mockup / UX and UI development tool created by Bohemian Coding (someone other than Adobe; yes, I know it’s hard to believe), and the newcomer has managed to unsettle Adobe, which was the undisputed industry leader for decades.
What makes Sketch different?
In as few words as possible, Sketch promises faster workflow and easier use than its counterparts. You could think of Sketch as Illustrator with some Photoshop stitched together, but that’s only part of the story. Many Adobe features that you don’t use 90 percent of the time were stripped out, so what we end up with, is a streamlined tool, designed to quickly prototype everything from simple wireframes to complex mockups.
Compatibility
Let’s get the elephant out of the room first: If you are using a PC, working outside the US, and most of your clients and team members do not use Macs, then you can probably stop reading now since you will constantly deal with users that can’t use your files.Sketch is only available for Mac OS X, sorry PC users, there’s no Windows version and you shouldn’t expect to see one soon.
If you are a designer you are probably using a Mac anyway, so the next few points ought to make it easier for you to decide if you should try convincing everyone else to switch to Sketch.
If you are planning on using Sketch mostly for wireframes, there is still hope for multi-platform compatibility since you can export files to SVG and PDF format; you can get some editing capabilities back once you open it in Illustrator.
The only other way of making sense of Sketch files on Windows is by employing specs tools, namely Avocode.
Interface
If you are used to Photoshop and Illustrator, you will feel semi familiar because the Sketch interface looks like it was re-imagined by someone who might have worked at Adobe. You can learn everything you need to get started in a matter of hours.From time to time it does feel like the Sketch team decided to move things around just to differentiate their product from Photoshop.
Style Done Better
When you add a text box and you are working from a template, Sketch automatically adds a style to it. It is also easy to create and define new styles. So easy, in fact, that you will be accidentally overriding them half the time and then watch in horror as your changes propagate to all your artboards. (Actually, most of the time you won’t notice it until you are presenting.)This is when you pray the Undo button actually works (more on that later). I would say styles implementation is better (since you are forced to use them) than Adobe’s, where I have to spend time manually setting up styles and then forget to use them, anyway.
You will eventually learn to check if the styles dropdown is highlighted before you make any changes. However, you can still trigger it, maybe by resizing an element with text in it, thus changing the font size and triggering a global style change. It would be cool if there were a way to prevent this, maybe through some sort of lock button that you have to press before messing with styles. Or, perhaps, style application is cleared if you change an object (as in Photoshop), or only allow style changes from the designated Symbols / styles page.
Exporting
Yes, it’s easier and faster to export in Sketch. Simply drag artboards to your desktop and it saves them, and it’s easy to specify the resolution, such as 2x, for Retina-class tablet displays and so on.
Not that you can’t do these things in Photoshop, which now has a “quick export to png” option when you right click on items; it’s just a little faster and better implemented in Sketch. However, you can’t export your entire screen, only artboards (as in Illustrator). It’s something to remember before you draw arrows between artboards to guide the wireframe flow.
Another significant plus for Sketch is that it’s a vector-based tool, just like Illustrator. Your design will look good on all devices and assets, it won’t be as huge as your Photoshop files, and you can even save them as SVGs.
Speed and Stability
Sketch may be described as the opposite. Sketch has a smaller footprint, it’s really fast, and allows me to have 40 artboards on screen and quickly move things between them without a hint of sluggishness. Unfortunately, this is where the good news come to an end. Despite being around for a few years, it still has a lot of bugs . Some users (including me) feel like they are using a beta product, and stability can be a deal-breaker for many people.
Thankfully, I never had it crash on me. However, you should expect some unexpected behavior like the undo function not working (this particular bug has been documented for a month now), or undoing some random step on some random art board without the ability to get it back. I actually had to stop using undo in my workflow because of this bug. In one instance, undo completely deleted one of my artboards and everything in it with no way of getting it back. This is not the only bug, although I found it the most frustrating. You should also be ready for inconsistent line spacing and text resizing. I remember one time I loaded a file for a client presentation and half my objects were moved to the right by about 20px, making me look like a noob designer who can’t align things.
Let me be clear. Sketch is buggy, but it is not buggy enough to be considered unusable or unsuitable for serious work. Having said that, I think many users will reach a point where these minor glitches start to annoy them to a point they consider switching back.
Conclusion
For me, it’s a tough choice. Because I have crush on Photoshop since 2009 but I really wanted to fall in love with Sketch, however some of its limitations creates burden. Yes, Sketch is faster and feels a lot more like an actual UI design tool than Illustrator or Photoshop. You will be able to build things much more quickly, even if you just moved from Photoshop and Illustrator.
Still, bugs will push the otherwise excellent speed back a notch, and Mac-only support really limits the scope of projects. For now, I am using Sketch solely for wireframes and smaller projects, and sticking to Photoshop for my main UI mockups.
Rakesh Sahu
Graphic/UI/Web Designer
Looking forward to a more interesting posts like this one.
ReplyDeleteseo agency Melbourne
Custom software development Melbourne
Mobile Apps Development Melbourne