Should beginners learn Adobe Photoshop or Sketch?

Bloc
News on the Bloc
Published in
6 min readMar 3, 2015

You want to be a designer? You want to know what tools you’ll need to learn to get a job? We’re here to help.

Features

Adobe Photoshop

Sketch3

Mac/PC Supported

*Mac Only

Vector-based

X

Extracting Assets

Reusable Elements

Built-in Grids

X

Adobe Photoshop has long been the tool of choice for creating mockups for web and mobile experiences. Photoshop was originally built for photographers to edit images, however, its powerful features made it easy to design beautiful, elegant, and useful websites.

A few years ago, a new tool emerged built specifically for user interface designers called Sketch, by Bohemian Coding. Since its release, some designers have adjusted their workflow to make Sketch their tool of choice. They’ve opted to ditch the robust, feature-rich Adobe software for Sketch’s simplified, extremely focused interface. Both Photoshop and Sketch have pros and cons, and we’ll share our opinion on why beginners need to learn both.

Photoshop is king

Photoshop is the canonical tool for designers, a designer’s “hammer”. As a result aspiring professional designers must become proficient with Photoshop. The term “PSD” is known by clients, frontend developers, product managers — anyone who has dealt with designers in the last two decades. PSDs are native files created in Photoshop, consisting of layers that can be separated and manipulated. Clients request them, frontend developers know how to implement them, and they’re easy to share and update with a team of designers.

While Photoshop was clearly meant for photo editing, it has evolved with each new release. Photoshop CC 2014 has updated features which are beneficial to designers who create digital designs:

  • Libraries: assets synced to a Creative Cloud account can be reused in other Adobe software, files, and projects
  • Smart objects: like libraries, smart objects can be reused in multiple instances in a file or across different files
  • Extract assets: Plugins, like DevRocket and Cut&Slice me were created to export assets with ease. Now, Photoshop has an integrated more comprehensive feature to extract images, elements, and objects for web and mobile designs
  • Layer comps: Layer comps have been within Photoshop for a while, but the newest round of improvements allow them to be created with ease. Layer comps allow a designer to create variations of a design by changing attributes, positioning, and visibility of elements without creating numerous files

Sketch is great, but not perfect

Sketch was created as a pure graphic design tool meant for UI designers. It lacks the extensive photo editing capabilities of Photoshop, but makes up for it with specific features to execute well-defined digital designs. Much like Adobe Illustrator, Sketch allows designers to create 100% vector elements, which won’t pixelate when scaled at larger sizes. Sketch files can be divided into pages consisting of artboards, which are canvases to create mockups. It comes with pre-defined templates for web, iOS, and Android Material design, accompanied with reusable symbols, or design elements, for each platform.

Unlike Photoshop, Sketch features built-in grids for designers to use, along with a panel to customize them for a particular project. Sketch is only supported and built for Macs, so PC users can’t take advantage of the lightweight application. Alternatively, Adobe’s Creative Cloud suite is available for both Mac and PC.

Sketch allows you to select individual elements and export them at several various sizes and file types, such as PNG, JPG, PDF, and SVG.

Some features of Sketch include:

  • Inspector: this panel allows you to change the attributes of elements and layers, such as color, shadows, size, position, etc. Each attribute follows CSS rather closely, so creating styles in code becomes easy to implement in code
  • Reusable elements: symbols, much like smart objects in Photoshop, are reusable elements that can be applied to various pages and artboards in a project. Sketch also allows you to define shared styles for shapes, and text styles for copy
  • Exporting assets: as discussed above, Sketch provides the ability to export vector-based elements at various sizes and file types. This built-in support is especially helpful when designing for iOS, which requires a variety of sizes for each device
  • Mirror: for iOS designers, Mirror allows you to preview your work on a device as you design. This makes viewing live updates easier than exporting and uploading each image to your device

Some designers have made the switch to Sketch because at just $99, it helps replace the costly monthly subscription to Adobe Creative Cloud, which is $49.99 for new users per month.

“I’ve become a big fan of Sketch. It’s pretty perfect for a UI Designer’s workflow.” — Billy Carlson, Director of UX and Mobile Product at Threadless and Bloc UX Mentor

Others say that Sketch has helped streamline their workflow. Instead of using three pieces of software (Omnigraffle for wireframes, Illustrator for logo design and illustrations, and Photoshop for interface design), they can simply use Sketch.

As with any software, Sketch has bugs and issues that designers will encounter. And like any respectable software, it’s constantly being updated with new features, fixes, and versions.

Change is hard

A mass exodus to Sketch hasn’t and won’t fully happen because change is hard. Companies ingrained in particular processes and workflows aren’t prepared to shed the comfort of using Photoshop for UI design projects. If an existing workflow is well-tested and proven to work efficiently, the cost of change can be more significant than the benefit. However, smaller companies, agencies, and startups are able to adopt new software and adjust their workflows and deliverables as needed.

Some designers still toss their mockups over to developers to extract assets as well. Those developers ask for PSDs typically, as that’s been the routine for a long time. Changing to Sketch requires time for everyone on a team to understand how the software works, and become comfortable with a new workflow.

Learning curve

The learning curve for design software is steep. A large design team would need time for all members to get familiar with Sketch, while completing work and delivering projects as usual. While Sketch is intuitive, especially to current Photoshop users, it has its quirks and shortcuts, which take time to become acquainted with.

The future

Workflows have changed. Now the tools have too. — Photoshopfordesign.com

Adobe feels the pressure created by Sketch, and has started Project Recess to create a new experience of Photoshop, built for web and mobile designers. No official release date has been set yet. Other applications, such as Affinity Designer, are being released to compete with Sketch and Photoshop as well.

Why does Bloc’s UX/UI program teach both?

In Bloc’s UX/UI Design program, we believe in creating unicorns: mythical creatures capable of magic. It’s our mission to develop well-rounded, adaptable designers. The current job market still calls for employable designers to know the ins and outs of Adobe Photoshop and Illustrator. This is the reason our curriculum focuses primarily on Photoshop and Illustrator for designing wireframes and mockups. By learning these tools, you’ll be more marketable to companies and have the solid foundation of skills required to be a designer.

However, as an increasing number of companies are requesting candidates to know Sketch as well, we also focus on teaching Sketch. Once you learn one tool, like Photoshop, becoming familiar with others becomes easier.

Indeed.com’s Job Trends shows that the growth for UI design jobs requiring Photoshop has dropped in the last year while Sketch has increased. Photoshop still displays a high-level of growth.

As you review job postings, you’ll notice that these jobs require you to know both Photoshop and Sketch, in addition to other software applications.

We believe that learning good taste and the fundamentals of design is much more important than the tools you’ll use. Photoshop, Sketch, and Illustrator provide the canvas for your work, but the vision for your design is much more important. Understanding the needs of your users for a project is the №1 priority.

What should I focus on learning?

So if someone asks, should I learn Photoshop or Sketch? As a beginner, you need to and should learn Photoshop. It’s still the tool of choice for many companies and clients. Once you master the basics of Photoshop, we would recommend moving onto learning Sketch.

Regardless of your profession, it is your job to continually adapt and learn new tools of the trade when necessary. We’ve come to that point in the design industry, which is why we teach our apprentices to use both emerging and legacy tools.

--

--

Bloc
News on the Bloc

An online education company with coding and design programs built for outcomes. Check out our publication, News on the Bloc, as well as our website, bloc.io.