3.3 KiB
weight, title, date, lastmod, draft, author, description, images, resources, tags, categories, lightgallery, toc
| weight | title | date | lastmod | draft | author | description | images | resources | tags | categories | lightgallery | toc | ||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|---|
| 1 | Using Check Digits for Better UX | 2020-06-20T00:00:00Z | 2020-06-20T00:00:00Z | false | Spencer | How using a check digit can make for a better user experience in key entry scenarios. |
|
|
true |
|
Recently I was tasked with creating a website for my sister wedding, historically hosted here (try 123456789 as an RSVP code). One of the features required was an RSVP system so guests could easily inform us if they were coming and if they were bringing a plus one. A code system seemed to be the simplest approach including each guest's unique code in the invitation which they could then use to RSVP preventing just anyone from RSVP'in to the event. The first problem to solve was knowing whether to prompt them to input plus one information since I wanted to keep the whole process down to a single network request for simplicity. Using a check digit ended up being the perfect solution for this while also including the benefit of reducing the chance of a guest accidentally inputting the wrong code and becoming frustrated when the request wouldn't go through.
How do check digits work?
For those that don't know how check digits work the process is pretty simple. You simply include 1 extra digit to the end of any code or id that is generated using some formula. Usually a modulus is used to reduce the result to a single digit.
How I used check digits
In my application I leveraged check digits in 2 ways. The first is by not presenting the RSVP form until a possible RSVP code is inputted. This stops the user from entering the rest of their information until they get to code correct without of the need of an additional network request. A single mistake will result in the form not opening and them being required to recheck their input. Multiple mistakes could result in the form opening if they happen to be particularly unlucky however the server does validate if the code later and will reject the request if it is not correct. The other way I used a check digit was to solve my original problem of when to present the plus one form. By using a secondary check digit I could actually run 2 checks on the code and if they both passed then the user would be presented with the plus one section. The best part about this solution is that it doesn't require a timely request to a server and the additional infrastructure and security considerations that go along with that. There may be other security concerns however.
Security concerns
Obviously there may be some security concerns with using a check digit the fact that it reduces the overall number of possible codes for a given code length. This is of course true because you can't take the check digit in account when calculating the total possible codes. So if before adding a check digit your code was 6 digits long and therefor had a million possibilities then after adding a check digits this would be the same. In my application I was using it for a small wedding on a non critical system and I used Re-Captcha as a second set of security so that possible codes couldn't be brute forced. Overall using check digits ended up being a simple solution to my problem and the whole system ended up working flawlessly.