When talking about UI design software, Sketch probably comes to mind first. With the rise of the mobile Internet, Sketch has come a long way. Less powerful than its former big brother, Photoshop, Sketch quickly captured the attention of the UI design community because it was lighter and more efficient. All of a sudden, almost every major design team in China and abroad has embraced Sketch as their primary productivity tool, making it the new king of UI design.

In the past two years, a design tool called Figma has sprung to prominence. According to UX Tools’ annual survey of thousands of designers around the world, Figma rose from 7th in popularity in 2017 to 2nd in 2018, and was named the most anticipated design tool in 2019, showing surprising potential. Especially this year, many companies are switching from Sketch to Figma, such as Twitter, Microsoft, Github, etc. The design team of Netease in China has started to use this tool to carry out remote collaborative design.




So how did Figma gain so many followers, both at home and abroad, that it captured Sketch users?


Best cross-platform UI design tool


For a long time, interface design tools seem to be extremely unfriendly to Windows. For example, Sketch doesn’t have a Windows version at all. Adobe’s XD has a Windows version, but the actual experience is still very different from Sketch. Figma is built on a Web platform, so as long as your device has a browser and is connected to the Internet, you can have a great experience comparable to sketch on the MAC, without any system constraints.





Smooth operation experience

Although Figma is developed on the Web, it is as smooth as client software. If you are used to designing with PHOTOSHOP, you must have been afraid of being dominated by the problem. Complicated design documents, especially multi-artboard designs, even moving layers become extremely difficult.

In this regard, Sketch is greatly optimized compared to PS, but it also has an obvious upper limit on performance. If there are too many sketchboards, Sketch will still get stuck for a long time.

Figma doesn’t seem to consume much local resources. For the same size project file, Figma is able to keep the cache extremely low and maintain a smooth 60 frames rendering, which is truly “silky smooth”.


Super global components

This function is very similar to that of Sketch’s Library, except that you can create a special file in Figma to define components or styles and publish them to the Library. This allows all members of the team to invoke these components from any file in the team. And thanks to Figma’s Web-based development, these components can be updated in real time, which means that once a component style is changed, the team can choose whether to update it or not wherever it is used in the project.


True core competency – teamwork

Still the inherent advantage of Web-based development, multiple designers can operate the same design document in Figma at the same time, without having to save and then send each other, which is a double efficiency. Figma also supports comments where changes need to be made and where they are low priority, and simply adds a comment to alert the rest of the team, eliminating the need to send design source documents around the team and making it easy and efficient to review. Killer feature no problem.


Restoring historical versions

For all its benefits, Web-based Figma often feels insecure. If a design draft after hours, a fierce operation like a tiger suddenly cut off the power grid, if you do not save the file in time, really can only be tearless.

Figma addresses this pain point very well. Every change by every member of the team will generate a corresponding historical version, even if a member of the wrong operation has sufficient backstop mechanism to ensure the safety of the file.




As you can see, Figma is a great Web-based design software that is on par with Sketch in every aspect of the experience, and the competition continues. So as designers, how do we choose?


Sketch V.S. Figma


Component system

Once upon a time, Symbol was the killer feature Sketch was known for, dramatically improving design efficiency. Figma’s Components inherit the advantages of Symbol and are more flexible, more in line with the needs of designers.

For example, when you create a Symbol in Sketch, all attributes are saved there, and if you change any attributes, you need to synchronize the files that reference the Symbol in an overwrite form. If you want the symbol to have a different alignment or color, you need to preset it in advance or change it after unassociating the symbol.

Figma’s Component is more liberal and powerful because of the parent-child relationship. When you reference a Component, you can modify its properties without interfering with the parent’s style, and modifying the parent’s properties can modify the world.





Collaborative way

Figma’s collaboration follows the Google Docs model, allowing all designers to work on the same file at the same time. You can see many mice on the page and see what other designers are doing. The designer may not like it, but the boss and client will probably love it.




Because Sketch is a client, collaboration requires plug-ins. There is a version management plug-in called Abstract that allows designers to design in project branches like Github and then merge branches to resolve conflicts. It’s a bit of a hassle, but it’s also a rigorous Sketch version management solution.


Delivery of design draft

Figma has a built-in annotation tool, but the problem is that you can only generate links for the entire project and send them to developers, who need to find the annotation page themselves. Not only is it cumbersome, but the load time can be long when the project is large.

Sketch has Cloud functionality to deliver, but it’s not perfect, and plugins are more often used to address this need. For example, Zeplin, InVision, Copy, etc., can upload the specified design draft automatically annotated cutting diagram delivery development.


The future of UI design software?


A sudden outbreak of the epidemic has greatly changed the way people live and work. Many companies have begun to try telecommuting, and remote collaboration has become a rigid requirement on the table. Overall, I’m more optimistic about Figma, which is cross-platform and has a relatively sophisticated cloud collaboration experience. Cloud is the future, and there will be more and more design software for layout cloud collaboration. For example, InVision launched InVision Studio and Copycat design collaboration platform launched by Domestic copycat team are leaders in the field of design collaboration. The race is still on for any software to become the dominant design tool of the future. Let’s see.