Figma AI was teased at their yearly Config event, showcasing features that blew the minds of everyone watching. It showcased some very useful features for UX/UI designers, developers, and even graphic designers to use. However, if you don't know how to get Figma AI in your own files, or how to use the tools effectively, keep on reading!
How to Get Figma AI For Free?
While Figma AI seems cool, most users won't get this update until they do a few crucial steps. The steps to get Figma AI for free in your files are as follow:
Make sure you have the latest version of Figma installed on your computer (in case you use the Figma App).
Create a new team in Figma - guide to create Figma teams. Again, you don't need a paid teams or professional account for this to work.
Once you're done with the previous steps, go ahead and create a new project in the teams folder.
Once Inside the project, you will see a small actions icon at the bottom right next to the comments button. (The action icon looks like a group of stars)
Clicking on the actions icon will bring up a modal window inside which you will see all the Figma AI options marked as "AI Beta".
Go ahead, try them out on different images, screens, and prompts.
In case you still don't see the actions icon in the file, chances are that Figma has still not given you access to its AI features. In such a case we suggest asking a friend or someone in the community to share their account with you. Otherwise, you will just have to wait for Figma to roll these features out to everyone.
Top Figma AI Features
Figma AI has a lot of cool new features that can be used for a plethora of tasks. However, which features are the best at helping designers out? Let's find out.
Rename Layers
Rename layers is a great time saver for designers. Most of us forget to name our layers properly and often find it confusing to navigate our files due to this.
Figma AI's rename layers can be found in the actions menu after you select the layers you want to rename. Figma automatically detects the nature of these layers and suggest smart and efficient names for your layers. If you like these changes you can keep them, or ask it to rename it again for somewhat better results. This feature is far from perfect, but gets the job done in content to your designs and files. If you have designed a button, Figma will detect it and name it as a Button or Button Container. At the same time, Figma can also detect if the container has a song name, and will assign the name song name to it.
Figma AI First Draft
One of the biggest features announced was First Draft. This feature essentially asks you for a description of your designs or project, and creates a website or app design based on your prompt. You will see Figma AI work in real time to construct a clean layout, add information and images, as well as properly style components for you.
This feature aims to get designers started quickly with a wireframe or get new layout and creative ideas at the start of their project. This saves a lot of time and repetitive work. For now, you can get basic designs, however they might expand this feature in the future.
Auto Add Information and Content
Designers often use dummy text or lorem ipsum style content to depict how real content will look. Figma aims to fix this by allows designers to rewrite titles and paragraphs based on the project's requirements.
Additionally you can even create images using generative AI to fill the image needs. Also, under the rewrite feature you get a bunch of smaller actions. These include translate, shorten, and expand. As the names suggest, you can translate text to any given language, shorten a lengthy paragraph or title, and even elongate a short one.
Figma AI Prototpes
Figma has a new prototyping feature that can connect multiple pages or slides smartly. For example, a CTA button will navigate to another screen which is relevant to it. AI can detect what elements are clickable and where they can navigate
Figma AI prototypes are essentially a good way to connect a large number of screens together to create a quick prototype. However, Figma is not able to add animations or interaction with AI yet. We do suggest double checking your prototypes for any errors or issues as well.
Visual Search
As the name suggests, visual search allows you to search for any asset or element just by describing it. This can help you out if you forget the name of an element and want to search by a visual description. For example - "big orange button" might bring up buttons which are big and orange in color in your search.
This is one of the most under-rated AI powered features and is a true hidden gem. You can access it by simply going into the actions menu and describing the asset in the search bar in the modal menu. You will get a "search assets for" option which you can click to activate visual search.
Image Maker & Background Remover Tool
If you have ever used generative AIs like Midjourney or Dall-E, you know how image generation looks like. Figma AI allows you to create or generate a unique image for your project based on a description. This prompt that you enter can produce different types of results based on how detailed your description is.
Another huge feature is the background remover. It essentially removes the subject from any image and gives you a clean image as a result. Figma already has some background remover plugins, however none are as accurate and quick as the in-built AI background remover tool.
There are a lot of other smaller features powered by AI, which you can learn about from Figma's own website.