Figma Profile picture
Feb 6 7 tweets 3 min read
Working smarter, not harder also applies to prototyping. 😉

Here are six #FigmaTips from Designer Advocate @_AnaBoyer for prototyping in Figma.

1/ Draw prototyping links from navigational components to reduce the need for repeatedly drawing connections.
2/ Create interactive components in your libraries, so designs that use those components already have micro-interactions built into their prototypes, adding an additional level of fidelity.
3/ Nest interactive components to reduce the number of prototyping links.
4/ Use sections for state preservation when navigating between sections of your prototype.
5/ When creating two subsequent transitions, use ease in and ease out for a more natural feel.
6/ For user testing, organize separate designs into flows and utilize their descriptions to provide guidance to research participants.
You can also use observation mode to observe and follow how the participant is interacting with the prototype.

• • •

Missing some Tweet in this thread? You can try to force a refresh
 

Keep Current with Figma

Figma Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @figma

Dec 15, 2022
A few months ago, @linear experienced a DDoS that took down their freshly redesigned site. 💔

We spoke with their team about how they got the idea to make their homepage their Figma files, unintentionally throwing the Figma party of the year…

bit.ly/3FWkvJa
A few days prior to launch, @pacocoursey had teased the team's in-progress Figma files. Was now the perfect opportunity to finally share them with the world?

When their site went down, @jorilallo suggested forwarding their homepage to a public Figma file, and soon there were over 300 people swarming their designs… Image
Read 5 tweets
Dec 13, 2022
The Figma Designer Advocate team will drop one #FigmaTip a day over the next ten days to help you level up in Figma...

...and we're threading them all right here! 🎁bit.ly/10daystips
Read 6 tweets
Jan 25, 2022
When you’re living and breathing Figma and FigJam, quality improvements can have a big impact on your workflow. 💪

Thanks to all of your feedback, we have 32 Little Big Updates to help you stay in the flow!🤩

Check out all 32: bit.ly/3g2TWnH
1/32 Need to upload those iPhone pictures? No problem, HEIC uploads are now supported in both Figma and FigJam 📷

@Bec
2/32 Don’t let us slow you down → We’ve made some fixes so that in many cases text editing is faster in Figma and FigJam 🏃‍♀️
Read 33 tweets
Jan 24, 2022
We've hidden something "insanely great" deep in the Figma archives. 👀
First person to find it gets Figma swag. 🙌
.@grantgarrett solved the mystery! But it goes a little deeper than this, if you can figure it out....

Read 4 tweets
Oct 26, 2021
As part of today's prototyping launch, we’re excited to announce that interactive components are available to everyone. 🥳

During the beta, we were blown away by what our community created.

Interested in getting started? Check out these examples for inspiration…
1/ Try using interactive components to create UI microinteractions at scale. @abelfhancock has made it easy for you to get started.

Duplicate the Figma community file: bit.ly/3m5aAqM
2/ Create your own pixel art in Figma using interactive components.

Choose between two themes: Figma and Retro to create the pixel art of your dreams.

Community file by @lichinlin: bit.ly/2ZdOZTW
Read 7 tweets
Oct 26, 2021
It’s prototyping day!

We’re excited to announce that interactive components are now available for everyone to use. Plus, we have some other updates to make your prototyping life easier.

Read about the updates on our blog: bit.ly/PrototypingUpd…

👇
1/ We’ve added a shortcut to toggle between the design and prototyping tabs.

Speed up your workflow by using Shift + E to easily navigate between the tabs in Figma.
2/ We’ve also made updates to copy and paste interactions for prototyping.

You can now copy prototype interactions and paste them into frames, reducing the amount of repetitive work involved with building prototypes.
Read 5 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Don't want to be a Premium member but still want to support us?

Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal

Or Donate anonymously using crypto!

Ethereum

0xfe58350B80634f60Fa6Dc149a72b4DFbc17D341E copy

Bitcoin

3ATGMxNzCUFzxpMCHL5sWSt4DVtS8UqXpi copy

Thank you for your support!

Follow Us on Twitter!

:(