Design & UX
Article
By Daniel Schwarz

Has Sketch App Forced Adobe to Improve Photoshop?

By Daniel Schwarz

When version 3 was released, Sketch App really came to light, and that’s when we began comparing it to Photoshop – the biggest design tool in the world. Not many companies had the courage to square up to Adobe like Sketch App did, so it’s only natural that we used Photoshop for more than image manipulation.

Sketch has been very influential. Not only have we seen a huge rise in new design tools since its arrival, but it became sensational enough that we began comparing it to Photoshop.

Photoshop was never suitable for web design (hello, it’s called Photoshop), but for a long time, there was nothing else. I always found it silly to compare Sketch App to Photoshop, and the conclusion was always the same; “it depends on what you’re using it for”. But now that’s changing. Adobe has become more aware.

Let's take a look at how Adobe is fighting back.

Sketch and Photoshop

Exporting Assets

As I’ve said many times before, the Export function is Sketch App’s most redeeming feature, so it makes sense that Adobe then went and integrated their own “Generate Assets” feature into Photoshop as their first act of officially declaring that Photoshop could be used as a user interface design tool.

Here’s a quick breakdown of how the two features compare:

Sketch

Select a layer and click “Make Exportable” in the bottom-right corner. Optionally, you can define settings such as size, suffix and format, depending on how the images will be used and on what type of device; retina, non-retina, web – and so on.

Sketch remembers each export and this is called a “Slice”, and you can access those slices in an interface with command+shift+e to reinitiate one, two, or all of those slices again.

Exporting Assets with Sketch App

Photoshop

Adobe does it differently. It’s up to you to decide which is better, but to my surprise (I’m a die-hard Sketch fan) I actually think Adobe’s way is rather spectacular. First, turn on the feature by navigating to File – Generate – Image Assets.

Now create a simple square and save the document. Photoshop automatically exports your assets to a folder depending on how you name the layer, so let's start with square.png – the fact that you’ve specified a filetype tells Adobe that you want a PNG file, but the rest of the settings can remain default.

You can also specify PNG8/PNG24 (example.png8, example.png24) or even “example.jpg100%”, which means JPG with 100% quality instead of 90% quality, which is the default. Now lets crank it up a notch – let's try “200% example-retina.png, example.png”.

Generating Assets with Photoshop

In english translation, this means: “create your average, run-in-the-mill PNG but also create a retina version for the iPhone.” All assets are automatically updated upon save.

Not only do I think that this is a terrific move by Adobe, but their decision to keep this mostly interface-free shows that Adobe is truly listening to their users – one of the biggest concerns from Photoshop users is that Adobe software is very clunky. Hopefully, they will take this approach more often.

Artboards

Artboards are an integral component in Sketch, much like they always have been in Adobe Illustrator, but until a couple of months ago, Photoshop didn’t have anything of the sort.

Let's compare.

Sketch

Press “A” and The Inspector (on the right-hand side) will list all the artboard sizes available. Click, choose, enjoy.

Photoshop

When you open a new document you’ll have the opportunity to start with an artboard, where the options are rather standard, much like Sketch. It almost seems as if you cannot have artboards side-by-side, but if you right-click on the “Move Tool” in the toolbar you’ll be able to select the Artboard Tool; after that, select a “Size” and then click the “Add New Artboard” button.

Or, alternatively, you can draw out a randomly sized artboard and use the Size option to change it. You can also change the orientation of the artboard by using the “Make Portrait” and “Make Landscape” options in the same menu bar. In a true Adobe fashion, the user experience has been traded in for more flexibility, so I suppose it comes down to what you value more.

Creating Artboards with Photoshop

I adore the simplicity of Sketch App, so for me, I have to say that Photoshop still has work to do regarding artboards, but I’m happy at the fact that Photoshop is on the right track. What would benefit Photoshop the most is a complete rethink of their keyboard shortcuts, helping users to navigate to the tools they want to use with minimal effort. Less clicking, fewer menu’s.

Conclusion

I think Photoshop’s clunkiness is still thwarting its own development, but on the other hand, there are times when I wish Sketch had more features. Our trade is advancing faster than it ever has before, and it seems that our needs vary from designer to designer on a huge scale, and change so frequently that software makers, I would assume, find it hard to keep up.

In any case, it’s nice to see Photoshop evolving into a well-rounded design tool that caters for screens and devices, and not only does it seem that Adobe is looking to rival Sketch App, but they also appear to be improving their features, rather than copying them. So… which export feature did you like best?

  • For me the Project Comet is definitively the big Sketch reaction from Adobe!

    • Christopher Jacobs

      Absolutely! But Adobe is touting it as a prototyping tool. Sketch is not.

    • I really need to take a look into Project Comet. I’ve heard about it a few times now!

  • I’m using Affinity Designer & Photo, dropped my Adobe Subscription, I have sketch, Axure and can speak very highly of Serif’s software…….I’m not so sure this is a two horse race guys………

    • Luke Pettway

      Doing the same thing currently.

    • I tried Affinity’s apps but I honestly didn’t like them. It definitely seems faster, smoother and cleaner than Adobe, but the user experience ruined it for me. I would love to see a breakdown comparison though. I definitely don’t think Affinity is out of the running.

      • I tend to find the ui very similar to illustrator, it was a easy adoption form adobe, but yeah we all like different tools so it can be an individual choice… I love pixel editing too, artboards and their features are great, shapes are cool, text on a line tool… I use designer and photo all the time now and their much faster and cheaper. Overall I’m very happy and since their latest update their my go to tools for design and photo editing…

        • I’m curious, what happens when Affinity releases a new major update? You buy the app again or are the updates always free?

          • You download the update from the app store free of charge ;)

          • Awesome. I’ve noticed an increasing amount of apps taking themselves down from the App Store and releasing new versions. iA Writer for example.

          • Yep me too, Serif so far have been great and try to set the bar high in terms of software, support and service….

  • Pretty interesting read Daniel.

    As far as I know, no UI design software or the like have capitalized in one of Fireworks’ killer wins: Pages.

    For many, having a single “artboard” or canvas works better or just as well as having them side by side.

  • Liam T.

    I love Sketch, but I want Adobe to have success with their ideas and projects.
    Why? Because that will create more competition, which means all developers, including Bohemian Coding (Sketch), will be constantly improving their creations.

    On a side note, I don’t think I will come back to Adobe though, I use Affinity Designer + Photo and Sketch for all of my work. It’s just faster. I don’t believe Photoshop will start culling it’s bloat any time soon. Quite the contrary, they add new features every year, which further slows down their software.

    • Agreed. It’s a really exciting time to be a user interface designer right now.

  • Fuzzee Lowgeek

    I can’t use Sketch right now, since I’m on PC and I fear it would be slow on my virtual Mac. Adobe’s bloat doesn’t bother me, since I’m a maniac and spend thousands of euros a year on my hardware. But I’ve seen Sketch go and it’s a real wonder.
    I have hopes for Project Comet. Think I’ll try out Axure too.

  • Photoshop existed way before Fireworks and while it did achieve moderate success, most designers wanted to stick with Photoshop. Hence, Fireworks was discontinued and today, Adobe users still designing websites in Photoshop. We also tend to compare Sketch to Photoshop for the simple reason that Photoshop is the most mainstream app out there, even if it may not be the most suitable.

  • igmuska

    $99 one time vs $$$$$….

  • Tom

    Adobe’s biggest mistake was turning Photoshop (and all of their applications) into a monthly subscription service. As a result, I’m still using CS6 and will never move into their “Creative Cloud” no matter how many new features they add. Knowing I’m at the end of Photoshop’s life-cycle as a stand-alone app, I’ve been using Sketch more and more for various projects. Sketch still has a ways to go with their interface and features, but, it’s slowly becoming a better app for professional designers.

    • I honestly don’t see the downside to Creative Cloud, but that doesn’t mean I don’t like the pay-once, use forever method. I’d happily pay for Photoshop if it were $99, but the sad thing is that they keep adding features which hikes up the cost of the software.

    • hexplor

      Actually that was great move. I never had photoshop and now i’m subscribing their service and i have also Lightroom included for a very low price (for companies). Spending A LOT at once is always bad. Now you can just fit your subscription expenses in monthly basis.

    • Leo Klein

      I’m with Tom. I want to own software, not rent it.

  • Dorothy Ryan

    I don’t know why Adobe didn’t just continue to evolve Fireworks for web design and leave Photoshop as the tool of choice for Photographers. I have’t used Sketch much but I think it compares more with Fireworks than Photoshop. Fireworks was by far the best design tool for web before Sketch – it was fast and there was a large community of extension developers, probably still is but, for me, I don’t see any point in continuing to use it since Adobe stopped supporting it. That said, I still dive into it every now and then when I want to do something really quickly. I’m looking forward to Project Comet, so I hope it will be included in the current Creative Suite.

  • Dorothy Ryan

    I don’t know why Adobe didn’t just continue to evolve Fireworks for web design and leave Photoshop as the tool of choice for Photographers. I have’t used Sketch much but I think it compares more with Fireworks than Photoshop. Fireworks was by far the best design tool for web before Sketch – it was fast and there was a large community of extension developers, probably still is but, for me, I don’t see any point in continuing to use it since Adobe stopped supporting it. That said, I still dive into it every now and then when I want to do something really quickly. I’m looking forward to Project Comet, so I hope it will be included in the current Creative Suite.

    • Adam Longaway

      Everything Adobe got their hands on in the purchase of Macromedia has sort of gone away…

    • Leo Klein

      Fireworks was/is? a great product. It brought together (at least to a certain degree) the graphic capability of Photoshop together with the vector-shape capability of Illustrator which back in the day were a pain in the butt to use for moderately ambitious graphic work. Fireworks solved this problem — in a way, apparently, that Adobe never understood.

  • Dorothy Ryan

    I didn’t see your comment about Fireworks before I posted mine (above). Fireworks was much more suited to web than Photoshop having been specifically developed as a web design tool. I loved the ‘Pages’ feature and Photoshops artboards don’t adequately replace it. Fireworks users were pushed into either using Photoshop or jumping ship because Fireworks began crashing regularly as soon as Adobe announced its demise.

  • Maybe, but not enough for me to want to start using Photoshop again :|

  • Marisol Lopez

    Photoshop is not clunky. I use Sketch but with photoshop you can do so much more.
    One thing that I really don’t like about Sketch are the side panels with the different settings that are stuck there. You can hide them, but you can’t move them to another screen or hide the ones you don’t use, etc, like you can in photoshop. Those side panels eat a lot of design real estate. It’s really annoying.

    • Which sections of the layer list or inspector do you not use? I know for me Photoshop has many, many more panels, most of which are useless to me.

  • Sebastian Perez

    Adobe needs to port to Linux.

Recommended
Sponsors
Get the latest in Design, once a week, for free.