If Figma needed a cheering squad, we would totally sign up for it. We love Figma, really we do, and we are pretty sure you will too! Sharing Figma with you kind of feels like when you've watched a complete series and tell your friends about it, and they have never heard of it before, and you are excited for them to go through the experience but also kind of jealous (only a little) that they get to relive it from scratch. So yeah, we really are excited for you. It's going to change the way you build, prototype, share, collaborate and more.
Before we continue to talk about all Figmas fantastic possibilities, here's something we prepared earlier to show you the amazing possibilities of Figma: our webinar titled "Build and prototype an app using Figma"! This webinar is super practical, and our expert Dina Korkmazova closely guides you step-by-step so that you won't feel left behind.
So, let's quickly recap on what the difference between UX and UI is.
What is UX?
UX stands for "User Experience", this refers more to the back end like the research, concept stage and defining how to optimise the user's experience while navigating through a website or app. Essentially a UX Designer is responsible for how things work, solving problems and making the life of us - internet users - effortless. For example, the UX Designer will need to consider all the aspects of the product design from start to finish and primarily focus on the interaction between the user and the product experience by using various techniques like storytelling, customer journey mapping and creating personas to ensure that the experience flow is as intuitive as possible.
What is UI?
UI stands for User Interface; this specifically refers to the visual aesthetics of the website and app, so how things look. The UI Designer is responsible for how the product is visually organised and communicated and will design each screen or page to interact with. Further, the UI Designer must ensure that the user interface correctly visually expresses everything that was thought of by the UX Designer or team. For example, think of the app Tiktok. The UX Designer will create the sign-up and onboarding process for new TikTok users, like, which screens are needed, which buttons, which information comes first. And the UI Designer will be responsible for visually executing it by creating interfaces fit for the desired user interactions.
Figma is one of the most effective design tools currently available to us and has really rivalled the famous Adobe Suite and many other popular design prototype tools like Sketch. So if you're looking into becoming a UX or UI designer, Figma is undoubtedly the app for you.
Figma, our modern-day hero
Figma's robust features, excellent design and code generation tools truly support the teamwork design process. This is largely attributed to its cloud, online, and real-time collaboration functionality, which saw its popularity skyrocket during the Convid-19 pandemic, collaboration was still possible for UX and UI Designers, Graphic designers, students and other professionals (bless you, Figma, bless you!). So why not make your life easier and start working with Figma now!? You can design stunning apps, blogs, or websites in no time and without any code at all; whether you are a beginner, web designer, app developer, entrepreneur or freelancer, you can create responsive designs using Figma.
From Sketching to prototyping
Usually, the easiest way to express an idea when you first have it is to start sketching. This is how to get the very lo-fi version of your vision or idea. From there, you start building your prototype. A prototype is essentially a "pilot project" and is expressed through a mock-up or demo of what a product will look like and is often used to test a product concept and make further iterations. Remember, this is not the final product, but rather it should allow users to interact with it to be responsive, so it brings your static idea and sketch to life. Therefore, the main goal of a prototype is to provide a simulation of the user interface interaction.
Responsive web design
The layout of your prototype will adapt based on the device size and capabilities; this doesn't mean you have to consider every single device. Instead, it would be best to make decisions based on what is most used, for example, android and iPhone minimum or maximum pixel size etc. Thankfully Figma allows us to see what a design looks like at different sizes. You will see that from the menu, you can choose between seven other popular phones (iPhone, Galaxy, iPad, etc.), three different tablets, a desktop view, or smartwatch. Simply dragging the edges of the design document to fit the frame gives you an exact idea of how it will appear on a specific device. Lastly, it has a clever function that can connect to your smartphone so you can see how it looks on the physical device as you design.
When you're designing a prototype on Figma, there are five main things to consider:
Screen real estate
User context
Goals
Surroundings
Consistency
Interactions and animations for Prototyping in Figma
This might sound a little out of your comfort zone, and you might automatically think of a Pixar movie or favourite cartoon but trust us for prototyping; it's more straightforward and super effective. Animations and interactions go hand in hand with a user's micro-interactions. Why? Because they guide the user in understanding how to optimally use the product. So, these animations aren't just fun features (even though they are fun). They are powerful tools for creating an effective prototype. Figma even allows users to take pictures, sketch or image and turn them into interactive prototypes, or you can build your screen design using the design panel.
Have you downloaded it yet? No? Wait no longer and click here. And the cherry on the top is, it's FREE for beginners. So, why don't we get started? You have nothing to lose, and as we said, there's no coding needed and a plethora of possibilities!
Finally, if you're seriously serious about learning how to use Figma and want to take it to the next level because...
you want to become a professional UX/UI Designer
you want to be that employee that everyone loves for making your company look spectacular
you wanto to have amazing job offers popping up on your Linkedin
...then check out our UX/UI Design bootcamp!
