Go Back
How to Use Content Reel Plugin for Figma
Figma

How to Use Content Reel Plugin for Figma

Pierluigi Giglio
October 1, 2023

Are you looking to spice up your designs with generative content that isn't just some boring lorem ipsum?

Or do you simply want to speed up the process of searching and adding real or random data in your figma designs?

The good news is that both these things are entirely possible with a new Figma plugin called Content Reel.

In this guide I'll show you exactly how this plugin works and how you can easily integrate it into your workflow to greatly improve your design speed.

You're in for a treat with this one, so let's get started!

What is the Content Reel Figma plugin?

Content Reel is a plugin that allows you to create custom content and share it with other Figma users.

You can easily search and apply text and images of any kind so that you can bring your designs to life with no need to add the old and boring Lorem Ipsum text that everybody is using 🙌

The best part about this plugin is that it's Free and it even allows you to create custom generated text based on data that you add in their custom library.

We'll show you exactly what we're talking about in just a second, now let's talk about how to use this plugin.

How to Install Content Reel in Figma?

To add Content Reel to Figma you'll need to head over to the Figma Plugin Directory.

Next, search for the "Content Reel" plugin figma and you should be able to find it right away:

Now, click on the plugin (it's the one by Microsoft and Eugene Gavriloff) and click on the blue button on the top right "Try it Out":

Now the plugin will start to download and it will shortly be available on Figma to be used.

If even after downloading it you don't see it in your Plugins menu, simply restart Figma and the plugin should be visible:

How to Apply Text with Content Reel

Now let's see how to apply some realistic text to a dashboard design by using Content Reel.

Before we get started, just be sure to login to Content Reel to have full access to the plugin.

Once that is done, we'll select a bunch of text fields from a column that is located in this screen:

Then, we'll open the Content Reel plugin and we'll select the Text panel:

At this point, we are greeted with a bunch of options. You can easily add any type of text layers within this column, such as emails, full names, numbers, dates, currencies etc..

Just select one and the entire column with the selected text will magically be filled up with that specific text type 🪄:

The best part about this plugin is that you don't necessarily need to guess what a specific text group will contain, simply because you can click on any category to see what that specific category contains content-wise, just as you see in the picture above

Just be sure not to have any layers selected when you do this, otherwise it will apply it to that very layer.

So, as you can see applying text with Content Reel is a very straightforward process that can easily save you dozens of hours during the year (I know this from personal experience, being a designer by trade).

How to Apply Images with Content Reel

If you thought that Content Reel might be useful just for text you're just about to be pleasantly surprised 😉

In fact, with Content Reel you can easily add images to your mockups in figma in just a few clicks.

As in the first part, simply open up Content Reel and login.

Now, click the Image tab to select that content type:

At this point you can select your own content and visual layers where you want to add the Content Reel images and select the image category that you desire:

Just like magic, Content Reel will apply the images to the layers you selected, helping you make your figma designs more realistic.

How to Add Icons with Content Reel

You can also apply Images by using the Content Reel plugin, and it's a relatively easy process.

First of all, you need to open the plugin and go under the icons section:

Here you will be able to filter by Favourites or All icons.

Once you made a selection, click on one of the icon libraries available and you will be redirected to a page with all of the icons that are contained in that very library:

You can simply click on any of the icons and the icon will pop into your figma file in SVG format.

On the very top right-hand corner you will also be able to decide the dimensions of the icons, deciding between Small, Medium and Large icons.

Create your own text or image with content reel

Not many know that with Content Reel you can create and manage your own text or image content, as it’s saved for you to use over and over again.

You can upload up to 20 images in PNG or JPG format and each image file size must be under 300 kb.

In order to create custom text data or images, simply click on Add: by doing this you will access the menu that will enable you to create your own text or image content.

At this point simply click on the Add button and select between text based or image based content:

Once you made a selection, you will see a new window appear asking you to add the title of this data set and the Text or Image content items (which will be the actual data that you will see displayed in your data set).

You can also decide if keeping this data set private or public, which means that anybody in the Content Reel community will have access to it - this decision is entirely based on your personal preference.

Congratulations, you just created your very own content data set!

The best thing is that this content is reusable at any given moment.

What is the favorite plugin for adding content into Figma?

After using Content Reel for over 4 years, and having tested many more of these generative placeholder plugins, I can say that Content Reel is my top recommendation for designers.

In fact, as you saw not too long ago, Content Reel is one of the best figma plugins to generate placeholder content and dummy text containing real or random data.

As a designer by trade I understand that these days there are countless plugins that can create realistic content, but out of the ones I tried in the Figma community content reel happens to be my favourite to add placeholder text and dummy content in general.

And it's a great plugin for both personal use and commercial use.

You could even use this plugin to help you spice up a design system, so that you don't need to rely on the old and boring lorem ipsum text.

We hope that this guide was helpful, if you want to learn more about Figma we have many free articles available, as well as a vast catalogue of videos on our Youtube channel.

ABOUT THE AUTHOR
Pierluigi Giglio

Sr. UI/UX Designer and Consultant with over 10+ years of experience working with Fortune 500, large enterprises and funded startups. Having worked on hundreds upon hundreds of design projects, collaborated with 40+ clients from all around the world and taught design to thousands of students I am very grateful that I have the opportunity to give back to the design community and help other become better designers.

Enjoyed this read?

Stay up to date with the latest design news and cutting-edge softwares, sent straight to your inbox!

Thank you! Your submission has been received!
Oops! Something went wrong while submitting the form.