UI gore: Token Transit
"Token Transit" is a cell phone app that allows you to buy bus passes. The pass is displayed on the screen, and you can show the driver this pass instead of paying cash. First off, I'm extremely grateful that this is even an option. The bus in my hometown was cash-only. You could buy passes with a credit card at the bus station, but it was only open on weekdays for a limited amount of time. The ability to pay for bus fare whenever I need it without cash relieves a huge logistical burden, especially in the town I live in now, where the nearest ATM is around an hour's walk from me.
But this app has a problem that's been on my mind, so it gets the honor of being the first "UI gore" subject. By "gore" I just mean "a very bad example of". Where "UI porn" would be an example of a user interface that's lovely and well-designed and extremely functional, UI gore is the opposite. I forget where I first heard this terminology, but it's a nice succinct way to identify it.
My debit card expired in November, which was no problem. My bank automatically sent my new one well before the end of the month, and all I had to do was call the number on the sticker on the front the card, enter my PIN, and the card was activated. As usual, it has the same number with a new expiration date and security code.
The next time I needed to ride the bus, I had to update the payment information in the app with my new card info. There's no way to edit the existing card, so I had to add a new one.
(the American Express card is one I no longer use. The "Google Pay" option is there whether I use it or not.)
So I now have two cards that look identical; there's no way to view the details of a card after I add it, so "Mastercard ending in 1234" is all the information I get. But that's okay, obviously the new card is the one at the top of the list, right? Naturally they'd be in reverse chronological order. So I chose that one. I got an error that my card was declined. I went into the payment options to choose the other one, and I got another error saying I had to restart the app. So I did, went into the payment options again, made sure the bottom card was selected, and my payment went through.
Note that this was all happening while I was waiting for the bus, I wasn't expecting there to be a problem, so I was frantically trying to get it to work in the minutes before the bus arrived. I made it, but it wasn't a pleasant experience.
Once I had the correct payment method selected, I figured I was in the clear, it would remember that one and I'd never have to mess with it again --- at least, not until my new card expires in a few years. Right? Well, guess again. The next time I tried to buy a bus pass, my card was declined. I closed the app. I opened the app. The top card was selected. I selected the bottom card in the list. The payment was declined. I resisted the urge to throw my phone down a drainage grate, closed the app, opened it again, selected the top card, and the payment went through 🤦♀️
The next time I used the app was normal, but it happened again the next time I used the app after that. There seemed to be no way to predict which card was selected as the default payment, or which one in the list was the new card. It's as if all the app is able to see is "Mastercard ending in 1234" and it's arbitrarily deciding which one is which. Which would be infuriating even if I was using it in the comfort of my home, but every time I use the app, I'm standing around at a bus stop, squinting to see my screen through the glare, counting down the minutes before the bus comes, praying I get it sorted out before it arrives.
Let people remove cards from the app. This seems so straightforward to me. I can understand the logic behind not exposing the full card information --- after all, if my phone is compromised, I don't want them to be able to see the card information. That's fine. But to avoid this nightmare scenario, let people remove old and expired cards from the app. As much as I hate "long-press" as a user interface action, that was the first thing I tried. It didn't pop up a button to let me delete the card. There are no additional UI elements. Once you add a card to the app, it seems to be in there forever.
I logged out of the app, which I had signed into using my google voice number, and signed in again using my actual cell phone number. All the prior payment methods were gone, and I could add my new card.
the actual solution
As I was writing this, I remembered that sometimes apps will have an undocumented "swipe" action for UI elements. So I opened the app, went to the payment options, swiped left on my debit card, nothing happened, swiped right, and... it gave me the option to delete the card. I'm so fucking mad. You can't expect people to know they need to do that.
⚠️You have to tell people how your computer program works⚠️
In conclusion, I award the Token Transit app 3/5 giblets. More giblets = more gore. It does at least have a way to fix the problem, abstruse as it may be. Join me next time for "UI gore", which is definitely not just "old person yells at phones". I'm not Andy Rooney, you're Andy Rooney 🦝