That seems too fast...apparently i've experienced these things far too much. It actually was filling me with rage. I came close to saying fuck it...I really did...
Well done to the creators...you managed to, with 100% accuracy, capture every single thing that's horrible about signing up to websites.
That bow thing though...gotta admit, was worth it just for the chuckle I got as I realized...
> Well done to the creators...you managed to, with 100% accuracy, capture every single thing that's horrible about signing up to websites.
Oh no no no. For an authentic experience it needs to reload the page and wipe out all forms when you click 'next' and one of the fields is not valid. (And of course reloading the page should take at least five seconds.)
I got nearly the same time, 06:58. Spent the most time on the bow.
If you liked this, you will enjoy the Phone Number UI from hell[1]. Surprisingly, I did see stuff like that in the wild - and from Google, of all places![2]
My favorite CAPTCHAs are when they don't state whether they're case-sensitive or not and it's hard to tell whether some characters are uppercase or lowercase.
6 minutes? Seriously? You guys must be pretty motivated.
I gave up after about 30s. I'd probably have given up after 60s, even if there was a prize at the end (e.g. being registered). I rebel violently when confronted by a UI crime-scene like that. I'm feeling ill after just two pages of that form.
My current real world frustration: a date picker for birthdate which starts in current year and I believe the native selector in Android/Chrome doesn't let you select a year. You hit left arrow to go down month by month. Am I crazy and did I miss this? Ive seen it a few times now!
There usually is a way, but it's often non obvious.
I.e. the picker might have a header like July without any visual offset, but clicking could still switch the view to the year picker.
I usually just try various stuff and I can't remember a single time where I didn't find an option eventually, but they're sometimes well hidden
I wonder if there's a way to get the datepicker to open on a specific date... find the median age of all users and open the datepicker in that year haha
iirc the Android 4 date picker had a microscopic hit-area on the date where, if clicked, would display a year-key-in dialog. I don't know if newer ones have this.
I hate date pickers so much that I use the Google Assistant in all its hellish, buggy glory to create appointments for my calendar on my phone.
Google's UX is slightly broken and nobody in the organization cares to fix it. Their date & time pickers are good examples of this.
Flutter provides separate Material date picker [0] and time picker widgets [1], but no date-time picker widget that displays the selected DateTime and lets the user change the date or time. When I asked Flutter team for one 2 years ago, their UX person refused to add it, saying that because it's not in the Material Design Spec [2] [3] that it doesn't belong in the Flutter widget library.
Flutter does implement the excellent iOS DateTime picker [3].
I can’t tell if you’re being sarcastic or not. I can type this entire paragraph faster than picking a date with any goddamn date picker. A little faster I can type:
- 27 jun 16:30
- sunday 16:30
- tomorrow 16:30
Before I switched to using siri, I often typed that into notes or telegram saved messages and then tapped on it to create an event. The amount of bullshit ui developers like to introduce is unbearable.
And now for some mind-blowing ui:
- team building fri 7pm weekly remind 1h, 30min add coworkers
I was dying with laughter. Love the helpful chat box which takes forever to drop, the helpful popup telling you to hurry up with an option to lock it where you'd expect an ok, and the expand button where you would expect the close button.
But captchas were truly the icing on the cake.
The only thing missing would have been a 'subscribe to our newsletter' feature 2 seconds after each page loads.
Flag icons in grayscale. My country's flag is three equally large horizontal bars, just like 12 other nations (and a lot more if you count variations like little insignia etc). [1]
The way the final verification overlay window was just a little too small so you had to scroll one line to get the final set of check boxes was a very nice touch.
And an obnoxious GDPR message with intentionally confusing sliders (am i disabling all tracking or enabling all tracking? Why is the ‘accept all’ button in the placement of the ‘accept’ button, why can I not just hide this form and not complete it at all)
The U.K. government does this a ton with random reference numbers, even on their new (mostly good) sites and it drives me up the wall. Oftentimes they will give you these numbers with spaces but the form will not let you enter it with spaces (so it will fail if you copy-paste), or even worse the form will have a size limit so if you paste your 10 digit number with two spaces, the last two digits will be chopped off so it will fail again when you remove the spaces.
Another problem is phone numbers: if you want to use some autofill functionality, your phone number will often include the country code part but the field won’t allow a + (maybe in this case the autofill feature should drop the country code (and add a 0) or replace the + with 00).
I’m not actually sure about the significance of the space in U.K. postcodes. I feel like it shouldn’t be significant as one can imagine a regex for the two parts, /([A-Z]+[0-9]+)\s*([0-9][A-Z]+)/, but I then there are exceptions like EC1R.
My favorite is a video cutter software that has two four-sectioned inputs for start/end times, like hh:mm:ss.ttt. You enter e.g. 00:17:44.500 into “start”, deleting minutes section with DEL, because it’s full with zeroes. And then you can’t enter 17 into end-minutes field, because video length is 21:30 and 17:30 is less than 17:44.500, which is bad. You have to first del-fix end-seconds and then go back to minutes. But wait, you want to cut to 17:50, but 21:50 is more than the video length (21:30), so as you type 50 it makes it into obvious 05! You have to del-fix minutes to 20, del-fix seconds to 50 (now you’re half-good), go back to minutes and del-fix these to 17. Milliseconds are no-brainer from there, don’t worry (but do not forget to unfocus the input, because otherwise it doesn’t apply). Sadly it still cuts along nearest keyframes only, but hey, at least it works.
If you think that I’m just kidding, it’s Gihosoft Video Cutter, one of 10 best video cutters out there.
Dvla... They ask you to enter the number on your form, without a prefix that is printed on it, and then to enter the payment amount that you think you owe them. No confirmation, no validation...
My email address has a dash in the domain and it's remarkable how many sites (and big ones, too!) reject it as an invalid domain.
Discover.com, for example, rejected it when I did a card application, but disabling JavaScript let it go through on the server-side validation. Bloody weird.
Really the entire idea of client/server-side email "validation" kind of seems like an ancient, cockroach-like anti-pattern that is impossible to stamp out. Like, what is the problem they're even solving? One validates email addresses by sending an email with a token the user then acts on. There are useful things to do with emails, like checking against already registered ones (including any blacklists), but I can't think of any that would result in any in-page user feedback since that would generally be a dumb information leak. Like if someone tries to register an already registered email, send an email about it don't leak that it's registered.
And as well as being useless most such scripts seem to date back a long ways and have very lazy and fixed assumptions about what constitutes a valid address. I mean, I've never been a fan of the explosion of TLDs, but it's also a reality and they're all valid. Even on the left side of the @ a surprising number of scripts seem to fail on things that are perfectly acceptable characters.
Strikes me as one of the many little minor GUI traps where new designers get carried away with the power of scripts and do without asking if they should, then further get too clever by half.
> Even on the left side of the @ a surprising number of scripts seem to fail on things that are perfectly acceptable characters.
I've had an input require a minimum of 3 characters on the left side of the @ to register. My email was just "me@example.com" using my own domain name. A perfectly valid email address. I am also unable to sign up for Id.me for the IRS because it rejects both of my personal email addresses. I cannot register to create NPM packages for the same reason. I also cannot sign up for Vercel either. I cannot sign up to Vercel via Github and when I try to sign up by email it says the account already exists. When I attempt to do a password recovery for the email it says "Sorry, we are unable to validate that email." So the original error of "account already exists" is actually wrong - the account doesn't exist and can't exist because they aren't able to validate the email for it.
My personal emails aren't even "weird" ones like ones with an emoji or punycode domain or non-Latin character sets.
I hate with a fiery, burning passion every site that attempts to do any kind of email validation beyond simply sending me an email and letting me click a link to verify my email exists.
>I hate with a fiery, burning passion every site that attempts to do any kind of email validation beyond simply sending me an email and letting me click a link to verify my email exists.
Yet at the same time, that's the one important validation that infuriatingly many sites don't do.
I once lost a protracted argument with the US Department of Education who absolutely refused to stop sending me private personal financial aid and academic details of a complete stranger who mistakenly gave them a common outlook.com email address that I have. As far as I can tell, in their view, since the user had put in a valid email address, that was their email address, and just because it was my email address didn't mean I was authorized to have it removed from the account. I continue to receive the person's private information from the state, colleges, and predatory businesses.
In fact, the number of mistaken accounts that get linked with that email address is fascinating. Paypal UK apparently does not send email validation requests before associating email addresses with accounts. Nordstrom does not. Internal divisions of the North Carolina Department of Insurance does not. UK Revenue and Customs apparently does not. Many of the larger organizations that, even more infuriatingly, always send emails from noreply addresses, and give no other way of contacting them other than logging into your account.
Lots of these kinds of things—at least for companies that aren't just copying others' patterns blindly—are the result of multiple support calls/emails/tickets. The tickets, in this case, would be users complaining about your service being broken when in fact they messed up their email address and don't realize it. There are also some cases in which you want to use the address immediately to reduce friction (as with sending receipts or shipping data for an order by a "guest" user without an account) without first sending a verify-address email.
My personal preference is to let the user know why you think the email address looks wrong and give them some way to override your judgement and submit anyway. It's more work, but it gives you all the benefits of rejecting "bad" addresses while minimizing the harm of false-positives from your bad-address-spotting code (it's very slightly annoying to people with odd-looking addresses, but not that big a deal). This also lets you go beyond validating the form of the email address, to alert on common typos that might be legitimate (and which can sneak in even if you make the user type the address twice). "gmial.com looks like it might be a mistake; are you sure you got that right?" Or "yaho.com". Or even just Levenshtein-distance check a bunch of common email domains and alert any that are close, but not exact. You annoy whoever has an actual address at those domains, but save a bunch more people who screwed up.
This has been common for mailing addresses: with a parsing and validation system, the site will tell the user "We think you entered ... as your address; we think your address should be this: ...", along with options to keep the original entry or use the suggestion. This has the advantage of catching mistakes, not making unusual addresses unusual, and letting the user know if the site is interpreting what they entered in a way that won't actually work (eg, leaving off something important, or ordering components badly).
Steam does emails correctly when it comes to login/registration; your email address is just a contact method for your account, and you can have multiple accounts with the same email address.
IMO, the only client-side validation that would be done on email addresses is to ensure it doesn't have a space in it and it has an @ in it, and maybe make sure someone isn't doing funny things without a hostname (disallow IP-based hosts).
The problem they're solving is that a lot of people just enter their email wrong and then wonder why they didn't get the signup email.
> Like if someone tries to register an already registered email, send an email about it don't leak that it's registered.
This is something that's cargo-culted far too often. Maybe for some services it's worth keeping secret which emails are signed up, but for most it isn't.
I'd prefer to just have it. Seems decently important for me privacy wise. I as a customer don't want others to be able to test whether I have signed up somewhere and also it is much better security wise and not leaking business data.
And most times, it is standard practice to hide sign ups, luckily.
> <orange>“This doesn’t look like a correct email address that our clients usually use. Please re-check it again and proceed if you’re sure.”</>
And what proportion - especially what proportion of people who make mistakes when entering their email address - do you think will pay any attention to that?
> like an ancient, cockroach-like anti-pattern that is impossible to stamp out.
I feel like you just described email (or rather, "the" email spec, as if there was a single one) in general.
Yes it obviously still serves its purpose but what consists a valid email-address (let alone email) is specified in such a godawful way that every application that I've seen in the wild trying to address this problem somehow fails at it (sometimes in negligible, often in very gross ways).
If devs all over the world manage to screw it up over and over again, maybe it's just time to call it quits and acknowledge that the spec is broken?
>I feel like you just described email (or rather, "the" email spec, as if there was a single one) in general.
But the concept of email is extremely useful, valuable, understandable, and it's standardized and out of the centralized control so common for anything developed these days. I'd be happy to see some sort of email 2.0, cleaned up, with modern encryption by default and so on that served as a replacement. But I don't know of anybody even proposing such a thing. Instead the rage is to create yet another fucking instant messenger or slack thing or whatever.
Everyone knows the spec is ancient and has had a lot grafted onto it. But it's not going anywhere without a good replacement and even with that the transition would take a very, very long time. So as is so very, very often the case in computing we just have to deal with that.
My email address is "_@" followed by a domain name with a dash followed by the "shop" domain ending. It gets rejected a lot, but I won't give it up. It's a good indicator of whether I should spend more time at the website.
Yep. One of our salespeople had a fit because a prospect couldn't get emails from him. The return message said "we do not accept email from the .io top level domain".
I'd say it's the backend's job to accept any of those and reformat accordingly. If you rely on the frontend the backend would still have to validate it anyway.
I have a personal punishment policy for any obvious violation of UX/UI - they will permanently and irrevokably lose me as a customer. Even if they fix it, I won't budge. Leadership needs to use their own products and if they allow this to go to production, I wonder what they're doing behind the scenes. Small battles that I pick, but by god it is so satisfying.
So a small shop that can only pay 1 fresh bootcamp dev who is trying their hardest doesn’t get your business because they can’t keep up with several hundred Frontend google devs. Seems a little silly and absolutist.
It's a win-win. The small shop also can't afford to deal with this customer. Not to disparage either, but a first lesson for small businesses is that you can't chase every customer.
Most horrible UX comes from too much software, not to little. If it was a single dev, they’d probably not have time to implement all the popups, dickbars, newsletter reminders, full screen interruptions, and dark patterns. Horrible UX takes large engineering effort.
It is usually the opposite - large enterprises have horrible UX than a mom & pop small shop. Furthermore, just because you're small doesn't mean you cannot fix UX of the user. I don't throw my money at them in charity or pity for being small. There are some great small businesses, and many not so great. Absolutist argument is perhaps in the point you're making.
I run a small side business with $2k/month in revenue and I damn well make sure that there are no annoyances to the user. This is standard expectation and has nothing to do with how big or small you are. We should all strive for excellence and not perpetuate mediocrity.
Regarding silliness - it would be silly to keep going to a restaurant that has rude service. That's what you're saying essentially.
True! it's just that the convention is not to link to past submissions that didn't get interesting threads. Otherwise users get cranky when they click on the links and find nothing interesting there.
I laughed out loud when I got to the bottom of the last page and didn't see checkboxes and realized the checkboxes were above the pictures and not below and had to scroll to the top.
I love the double indirection on the cookie dialog. You're used to the small, unhighlighted option being the one to click to reject cookies, but here the question is asked the other way around, making the big button the one you want to click instead.
i had to view source - for a second i thought this was a notpron-ish sort of game. Then i had to look again. There's no indication that you're hovering over something.
My favorite part was the giant array of checked checkboxes and the instructions to only check three. I started mindlessly unchecking all of them and then accidentally hit the randomly placed "select all" checkbox once I got near the end. Legitimately made me laugh out loud at how absurd it was.
I appreciate this. I'm so sick of seeing links hit the top of HN that are utterly broken in landscape orientation because some stupid pop-up renders with the close button off-screen.
This is interesting and potentially has value. To the end of deriving public value, is there source code or (non-)business logic that can provide an explanation to the choices made in developing this form?
Alternatively, and pessimistically, is this simply a successful marketing endeavour by a digital agency?
Actually, I have spend more time on some 'real' sign up pages...
At least this time, I was constantly laughing about the somewhat absurd combinations. But I am missing some of the harder parts, like forms not showing because they are only loaded when you disable your ad-blocker or forms working in specific browser versions only. However, that would probably make it too hard/realistic.
I love it!
PS: Just to give an example: The login form for the German Vorwerk website does not show in Firefox https://www.vorwerk.com/de/de/s/shop/login and when you opt to register, the button just disappears, but nothing else happens... And yes, you need that form to actually buy products.
Sounds interesting and indeed, when I take a fresh profile, the website loads just fine. So I suppose some one of my settings or some extension causes the issue.
Thanks for the hint.
Edit: I don't quite get it yet. Even starting my default profile in safe-mode (disables all extensions and themes), the page doesn't work.
The dev console shows this error:
Failed to execute ‘postMessage’ on ‘DOMWindow’: The target origin provided (‘https://account.vorwerk.com’) does not match the recipient window’s origin (‘https://www.vorwerk.com’).
So I am pretty sure it must be some kind of configuration that is causing the issue, but so far I didn't find the related option in about:config
I haven't laughed this much in a while, well done! (Or... the opposite of that?)
I was just a little disappointed when I clicked the back button and it actually worked instead of the game hijacking it and filling my tab history with garbage.
I found the country selection by black and white flag to be deliciously horrible. And the bow captcha was just hilarious. Kudos to the creators for the level of absurdity of this form.
4:52, but I had already given up on the first page once and then had to give it another go. Like others mentioned here, a lot of these are unfortunately common in the wild - the ones that always set me into a rage are placeholder texts that remain in the field as I type and the inability to tab through fields.
Thanks, I hate it (or love all the dark patterns in one place :) ). On mobile I have tried to go through the first form and rage quit after 3 minutes. How do you close that hurry up modal? You could only expand or lock it, but did not see how to close it.
The worst was the initial scroll offset. I was wondering why the last row had no checkboxes below the images, and was unable select those images. After three or four times submitting that damn dialog I noticed that I can scroll up.
I also had to scroll down the terms and conditions dialog twice because I thought I could just click the text in order to toggle the checkbox.
I gave up after the 6th captcha or so. If the answer is to check them all then that's a bit dishonest, because some pictures technically don't apply. For example, glass windows are not "glasses".
I selected them all -- on every one it looked to me like they all were the thing -- I did not pass. At least not if getting another captcha means you didn't pass.
00:02:53 I don't think it was bad, there are were some frustrating moments such as having to put one's age as well as birth date, uploading an image, and reading the password requirements.
“Select all checks” was my favourite. Half the time when I’m shown crosswalks I know they aren’t crosswalks but also know that I’m expected to click them, maybe, sometimes. So infuriating.
Drat! it took em: 00:09:23. That bloody accept terms and those checkmarks at the end got me good. Nice game and great way to get people to want to apply. Kudos to the creators.
Side effect: you've now created a child account and will have to wait 18 years for all of the website features to unlock! And don't dare make a second account, or you will get banned for sockpuppeting!
At least one popular mobile game has a policy that the account's birthdate will not be changed under basically any circumstance, and child accounts are severely restricted compared to adult accounts. Parents wanting to take over their kid's account (happens more often than you'd think) end up seriously frustrated with the restrictions.
00:06:57
That seems too fast...apparently i've experienced these things far too much. It actually was filling me with rage. I came close to saying fuck it...I really did...
Well done to the creators...you managed to, with 100% accuracy, capture every single thing that's horrible about signing up to websites.
That bow thing though...gotta admit, was worth it just for the chuckle I got as I realized...