Masks work: Helping users enter data correctly

Alexander McIlwraith, UXC
4 min readNov 6, 2021

Early in my career, a large part of my job was helping researchers collect digital data in a university psychology department. Initially, I continued doing what the department had always done. But as I continued talking with researchers about the data that they were getting back, I started asking the questions like “How are you going to analyse that?”

I also began to see that we had two user groups. We had research users who use data and participant users who provide it. My goal became to see how we can help both user groups by collecting data more effectively. I proposed that our department look at the research data for common data issues and develop some best practices for how we help researchers set up their research collection. We began building some objects to allow them to collect research data in a standard way.

Many researchers, for example, collected participant’s age as demographic data. We changed how we were asking for this information because we saw that we had almost as many different ways of entering this information as there were participants. For researchers, this meant time spent editing their data before they could analyse it.

Helping both groups

What we found applies to helping any type of user use our products. To help collect information more effectively, there were two ways we can approach this task. We can fix the data on the back end or we can format the data as the user enters it. Fixing the information on the back end helps those who have to use the data, but does not help users who have to enter it.

And the data we collect needs to be useful. We still need it in a format that the computer doing the back-end processing could understand. If the data you are working with is rubbish, that’s what you are going to get at the other end. In the example of psychology research data, asking with a simple text field was just that. We were asking our participant users to supply us with rubbish — or perhaps more recycling because the researcher could re-enter the data — when we allowed them to enter it in any format they wished.

For the psychology research data, we opted for doing both. To make it easy for participant users to enter information we provided two fields, with numeric masks, for years and months, and because arithmetic is easy for computers, we formatted the total number of months on the back end. This meant that researchers would have the option of which fields to use when they did their analysis without having to create a column and do a calculation.

We could also have collected just months, but the cognitive load of calculating your birthday in months is high. Unless the mental exercise of dealing with your birthday in months or some other strange way was important to the rest of the research, there was no reason to make the task harder for the participant user than it needed to be.

The front end helps users

Providing assistance to help users understand the required format, masking text fields and using appropriate input controls reduces the room for errors. Showing users how data needs to be entered reduces cognitive load and guessing what is expected. It helps to reduce errors and user frustration.

One of Jakob Neilsen’s usability heuristics states that, while good error messages are important, preventing users from making mistakes in the first place makes for a better user experience. Research from the Baymard Institute shows that more than 80% of users will pick a different way of entering the same type of information even when they have seen an example present. Their research also shows that 64% of websites don’t use masks that can help resolve this problem.

Since that time, I’ve run into many cases where it is important how the user enters information. Tactics such as masking to format information helps the user, where formatting on the back end might leave the user wondering.

Post Codes, postal codes, zip codes and phone numbers are often used to identify people or verify they are who they say they are. When they don’t match what is on file can cause frustration, especially when they already have to figure out which one they used (mobile or landline, home or business).

If users find themselves asking if they need to include the space and if capitals matter, you’ve found a good case for an input mask, fixing it for them as they type. At this point, users are used to having things corrected for them — sometime to amusing effect — so this is not odd behaviour to avoid.

Yes, this can be more work for developers. However, it may be worth the investment to improve your user experience. If you are going to level up your product, taking the time to help users enter information correctly will decrease frustration and speed them on their way to completing their task. It will help ensure you get clean data. And for your users, it will help to take your product from being a good product to a great product in which your users delight.

--

--

Alexander McIlwraith, UXC

Feet in the clouds, Head on the ground … writing on user experience and leadership.