Bad Form Design: “First name must be at least 4 characters”
How small UX changes in form design lead to big user impact
Question: Should there be character limitations on first and last name input fields in a form?
My answer: Absolutely not. Well, let’s walk through this…
Last week, I was on the City of Chicago official city website for contesting citations. I had received a parking ticket while parked at a broken meter box. According to the city ordinance, I was allowed to park for free if I report the broken meter within 24 hours.
To contest the citation, I needed to fill out a form that included the ticket number and my personal information. And this is where I discovered a “funny” UX problem.
After filling out the form fields and clicking submit, I was met with an error message that prevented me from proceeding: “First Name must be at least 4 characters.” From the screenshot, there are 2 problematic issues to address:
- First Name is not a required field because there is no asterisk (*) next to it to indicate that the form field needs an input.
- There is a character minimum for the form field.
In the field of human-centered design, small details like this really affect the end-user experience. There are at least 220 three-character names. This is dehumanizing in a way because the system is deeming someone as unreal, or invalid.
Required Form Fields
According to the Nielsen Norman Group, using an asterisk to mark required fields on forms is an easy way to improve usability. Take Sephora as an example, when signing into your account, it is required that you input your email and password. These fields are indicated with an asterisk.
Given this almost universally understood indication of a user requirement, let’s look at the City of Chicago’s form again.
Last Name, Email, Re-enter Email, and Date are followed by asterisks, which would indicate that those fields are required. This means that First Name and Mobile Phone number should in theory not be required. However, in my experience, a First Name (that met the character minimum) is required.
Here’s I would redesign this:
- Indicate a form field is required with an asterisk or ‘required’ text.
- Check that required form fields are indicated.
- Include failing feedback to highlight mistakes such as empty required fields, invalid email (e.g. when the email doesn’t contain an ‘@’), etc.
Providing indications and user feedback on a form, even if the form seems short, helps the user meet the requirements when submitting. There’s nothing more frustrating after filling out form fields than meeting an unexpected error.
Minimum Character Limit
In theory, there should not be a minimum limit for name lengths to allow the user to enter whatever their valid real name is. For example, Ian, Ivy, Rue, Kit, and Ash would have similar problems submitting the form as I did, assuming their legal names were also only 3-letters long.
In practice, this ideal would be a little harder to implement. Take Facebook’s name constraints that they enforce:
Your name can’t include:
- Words or phrases that go against our Community Standards (example: slurs, representing dangerous individuals).
- Words or phrases that represent organizations instead of persons.
- Symbols, numbers, unusual capitalization, repeating characters, or punctuation.
- Characters from multiple languages.
- Titles of any kind (example: professional, religious).
While length is not explicitly mentioned in the list, Facebook user names are required to be between 5 and 50 characters.
Why have a limit at all?
Character limits are part of technical limitations that *should* get surfaced in developer-designer collaboration. 2 reasons would require a system to require lower and upper character limits: security and storage.
Input should be validated to ensure it is of the correct type, length, format, and range. That way, when users log in to access information, it can be verified through the database. A vulnerability that allows for users to freely input fields would cause messy data and potentially bots to break into your system.
Storage is a practical application of maximum character limits because it would be impossible to store a name that is legitimately 1,073,741,823 bytes long. Fun fact: the longest person’s name is only 747 characters long.
Here’s how I’d redesign the experience:
- Remove the minimum character requirement.
- Implement a maximum character requirement that works for the majority of names in the database — perhaps 50 characters is a good start.
Conclusion
As a UX designer, I often find these hiccups in user journeys quite hilarious. They’re totally an eye-rolling and “I could do better” moment for me as I proceed with my task.
Despite my legal name not meeting the criteria, I was able to submit the citation contest form by filling in my first and middle name into the First Name field. Ideally, an important process established by the city would have a better experience for filling out the form. This could include hovering info icons, fail feedback, and field requirements properly indicated. But until then, we continue the stigma that government paperwork is a pain in the butt to complete.
