Back in 2013, the agency I was working for at the time was still using Adobe Photoshop to design all our websites and UI. It wasn’t until about a year later that rumblings of Sketch started to become popular amongst the designers I knew. One of the main draws seemed to be that big companies in Silicon Valley were using it for their UI design, so therefore, if it’s good enough for Facebook, it must be good enough for everyone else.
Around 2015-2016, I saw lots of my designer friends starting to make the jump to Sketch. It was the cool thing to do, and you were seen as falling behind if you didn’t get on the Sketch train. My last agency made the jump from Photoshop to Sketch in 2016. Ironically, I have seen almost the same shift (down here in Melbourne, at least), since mid-2018, gathering with more steam each month since then.
After being on Sketch for 2 years, we decided to make the full switch from Sketch to Figma in early 2018, and we never looked back. Going from using multiple tools like Sketch, Zeplin, InVision and others, we were able to have everything in Figma instead, leading to happier designers, developers and far more efficiency.
As someone who experienced the transition from (many years of) Photoshop to Sketch (for 2 years), then Sketch to Figma (for another 2 years), I’d like to share some of the observations I’ve personally made on the topic of Figma vs Sketch, which are up to date (as of March 2020). I’ve broken them down into categories that made sense to me, and contrasted Figma with Sketch at each step. I hope this is a useful summary of why Figma is the best choice as an alternative to Sketch.
How designers work with developers in Figma compared to Sketch
One of the annoying parts of using Sketch was the limitations of designers being able to work with developers. Designers would typically create pixel perfect artboards in Sketch, but when it came time for a developer to actually build it, no one really knew the best way to go about it.
This led to us reaching for 3rd party tools such as Zeplin, which allowed designers to upload their designs and have it translated into a web app that developers could login to and click on elements from the original design. While this was a step up from getting developers to install Sketch on their machine (provided they weren’t using Windows or Linux), it still felt really hacky and totally disconnected from the original designs.
Every time the design was updated, they would need to be re-uploaded to Zeplin, where the developer may have already built all the screens from the previous design (while the designer was busy crafting the new version inside Sketch).
You can see how this would get frustrating, with designers and developers never truly on the same page.
However, when using Figma, These problems are mostly eliminated using Figma. First of all, because Figma is built with web technologies, it’s platform agnostic, so developers using OS X, Windows or Linux can all access the designs. Because it’s real-time, the issue of being “out of sync” with designers also disappears.
Performance of the Figma web app to the Sketch native app
Some of the early propaganda around switching from Sketch to Figma was around Sketch being a native app exclusive to OS X, where as Figma is written in web technologies that can be run inside a web browser on any operating system. Early skeptics didn’t see how Figma could possibly outperform something written as a native app.
Figma uses a 2D WebGL rendering engine that can handle large design files. They’ve written extensively about how they’ve gone about getting amazing performance inside a web app, leveraging the magic of WebAssembly, which allows you to run binary code (similar to a native app has) directly inside the browser. This is something that wasn’t possible even a few years ago.
Being built in web technologies is the most underrated “feature” of Figma, by a long shot. Not only does it allow real-time collaboration, cloud based storage and more transparency, but it also allows developers to actually read and the underlying design data inside a Figma file and use it for their own automation or development build steps.
Which naturally brings us to plugins…
Figma plugins vs Sketch Plugins
The last big battle cry from die-hard Sketch users was that Figma didn’t have plugins. I personally talked to people who literally weren’t switching purely because they needed (or wanted) to keep using the “Craft” plugin for Sketch, which allowed them to load in fake data to populate their designs. That’s all they wanted… even in the face of all the other benefits that Figma offered, this was a big enough deal for them not to switch.
That all changed on August 1st 2019, when Figma announced it was officially opening its own native plugin ecosystem and directly, built directly into Figma itself.
On launch day, there were multiple plugins for Figma that not only replicated what was available in the dynamic content plugin for Sketch, but far exceeded it.
At the time of writing Figma has almost 500 plugins live in its native plugin directory. For something that has only been live for 6 months, that is a crazy amount of development work by the dedicated community of Figma plugin developers.
Unlike Figma, Sketch does not have a plugin directly built directly into their app. These mostly need to be downloaded as zip files from GitHub repos and installed manually. For some designers this might be intimidating.
Worse still, if Sketch releases an update, it’s very common for plugins to break completely or have negative effects inside of Sketch. With Figma, this isn’t a problem as plugins are versioned to a certain version of the plugin API, so even if Figma releases updates, plugins will not break.
With Figma, plugins automatically update for everyone instantly when a plugin developer publishes an update. This all happens behind the scenes and doesn’t require any interaction from designers. Uninstalling a plugin is also a 1-click, 1 second process of clicking a button.
Collaborating with the rest of your team in Figma vs Sketch
When Figma was first announced on DesignerNews back in 2016, the top rated comment mentions:
“Design needs to be presented and sold and having stakeholders and even other designers poking around work at various stages of completion feels like a recipe for creative stifling.”
Fast forward to today, and every design tool (including Sketch) is racing to add the same live-collaboration features that Figma launched with in version 1.0.
Another more optimistic version of this comes in a quote from the creative director at Unfold:
“Comparing Sketch and Figma is like comparing Notepad and Google Docs.”
I think this is probably more accurate, as Google Docs was such a game changer for how we think about collaborating on writing and editing word documents, spreadsheets and presentations; Figma has owned this paradigm shift and run with it for the digital design industry when everyone else was betting on things staying the same in the future.
There is a reason why the road map of competing design tools all essentially describe achieving the functionality of Figma 1.0. I’ve publicly said before that I believe Figma is 2-3 years ahead of any other tool, and I think they continue to prove that this is true.
Learning Figma if you’re coming from Sketch
Figma was really thoughtful on behalf of anyone thinking about switching from Figma to Sketch for a few reasons.
The first reason is that they designed the UI and shortcuts to be very similar to Sketch, so designers can retain their muscle memory and not get too confused with learning new commands or shortcuts. This is comparable to a developer switching their code editor; if the shortcuts are totally different, they feel lost and end up switching back to the old editor they were comfortable with - even if the new one might be “better” in other ways.
The second reason is that Figma built functionality that allows you to import .sketch files directly into Figma, complete with all their layers as you would expect to see (not just a flat image). This is such a huge feature for anyone hesitant about losing their previous work that was done in Sketch, because it means they don’t need to spend time re-creating designs again in Figma.
Design Systems in Figma vs Sketch
This is an topic that most people don’t agree with me on (yet), but I believe that design systems should exist in the codebase as the source of truth for design. This means that tools like Figma or Sketch should serve as a UI to consume and manipulate design elements that are rendered from the codebase being used in a customer/user facing app or website.
While Sketch does have symbols and Figma does have components to make it easier for designers to create organised UI inside of the design tools, I believe that this is a spectre of what design systems will really look like in the future.
Once again, because Figma is built using web technologies, I believe they are positioned far better than Sketch to leverage this future (which is not a mainstream idea yet).
Even today, there are plugins like “Interplay” for Figma which allows you to link your Figma file with a production codebase of components, and render them inside your project for designing with.
An unfair fight
I’m not going to pretend that this is a fair fight, and that there was any chance I would recommend Sketch over Figma, because the truth is Figma is a clear winner in essentially every category when analyzing the “Figma vs Sketch” question objectively.
As I said, I used Sketch for over 2 years and then Figma for over 2 years, and the difference was like night and day (for me and our agency). If Sketch served our needs, we wouldn’t have even considered Figma, but the pain points were far too many and far too limiting for the ways that we knew we needed to work - at that time, and (more importantly) in the future.
I believe in Figma so much that I quit my job to start Figmatic and build premium Figma plugins. To me, this is my way of putting “skin in the game”, and showing that I’m not just casually saying Figma is “kind of better” than Sketch; I fundamentally believe it is more prepared for the future of working as designers and developers than Sketch is.
If you’ve already switched to Figma, welcome aboard. If you’re still considering it, now is a good a time as any to give it a shot. Based on my experience and every designer I’ve talked to, within 5 days, they won’t want to go back to Sketch.
