“You can create connections from multiple objects to the same destination frame at once — saving you time and effort when building out your prototype flows. To do so, select multiple starting hotspots on your canvas, then click and drag the + icon to the destination.” See Nikolas Klein showing the feature in action, or watch “Office hours: Prototyping like a Pro” below for a deep dive.
Ana and Miggie are back streaming their experiments with Figma prototypes. This time they cover drag interactions and video among other things.
A Twitch stream of Ana Boyer and Miggi Cardona diving deep into Figma prototyping.
As always, Vijay Verma pushes the limits of Figma with a fun experiment based on Auto Layout and an animated prototype. Great to see how easy it was to build and control.
Another fun experiment using @figma prototype. I made this small head rig last week. Creating this was lot of fun 😍. By using cavas as masks and combining with autolayout, I created this so quickly. Sharing behind the scene below 🧶 pic.twitter.com/funSf3WtuD
— vijay verma •ᴗ• (@realvjy) November 1, 2022
“Figma prototypes are now accessible for screen readers. Learn how to turn on accessibility mode and how Figma design elements are translated to HTML for screen readers to interpret and understand the content and interactive elements in a design file.”
“Video gives us the ability to enrich any user experience, making prototyping with real media crucial. In this tutorial, we’ll go over the basics of how video work in Figma, and use them in both simple and complex designs.”
Alex Oyebade shows how to use videos in prototypes.
Using Figma’s New Video Feature!@memorisely @figma pic.twitter.com/79Am8LMYwP
— Alex Oyebade (@iamalexoyebade) October 17, 2022
Free plugin to convert any website into a fully editable Figma mockup. Not building each element from scratch is a huge time-saver if you’re picking up on a project with outdated or missing design files.
In this video, Figma Bites teaches the basics of prototyping in Figma and covers interaction details, navigation options, multiple flows, and more. By the end of this video, you’ll be able to create stellar prototypes that help convey your ideas interactively.
Two more updates to prototypes: drag to select multiple interactions to edit or delete all at once, and create interactions from any edge of an object for easier-to-read prototypes.
Now you can incorporate videos into Figma prototypes for richer, more realistic experiences. Videos can be viewed on any Figma plan, but only users on paid plans can upload new videos into files. See the playground file for more details.
“Coordinated, moderated usability testing takes time. Maze makes it faster and easier with unmoderated user testing! In this video, Pamela Porto provides a step-by-step tutorial on how to create a usability test in Maze with a Figma Prototype.”
Wire Box converts your high fidelity designs into low fidelity wireframes. I couldn’t see why this plugin exists until hearing about other people’s struggles with providing feedback on a “perfect” prototype made with a design system.
Elizabeth Alli shares how to embed an interactive Figma prototype into Notion.
Figma opened up the prototype screen reader beta to everyone. The feature was announced earlier in May. “The beta includes screen reader support for text nodes, alt text for images, and the ability to interact with prototypes with buttons and keyboard actions like tabbing.” Here is a quick preview using a macOS VoiceOver.
Gary Simon created an accessible app to help his dad. An entire thing is based on a Figma prototype. Hope it worked out well!
Sprig makes it easy to conduct high-impact research with your users throughout the entire product lifecycle. You can easily run concept and usability testing on one or many Figma prototypes within the same Sprig study.
Zander Whitehurst shows how to create a cool interactive carousel in Figma. See also his quick video “Wireframe to Landing page” where he uses that carousel in a landing page design.
🎠 Designing curved carousels in @figma, supafast! pic.twitter.com/lcYnvc8dCM
— Zander Whitehurst (@zander_supafast) July 27, 2022
A great-looking game made entirely in Figma. The creativity of this community never stops surprising me.
Prototyper is a new plugin from the team behind Automator, offering powerful prototyping with JavaScript right in Figma, similar to the old days of Framer Classic. A really powerful combo for exploring ideas and building prototypes in higher fidelity.