How do you show populated values in forms?

Question

I’m trying to improve the consistency in form designs (for tickets) while informing all members of the team (design/dev/product) of the type of answer that would make a specific input field ‘completed’. I would like you to think about how this would work in a summary page as well.

For example if the input field was ‘Account holder’s name’, which would be a more efficient populated example?

a) Mr John Salt b) [Mr John Salt]

Ive been moving towards ‘b’ as I’d like to show that this is an example (even though 'a)' works as well). This potentially works better in a situation where the value may be a numerical value like a ‘[value]%’ or one of several options from a radio list like '[Yes/No].

Thanks

Answer 1

Option A is the correct one.

That's the idea of mockups, to test with similar content to the one you'll finally use. With Option B, by consistently adding punctuation signs, you're actually conveying those fields will require that specific sign to be used, which of course is wrong.

If everybody know it's a test, there are no additional requirements, just use placeholder text as intended

Answer 2

Agreed - rather than showing a "variable" state for each field, it might be better to show multiple states of the form with different, properly representative content in each to show the different options (this is just a quick n dirty idea):

If there are different formats you want to try, do a couple of states in each format and A/B test them with your users to see which makes more sense them.