First of all, this article doesn’t aim to be a comprehensive overview either of the Sketch nor of Figma. There is plenty of articles on the internet that does it great. We just want to consider important points of our workflow in UKAD.
Starting with New Tools
Sketch was the first tool we started replacing Adobe products with. Currently, Sketch is the industry standard and still dominates the market. It took some time to get used to the Sketch, but an increase in the work speed was significant. This year we have tried using Figma since we heard a lot of promising comments about it. Adaptation time to Figma after Sketch was almost invisible.
If to look at the workflow and environment required to the tools — it’s a bit different.
Sketch workflow
With Sketch, you need a desktop application installed on a Mac OS machine. And it’s highly recommended to have plugins installed. Without it, you won’t feel the real power of Sketch.
If you want to send the design to colleagues or clients — you have to export mockups into separate tools like Zeplin, InVision, Marvel, Avocode, or with help of some plugins.
Although there is a way to build a prototype inside the Sketch and upload it to the Sketch Cloud — it seems to be a bit buggy and complicated. Also, you can send to the developer the .sketch file itself. But to open the file it required the Sketch app installed on a Mac OS machine. Most of our developers don’t use Macs though.
Figma Workflow
With Figma, a browser on any OS machine is all you need. Figma is a web application and all your files are stored in the cloud. To deliver the design you need just to share the link. That’s all. Viewers can view prototype, developers can check ‘red lines’.
And also, unlike Sketch Figma has a free plan.
There a very important aspect — how easy it is to start working in Figma.
But, there are some cons I want to point out.
Easy access and hand-off to developers
Working on the mockup in Sketch require any changes, updates, export assets to be made within a designer’s help. Obviously, it’s better to have a responsible person(s) for the specific task or field. But when you simply need to change the text or replace images — it’s handy when it could be done by anyone in the team (without a designer and the access to his machine). This is where Figma helps in a great way.
Regarding hand-off in Figma — it worked well for us. Although some of the developers still prefer Zeplin or similar redlining tools. We believe it’s more about the habits than Figma functionality lacks.
Collaboration
Collaborative work in Sketch is limited: you have to export the mockups all the time and present it to the team, then you have to apply feedback or updates and then to present it again.
This way is a little complicated.
We’ve tested collaborative work in Figma from the very beginning of the project with no defined structure, no finished text, and no a website page design.
We created a couple of wireframes drafts, where everyone — designer, marketing manager, project manager — could make changes at the same time. After a series of iterative updates, we came up with a solution.
We don’t say — before Figma it was impossible to work in collaboration and iteratively. That’s a question more of your workflow. But Figma let you make it easier, with less friction. We didn’t check comments functionality in Figma yet. But it seems promising to our workflow.
Files organizing and performance
It seems amazing not to bother with ‘where to upload the mockups?’, ‘is it the last version?’, ‘which way to deliver the mockup to the developer?’. The fascinating advantage of Figma is access to the last version from any machine on any OS, without installing the application.
Sketch — good when you go offline
For the projects, we worked on — having files stored in the cloud was fine. But when you have to work offline for a long time, or need to have all the files physically on your machine for some reason, Sketch is an obviously better option than Figma.
Yes, you can save the Figma file at your hard-drive and work on it. But access to the Internet is obligatory to update changes.
Figma file system seems a little messy
I wish a file organizing system in Figma would be better. If you have many files for different clients or projects — it would be not that easy to sort them and navigate through.
We didn’t face any significant bugs or crashes neither in Figma nor Sketch. But the performance of the Figma looked faster.
Design System and Editing
Figma was created as a solution to simplify the building and maintaining a design system. Although, Sketch functionality let you create a style guide or design system: text styles, shared styles, layout grids, and other required settings, implementation of all these functionalities in Figma are more flexible and easy to access.
Components in Figma are easier to manage and access as well. Opposite from Sketch, in Figma components, are listed at the separate interface panel and sorted by groups and pages. Besides that, Figma lets you change component instances styling. For us, components implementation in Figma looks more intuitive and flexible for updates.
Although by many points Figma surpasses Sketch, here is where Sketch takes the revenge. Yes, plugins could affect the app performance or could stop working after the next Sketch update. But, for now, some of the plugins are so much useful that it could be crucial when you choose: Sketch or Figma. Plugins which highly improves our work are — content and photos auto-filling plugins; Auto-layout by Anima; plugins for button auto-resize, and others.
There is no any similar functionality in Figma yet.
The Sketch — is a small company, which consists of workers mostly from different parts of the world. Sketch has brought the significant change into UX/UI design tools a few years ago. And Sketch is still the industry standard.
Figma — is a company that raised 43 millions of investments, and consists of great designers from Silicon Valley. Figma grows in really huge tempo and adds new features all the time. And as for design collaborative work — Figma is the best tool in the moment.
In our workflow, we still use both apps. And we appreciate both for its strength. So, we make a choice up to the project or task. But from a long-term perspective — Figma would likely outscore Sketch. Anyway, it seems to be an interesting battle ahead. Since there are a lot of other tools at the market like Framer, InVision Studio, Adobe XD, etc. So, who knows what tool will change the game again.
Originally published at https://www.ukad-group.com.
