Skip to main content

How to Use Templates in Figma: Alerts

Maximize efficiency in Figma by learning how to utilize pre-built templates and UI kits, jumpstarting your design process with professional, reusable components.

Alerts are essential to prototyping, mainly if your project involves much decision-making during the User Journey. In this tutorial, we will explain this aspect of the template and how to use it.

Alerting Me From What?

If you’re unsure about what an Alert does, I’d be like: Are you sure you want to send that text to your ex? or something like: Do you want to post that picture? In reality, an Alert won’t say that, but you got the point; it’s a feature that makes sure you are making the right decision; it is an interface principle known as Safety and will appear in front of you as a huge textbox.

For example, let’s say you are designing a shopping application that must lead the user to buy something; let’s say the user changes their mind and wants to cancel the purchase. Before doing this action, an alert should appear trying to change the user’s mind and get them back into the purchase. Another example can be when you accidentally click on delete something important before acting; an Alert appears to save your life.

NOTE: We suggest checking How To Understand Interface Principles to learn more.

In this case, we’ll be using an iPhone template.

As you see, the Template will provide all the visual options you can get when adding an Alert. For example, how light or bold do you want the text to be.

In the Molecules section, you will find what the Alert box looks like and its different presentations. The word “Action” in the template represents where the command will be. 

NOTE: Keep in mind this is a Template for iPhone, but most templates should include this feature; in case they don’t, look for another template that has it and copy/paste

Now you know the importance of using Alerts in your prototype and how they can be life saviors. So explore, have fun using Figma and stay tuned!

About Author

More from Our Blog

[

](https://www.skillademia.com/blog/doordash-vs-uber-eats/)

DoorDash vs UberEats in 2024: Which is Better?

Read More »

[

](https://www.skillademia.com/blog/cash-giraffe-review/)

Cash Giraffe Review 2024: Is It Legit?

Read More »

[

](https://www.skillademia.com/blog/how-to-make-100-a-day/)

15 Proven Ways to Make $100 a Day With No Experience

Read More »

[

](https://www.skillademia.com/blog/instant-sign-up-bonuses-without-direct-deposit/)

12 Easy Sign Up Bonuses with No Direct Deposit in 2024

Read More »

[

](https://www.skillademia.com/blog/online-jobs-for-teens/)

16 Proven Online Jobs for Teens in 2025: Make Money From Home

Read More »

[

](https://www.skillademia.com/blog/kashkick-review/)

Is KashKick Legit? 2025 Review of This Money-Making Platform

Read More »

Start free

Get free access to our beginner courses

Drop your email and we'll let you know the moment each free course is live - plus new courses and deals. No spam, unsubscribe anytime.

Master Figma from start to finish

This is one lesson from a much larger course. Get the full course with a single one-time payment and lifetime access.

Explore the Figma course