Alternate titles: Live Preview.
The user wants to check how changes in form fields affect an end result as quickly as possible.
A collection of 54 User Interface design patterns, presented in a manner easily referenced and used as a brainstorming tool.Get your deck!
Let users preview consequences of an action before committing to it.
Update a preview of what modifying a form will result in throughout the entire interaction with the form. Instead of waiting for the user to submit the form, the changes are shown immediately in a preview. Each user event of significance results in a browser-side processing.
Previews make it easier for users to decide whether or not to commit to a change and thus invite safe exploration and playful creativity. Show feedback immediately in live previews to further spark fun, play, and exploration.
The result is increased interactivity. The user does not need to wait for page reload on a form submit to find out whether data was inputted correctly into the form. The feedback is immediate.
Hi Anders Toxboe, you have done a wonderful job here. I like the way itâ€™s presented with the examples & references that you have provided. I have come across some websites, where they publish as if they have founded it, but in this case, you seem to be very honest & intelligent.
Just a clarification, have you ever designed this pattern using JS or something else. I wish you should keep investigating & put your thoughts how we can do this better. By this way you can showcase your creativity to the world.
Wish you all the best.
Thank you for the nice words.