I made my own Figma UI Kit and this is how it went

Figma is a web-based design and prototyping tool that a lot of designers turned to as an alternative to Sketch. I started to notice Figma around a lot more around and the team is constantly putting out features that simplifies your workflow. Then I knew that I should give Figma another chance and I am glad I did.

I will be honest, I tried Figma before and did not enjoy it. I did not feel like it was the right tool for me. However, I like to be comfortable around multiple design tools because I never know what the next team member will be using. That is why I decided to make my own UI kit in Figma and here is how it went down.

I decided to make a simple Job Search App with multiple components to edit. I ended up having over 30+ components. Let’s break down my experience with components library.

Figma makes working with components extremely easy. First of all, scaling made me very happy. Whenever I work with other apps, I noticed that they may not scale text particularly well. It is rather annoying because I have to go through the trouble of making overrides and it defeats the whole point of having components in the first place. Figma’s scaling is very nice and components are very responsive, unless I am making some crazy scaling, then I had to override.

Local Colours and Gradients are nice and intuitive, there was nothing new here. Though, it was sometimes annoying that I had to name each one, can you imagine having a lot of colours? It is not a big deal but it can get in my way.

Overall, I had a very pleasant experience working with components in Figma.

Moving onto the the prototyping. Now, this project did not really require me to do any prototyping. However, I did try it out and it is good for some basic prototyping, however, I do feel that I will have to use inVision if I want to create complex prototypes. I know that they introduced workflow for Principal to create those complex prototypes. However, Principle does not allow me to share my prototypes with clients for them to show off to their investors/teams without them having to have Principal installed. I could be wrong and if I am, please correct me.

It is not a big deal for me personally because I am used to having everything imported to inVision anyway but inVision studio has an upper hand in this battle.

There were a couple of issues, I ran into. For example, the left toolbar does not have mirroring/flipping and you have to use a hotkey for that. It was a minor inconvenience, when I could not find the tool I needed at first. After I discovered a hotkey, it was not a problem anymore.

Grids were giving me a lot of trouble for some reason. This project just refused to apply a grid/pixels for me, not sure why.

My biggest issue was that my projects were unavailable when I was offline. Now, I understand that it is a web-based tool and that is to be expected. However, it is the biggest deal breaker for me because sometimes I could be working in a place that does not have internet connection (crazy thing to say these days but it happens).

Overall, Figma is my to-go tool from now on. I cannot express how much appreciation and love I have for it. I would really love to thank the team for thinking about their client base and really listening to the community. If you have not tried Figma yet, do yourself a favour and try it, it is simply amazing.

Thanks for sticking around until the end and here is a link where you can find my UI kit, it’s free so if you like it, you can download and use it :)