The AI that we are experiencing shows boundless possibilities. As designer roles evolve, repetitive tasks are being covered by Figma AI plugins. Let’s look at some updates to add to your workflow.
In June 2023, Noah Levin Vice, President of Product Design at Figma announced that the company acquired Diagram. It’s an AI company founded by Jordan Singer, a former Figma-geek who built a plugin with GPT-3 to generate design ideas with a simple prompt.
Instead of focusing on small repetitive details such as rounded corners for cards, Figma AI’s purpose is to take care of that. This way, we can spend more time designing smarter interfaces and even better user experience with fewer clicks.
With all the above in mind, Figma is incorporating the future by sharing some prototypes for platform updates that integrate AI.
We’ll go over each of them to explore their possibilities.
4 Figma AI Updates to Elevate Your Design Workflow
1. Figma AI Organizer
Don’t you love how post-it notes help bring ideas out while brainstorming? The challenge comes when interpreting and organizing those ideas into a coherent or actionable list. Well, Figma AI will do that for you in seconds.
You’ll just need to select all your sticky notes, click the button with a sparkling (magic?) vector icon and have all your data organized and categorized in a structured way.
This could work as proper documentation after a brainstorming session to follow up on the next creative meeting.
2. Design Recommendations by Figma AI
This plugin will generate design ideas with a simple written prompt. Let’s say you are designing the UI design for a music app and want to add a section with album covers and titles. You can just write "Albums" and wait for the magic to happen below that prompt.
It’ll take the fonts and styles you set up for your design system and will look for images that match the look & feel of your design.
Each prompt comes with multiple design options. You can navigate through different alternatives that could respond to your prompt.
3. Generate Production-Ready Code with Figma AI
Dear developers, your prayers have been heard. You guys might feel forgotten, but you have a special place in the hearts and minds of UX/UI designers like myself.
Figma now has an official plugin for Visual Studio Code, an open-source code editor developed by Microsoft. With this tool, developers will be able to select an element of the design and magically get it translated into code.
4. Genius Chat, a Figma AI Design Assistant
While working on a UI design we need to consider multiple things at once. Imagine you could focus on bringing your ideas out and start laying out your sketch wireframes into Figma while you have a virtual assistant to help you with repetitive (and sometimes annoying) tasks such as labelling buttons, resizing boxes and looking for icons. Genius Chat is being developed with that purpose in mind.
Genius Chat is an “AI design companion” that will pop into your screen as a real-time collaborator helping you while you are designing.
The prototype shows a virtual assistant ready to answer all your questions. For example, if you don’t know how to do something in Figma, instead of doing the same ol’ thing of Googling a tutorial, you can just ask Genius to give you the instructions you need.
Want to have a taste of this magic? You can already start experimenting with Magician, one of the AI tools for Figma available now.
Imagine all the time that this can save. What will you do with all this spare time? Maybe go for a walk, like you promise your dog every day.
Check out the video of the Figma Designing with AI conference to hear the full announcements and features.
Find Figma Templates on Envato Elements
Struggling to find the perfect Figma template for your project? Explore ready-made Figma templates on Envato Elements!
Envato Elements offers an unlimited download subscription to download as many items as you like. Choose from millions of digital assets including templates, icons, stock photos, royalty-free audio, stock video, and more.
Learn More About Figma
A world of learning awaits with Figma! Uncover fresh Tips, clever Hacks, and valuable resources to streamline your web design with AI workflow.
Check out these articles and tutorials from Envato Tuts+:
- How to Make Interactive Components in FigmaJanila Castañeda08 May 2023
- How to Install and Use Figma PluginsJanila Castañeda17 Aug 2023
- 15 Figma Wireframe Templates for Online Education PlatformsBrenda Barron21 Jul 2023
- How to Use Figma for Responsive Web DesignJanila Castañeda14 Jun 2023
The Future of AI is Now!
Figma’s vision is not for designer or developer roles to disappear, but to evolve. Maybe the boundaries of roles and hierarchy can now be blurred through active collaboration with AI tools for Figma and other design platforms.
The more I research it, the more I’d like to think of AI more as a possibility and less as a threat. It’s an opportunity for us designers to catch the wave when it comes to take our creative ideas further away.