Skip to main content
Brian_Clay
January 28, 2021

Interactive text inputs in prototype mode

  • January 28, 2021
  • 78 replies
  • 45816 views

Inputs are one of the most common UI design elements out there. But when you have to use them in a prototype there isn’t a good way to show what they look like when entering text. It’d also be great if we could trigger validation events like on a password input for example. This would bring more fidelity to my prototypes than just about anything.

78 replies

October 30, 2023

Thanks @Mustafa_Ahmed1

Figma really needs to add this feature asap.

Yanis_Azze
New Participant
November 6, 2023

I posted a request about this 2 years ago. Still not a thing?

Diego.Boella
New Participant
December 26, 2023

That would be a great feature for prototyping and usability testing

Pablo_Pardo3
February 13, 2024

Hey Max, thanks for the solution. I have the same problem, but how you add and create the new variable to avoid crashing all inputs simultaneously is a little confusing for me. Can you share your Figma file to get into? 🙏

Anna_Gingle
New Member
April 12, 2024

Figma has been around for awhile now and doesn’t have this yet?!

Julie_Yoon
May 7, 2024

Here’s a plugin that makes text into input fields with placeholders.

You can also connect what you typed in the input field to a different output field.

May 7, 2024

Considering how often a text field is used in prototypes to simulate typing, why not make ANY text field automatically typeable?

I’ve used a workaround that involves mapping all characters to a Key interactions but the limitation is we can use delete or space (because Space is used for Figma prototyping functions)

So yea. True input text fields!

Figmate
May 9, 2024

Hi @Johnny_Ceron, Thank you for sharing your thoughts with us! I noticed that there was a similar request from other community members. To help centralize the feedback and enhance the discussion, I’ve merged your post here.
Please take a moment to vote up from the top of this page.

Thank you for your contribution!

Ori_Harel
June 5, 2024

As product designer, I use a lot of prototypes that should simulate the user typing (Inputs, Docs, forms etc.) it would be amazing to have the ability to simulate the writing of text as a text animation in prototypes, like the typewriter animation in keynote (maybe even with an option to add a typing cursor)

Silvia_van_der_Heijden_Pinol
June 6, 2024

Please Figma, help us with this! its BASIC! you can do it