As web designers and web workers, you probably heard about Sketch. So Figma is basically like Sketch. With one big difference. Figma runs 100% in your browser and lets you collaborate with your colleagues in real-time.
Pretty awesome, right?
So if you’re a regular reader of our blog posts, you might know that we love to review tools, software, frameworks, and other products. This time we’re taking a look at Figma.
Figma is a design collaboration tool. Basically, it’s similar to other known solutions such as Sketch, or Adobe XD. So why do I write this review? Well, because Figma has two main differences:
- It runs 100% inside your browser (no installation needed)
- It offers real-time collaboration with others (like Google Docs)
That’s pretty awesome. And most importantly, it’s stable. Real-time collaboration really is real-time.
The Story of Figma
Figma was co-founded by Dylan Field in 2013 and got a $14 million Series A back in 2015.
In a Techcrunch article, Dylan states that Figma wants to “do for interface design what Google Docs did for text editing.”
And he might be on the right track with that. Today Figma is available as a browser-based design tool.
If your entire design team runs on Adobe’s software or Sketch, you might wonder why you should give Figma a try. Here’s why.
Better Collaboration Between Designers. And Their Team.
As design becomes a collaborate process nowadays, more and more attention goes to the question on how designers collaborate with other designers and how their work is shared with other team members, colleagues, and clients.
Sharing files and different versions of design drafts through your chat or email program might be over soon. With Figma all your design work is produced, shared, and communicated in one place. Inside Figma.
Same Same. But Better.
So basically Figma feels pretty straight-forward. The features, shortcuts, and user experience feels pretty similar to Sketch.
Overall the UI and design tools seem copied from Sketch. So what makes Figma different?
It’s the collaboration part. It not only works for the production stage but also allows you to comment and collaborate inside your Figma projects. It’s like a combination of Sketch and InVision or your preferred design collaboration tool.
Getting started with Figma is easy. You just need to sign up for a free account at figma.com and seconds later you can start your first draft inside your browser. Pretty impressive.
If you already have a lot of .sketch files you can easily import them too. Importing a sketch file with 400+MB: easy.
Web-Based Version of Sketch.
So, when starting Figma for the first time you might have the impression that you’re using a web-based version of Sketch. And that’s absolutely true.
Figma seems to have copied a lot of UI styles and layouts from Sketch. And I guess that’s fine. At least for someone who’s already used to Sketch and do not want to start from the beginning.
When opening the same file with Sketch and Figma you’ll see the similarities on the first glimpse.
As I do really like the fact that Figma runs in the browser, I’m also a bit worried that this might become an issue with larger projects. My imported file already consists of 10+ pages, and my laptop isn’t the youngest which seem to slow Figma a bit down.
On the other hand, Sketch doesn’t seem to slow down even with larger files. I guess being a web app can also be a drawback. +1 for Sketch.
Compared to other design tools, I’d like to highlight what Figma calls “Vector networks”. To put it simply, it’s an enhances pen tool.
Vector networks are built on paths which allow designers to control bending, strokes, and fills for example.
If you want to learn more about that interesting feature, read Figma’s blog post.
Constraints allow users to specify how an object responds as the frame size changes. It works similar to Sketch (not really a big surprise) and allows you to set up rules within the constraints panel.
Constraints are pretty straightforward and they do what they are supposed to do. They people at Figma definitely did a great job here.
Real-Time Editing, Sharing & Commenting
What makes Figma really special is its real-time component. As it runs inside your browser, it allows your to edit files in real-time with other people.
I like real-time collaboration. No matter if it’s Google Docs, InVisionApp, or other collaboration software. Real-time collaboration with colleagues can be a real time-saver. Imagine the old days of sending Word files and PDFs via email to colleagues. Luckily those days are over 😉
I have to admit that I still have slightly mixed feelings about Figma. I think crafting a new design does not require real-time editing in the moment of crafting the design, however, it’s great to have someone take over after a design draft is done.
Or at least I haven’t seen two designers working on one file, where one designer is picking the color, while the other one is choosing the font. Things might change, though.
Sharing & Commenting
What I really love about Figma is the possibility to easily share files with your team. Sketch offers plugins to InVision and other design feedback tools, however, having this workflow within one tool feels pretty awesome. No need to switch systems.
All comments are stored inside Figma, and your colleagues are always up-to-date on the latest versions.
Wrapping it up.
Figma is a promising design collaboration tool. There’s a lot of buzz around design collaboration and with existing workflows in place, it remains to be seen how and if the majority of designers will adapt Figma.
Speed and loading times might be an issue for larger files (especially if you don’t have the best internet connection).
The future success of Figma will highly depend on designers behavior regarding real-time collaboration. Figma was built on the concept of designing things together in real-time. If this holds true and goes mainstream (similar to Google Docs) Figma will see a bright future.
Free Until the End of 2016.
So what else should I tell you. I think Figma is a pretty interesting tool which is worth considering. If you’re totally happy with Sketch, Adobe, and your design workflows. That’s fine. No need to change anything right now.
If you’re looking into alternatives to those mentioned ones, you might consider giving Figma a try. However, make sure to sign up before the end of 2016, as it’s free for everybody who signs up before Dec. 31st.
Let me know what you think about Figma in the comment section below!
10 Web Design Trends for 2017
This article is brought to you by Usersnap, a bug tracker and feedback tool that helps you to communicate visually. Get a 15-day free trial here. Update 2018: You can find the web design trends for 2018 in this article right here. If you’re still here to check out the best web design trends of…
22 top CTOs of German tech companies you should follow
In a couple of weeks, we’re going to spend some time in Germany. And we didn’t want to go there without a proper preparation. We wondered what the tech scene, especially the world of CTOs in german tech companies, looks like. Therefore, we put our heads together and did some research.
24 Amazing Web Design Blogs You Should Follow This Month!
A while ago, I published this collection of great web development blogs for developers. Since then, some web designers have approached us and suggested further blogs, specifically, web design blogs worth following in 2016. So this time, it’s all about web design. We’ve collected some of the best web design blogs around for you. Now…
9 creative ways to ask your website visitors for feedback
You’ve finished some design drafts for a new website. You’ve even shipped those new designs to your website. And now you wonder what people – your website visitors – think about those new changes. In this post, I’m going to show you 9 creative ways to ask your website visitors for feedback which will help you…