Figma as design system

Working with Figma for our design system

When we first started Minutemailer, Sketch was the thing. Figma is very similar to Sketch but all in the cloud. For the new and updated Minutemailer we are developing, we are using Figma for all design. Making it very easy to collaborate and work remotely.

All the design is made as one big project in Figma with different pages for the new website, the web app, admin interface, identity and marketing as well as a separate page for the design system where all the different UI elements are listed.

Our design system and preview of our redesign of Minutemailer as frames on a Figma page. We even make the images for this blog in Figma.

It makes it easy to implement the design in CSS and add it to our UI project on Github where we are using Storybook to view, test and develop all the components as code.

Our new icons in Storybook

There are three things I think is making Figma an outstanding tool for design.

  1. Multiplayer. Which means you can work simultaneously on the same document in real time. Not just updating changes but actually see what the other person is doing in the document. It’s a really great way of collaborating.
  2. Cloud based. You can easily send a link to a document or prototype and get feedback or send to a developer. It’s all in the cloud so no uploading or downloading necessary. All versions are saved automatically so you can always go back. Brilliant!
  3. Price. Figma has a very generous free account option. As a startup that is very valuable and means you can stay on the free account for a long time. Their paid options starts at $12 per editor which isn’t much if you need more. View the Figma pricing here.
Working with the flow and logics of an app is really easy in Figma with the help of multiplayer technology you can work together remotely which is perfect for our team. If you squint you can see the new interface for Minutemailer.

As a designer I still use Sketch for some cases but I really prefer the ease of use of Figma.

What do you use for your design systems and ux/ui work? Leave a comment with your thoughts.

Leave a Comment

Your email address will not be published. Required fields are marked *