Jala Tech Talk: User Interface Design with Figma
In today’s edition of our tech series, we caught up with Sharan, our product designer here at Jala. He talks about Figma, and how useful he has found it for user interface design.
First of all, what is Figma?
Figma is a cloud and browser-based design software that we use for all our product design here at Jala.
I hear you are a big fan of Figma. Why is that?
There are so many reasons why I like using Figma. Here are a few:
- No software download required
Because it is cloud and browser-based, all you need is a weblink to open up the platform. This also means that your entire team can access it, regardless of their operating system. Another perk to being browser-based is that it allows team members to collaborate on a project regardless of their physical location.
2. Multiple users
Multiple stakeholders can view the design and interact with it. A viewer can leave a comment at a very specific point on the design without the hassle of having to download and install the software, and they can see the design exactly the way it is meant to be seen.
3. Ease of use
Figma is really easy to use! For designers familiar with Sketch, Figma is really similar, so the transition is incredibly smooth. The functions are incredibly straightforward, there isn’t much of a learning curve.
4. Prototyping
Figma allows you to prototype your UI designs. For example, when we did our mobile version of Jala. After I created the designs, I prototyped it on Figma. This means that the platform virtualises it, so it seems like a full fledged app. You can do actual testing without the need to code it. Prototyping was incredibly important to explain to the developers how things would work, and it made communication a lot easier!
Had you used Figma before you joined Jala?
No I had not. I came from a Photoshop background and when I first started I did some basic illustrations on Photoshop, which is not really ideal for UI design. It was actually Joceline Kuswanto from Kontinentalist, our sister company, who introduced me to Figma and it was through her that I came to know about how well equipped it is for UI design. It was not an easy transition for me, but I saw the difference and realised how important it was for UI design.
What is it about the design elements of Figma that you felt were very important for UI design?
I think what I found to be the most crucial was that Figma allows you to create master components. So, I use an atomic system which looks at individual components as individual elements that can be brought together to create an entire webpage. When you make a change to a master component, all the corresponding items will change. So for example, if you designed a button and made it a master component, if you change that master component, all the other buttons derived from that master component will be affected too. That way you won’t need to go and change all the different related items.
What are you currently working on, on Figma?
Right now, I am using Figma to build the blog section for Jala. I will be prototyping with Figma to see what the flow will look like. It’s really useful for the developers because it takes away the guesswork, and they don’t need to keep taking notes. If we didn’t do prototyping, the workflow would take much longer: they would look at the design and then ask me particular questions about the flow. Prototyping cuts out the guesswork and increases the speed at which the developers can work. Likewise, I save time on having to make notes on things like button size, font colour etc. specifically for the development team.
Figma also gives you the CSS. When you click on a particular element, it tells you the full properties such as font size, colours, positioning etc.
It really makes handoff between the designer and the developer much easier.
Any last comments?
I would say that Figma is not good for vector illustrations. For that, I would still advise designers to stick to Illustrator. But other than that, I am super happy using Figma and would definitely recommend it to other UI/UX designers out there!
And stay tuned to our new upcoming blog design on our website!
Thank you for reading our Tech Talk Series!
Disclaimer: Jala has not been sponsored by Figma to write this post. We genuinely find the platform to be useful for UI/UX design, and it has proven to be the most efficient platform for Jala’s design and development needs.
