It is clear that gov.uk hires _actual_ UX designers, people who focus on user experience. Not what most of us in the industry see, where they prioritise flashy animations with easing over stuff like this.
I watched my husband trying to do something important on AmericanExpress.com and he got totally stuck and extremely frustrated because he thought all the radio buttons were disabled and he couldn't answer the questions he was being asked.
Some shitty UI designer thought grey radio buttons "looked good" ignoring that grey controls have a functional meaning (disabled). Sure the grey was a slightly different shade than the "disabled grey", but my husband doesn't know what the exact shade of grey disabled is because he doesn't use a computer all day. He just knows when controls are grey he can't use them, and that's totally reasonable.
Companies make no sense, they tell you to use their website so you don't have to call their call center but then they don't prioritize usability and accessibility on their shitty SPA.
I'm a seasoned front-end engineer (20+ years of experience, working closely with UI and UX designers, worked for the big names, etc.) and I recently had to enter an invoice into a system and I couldn't figure out how it worked. The "SAVE" button was greyed out, and it didn't have a visible :hover state, and the text was light grey on a slightly-darker grey background. The mouse cursor was the normal pointer, not even a hand. So I never assumed it was a button I could actually press.
Imagine if someone like me gets confused by stuff like that. Less-seasoned people wouldn't even manage to understand a UI like that at all.
Worst finding I noticed was that because the UI looked so amateurish and outdated, I also didn't dare to click on things out of fear of breaking the system, which would cost or delay me a month of freelance payment if I messed things up.
Bad UX and bad UI are absolutely killing. And unfortunately, many of these companies (the one in my example included) don't give a damn. This company pretty much has a local monopoly on this kind of software. Their backend integrates with numerous (outdated) payment systems and nobody else does it like that. They can get away with it because people don't have alternative options; so why would they even consider spending tens of thousands on improving the UX and UI?
I'm seriously considering setting up my own product to replace theirs. The frontend looks simple enough. It's just the backend that worries me.
As someone approaching a similar amount of UX/UI and FE dev experience, I find that sometimes that experience actually hinders my ability to use websites that use anti-patterns like that. Because I KNOW the "grey button" is disabled (and then find out it actually isn't). From CC sites, to food ordering sites to just run-of-the-mill generic site X - no one seems to be prioritizing UX or user testing anymore.
And, not mentioned, but the absolute lack of error states is also just atrocious - many times I've had to open up the console to see what's going on. The average person doesn't even know that exists, much less be able to interpret what it is saying to know what to do to continue on in spite of the issue (if in case it's actually possible to continue).
> Imagine if someone like me gets confused by stuff like that. Less-seasoned people wouldn't even manage to understand a UI like that at all.
Part of the problem (their problem, not yours) was that you assumed a lot of reasonable things based on your experience. Someone who is less experienced also has less things to assume and can in turn try more things (a greyed out button isn’t obviously disabled, to them).
I just, minutes ago, walked my dad through sending several existing photos in a text on his Android phone. He knew how to open the text app and find the person he wanted, so he'd gotten it that far.
1) Tap the camera + photos icon. It's pretty small, and between that and combining two icons for quite different actions into one made it so he'd never have guessed that on his own.
2) Bottom third or so of the screen becomes what I think was a live camera view on the left side, with what I'm guessing was a scrolling gallery on the right, but that was gonna be unusably tiny to scroll through, so I had him hit (IIRC) one of the photos that either had an icon on it or said the word "gallery". That's three separate things (Camera, gallery, quick-select photo view) all blended together such that it took me a second to figure out what I was looking at. He had no chance. Tapped gallery.
3) All context is lost as the gallery view takes over the whole screen.
4) You have a scrollable grid of your photos. It's multi-select, but there's not really any way to know that except to guess that it is, and that the select action will be a single tap (it could just as well be that one tap adds that single photo and takes you back to the message screen, and you have to long-tap or swipe or god knows what to add more)
5) Once any are selected, a small(!) "Add" text(!) appears in the top right(!) corner. It's really easy to miss. It ought to be a full button with some color to make it stand out. I kinda know what I'm doing with computers and it took me a little while to find it. I suppose it's top-right rather than at the bottom (which is better for one-handed usability) because elements near the bottom risk accidental taps on Android's "please ruin what I'm currently doing" persistent button row at the bottom of the screen, which blatant UI mistake they just can't seem to bring themselves to fix even after all these years.
6) If I hadn't been there and he'd somehow figured all that out, he'd have assumed they were sent after that. But no, back on the messaging screen you still have to tap the tiny play arrow with some kind of stuff on it (was it the tiny letters "MMS"? I don't recall for sure) to actually send them, they're just queued to send.
[EDIT: To be clear, though, Apple's interface for the same is barely better]
But this is nothing compared to whatever terrible phone + contacts "app" that phone has (I think it's the default for whatever version of Android he has?). The time he had me fix that for him it took me most of a minute to figure out that it had tabs, because they're just represented by thin text rather than anything that looks like tabs or even buttons, and that the problem was that he'd gotten on to the wrong one. The view he had it on, it looked like someone's half-finished UI mockup. When I got it on the correct one, it still looked like that, but with some content filled in. [edit: oh, and the tab header elements were ~1/3 of the way down the screen, not at the very top or very bottom, making it even less clear what they were]
Google: flat-out incompetent at UI for at least 15 years. I still remember the time like 7 years ago that my grandma couldn't figure out how to add contacts in Gmail and it was because they had two buttons the same color and visual weight on the contact form, both of which with copy that a reasonable person would take to mean "add this contact whose information I've just written in the form", but one of them meant "give me a new contact form (and throw away all the stuff I just filled in)" and the only way to have a decent chance at figuring out which was which was to have some clue about HTML layout hierarchy.
Yeah, I edited in that Apple's is "barely better", and that's most of the "barely". I also found the "add" element, though similarly non-buttonish, a little easier to spot, in part because the area in question was smaller, but also because the color stood out a bit better.
The thing about Apple's that's way worse is the photo gallery icon. Pinwheel = photos. So you just have to have memorized the icon to have any hope of figuring that out, especially since there are like 9-10 icons in that part of the screen (plus you can scroll sideways for more).
I also just noticed that, on my view (I assume the icon presence or ordering changes for some people) I have a grey "camera" icon and a grey "App Store" (but seemingly at the top of some kind of "stack"?) icon to the left of the message input field, then directly under the grey App Store icon, on the app list, is a blue "App Store" icon. Naturally, these do completely different things: the blue one opens something to do with the App Store, while the grey one... presents me autocomplete options? WTF?
Ah, that explains it. I rarely use iMessage for anything but quick texts to people who aren't in one of my other messaging apps, so I hadn't looked too closely at it until I checked it out to compare the iOS flow to the shit-show of an Android one I'd just dealt with.
Checking it again, I see now that the grey app-store-stack icon is toggling the horizontal app list, so it's not that it was bringing up the suggestion list before, but that it was turning off the app list, revealing the suggestion list. Of course it doesn't in any way visually represent a toggle, as its appearance remains the same whether it's "on" or "off", and it's not visually tied to the app list, so the connection is rather metaphysical. Sigh. But, at least now I know how it works.
I generally like Apple design well enough but IMO they derailed way off the usability/discoverability tracks back in iOS7 and have yet to fully recover—it's just that almost everything else is even worse.
I'm going to take this as further evidence for my crackpot theory that it should have never been possible for websites to define their own styling. Websites should serve semantic content and the browser should enable the user to apply their own preferred styling.
I think it would be a shame for every website to look the same. Not all information is textual - we’re visual creatures and a lot of meaning can be conveyed through color, layout, font choices etc.
That's what PDF is for ;) But yes, that's an obvious objection and if I had good responses to all the obvious objections, I would have something more than a crackpot theory.
At the same time, I think the web as it is now is the worst possible state of affairs. There's no clear distinction between content and UI. You can theoretically use predefined UI elements, but nobody ever does and if they do, they can (and almost always do) completely change their behavior.
I put some placeholder text on an input field and that shows up as grey text (in Chrome). I had a user contact me because they thought it was disabled.
Placeholder text is a tough one... The example is usually a good idea, but it can be confusing to users, especially if the example text happens to be what they would have entered anyway, they may think it's safe to skip, then get frustrated when your validation tells them it's empty.
I don't know what the solution is, I'm not a UX engineer, I just know it can be a problem.
If there's room, I always make the placeholder read something like "Example: 12345", which makes it clear that they need to change it and also maybe that it's a number or whatever. Can't always do that on really short input fields, but it helps.
Using italic font for placeholder text would help to quickly distinguish it from actual typed input - some apps do that. But, is it something that can be controlled on a webpage?
IMHO, the bad nature of much of the UX we see around us is in the gray area between incompetence and malice. It's hard to sincerely concern oneself with usability when the main objective is to manufacture consent, manipulate the user into doing something you want, and use novelty or gamification to engage or convert. The poor design, flashy animations and other such cruft are a byproduct of this mentality - they may not always be inherently malicious in themselves but they are the result of a mindset which doesn't truly prioritize the user's interests.
In my company, it's not malice, it's stupidity and a lack of leadership.
Some of the middle managers I deal with regularly lament that our web sites don't look like "real" web sites, because they aren't flashy enough. When I ask them what web sites they consider "real," they say things like "YouTube," or "MTV." Sometimes name their favorite video game, or streaming show.
Fortunately, I'm able to push back on these requests successfully (so far). But sometimes I have to play the "We're a healthcare company, not a toy company" card. Sometimes that doesn't work, and I have to go over people's heads.
More and more, the people in charge don't know the difference between a web site, an app, a video game, or one of those TV police dramas where someone shouts "Enhance!" and a crime is solved.
I use many products where I think “wow, this doesn’t make sense. do the people who make this use their own product?”
Then I people watch at work (in every department of course) and I see them do routine things that they seem to hate doing everyday and I think “wow, I would try to do it this other way but ok”
Then on meetings on my team, someone will suggest something that checks all the requirements, but I would have to speak up and roleplay as our support personnel after this feature is released
I have come to the conclusion that people are much harder workers than me.
Funny you mention that, because out of curiosity I clicked "Categories" -> "Communities" to see what else they have on their blog, and the first thing it showed was a post from June stating that they were hiring:
If the British government is comparable to the Dutch one then the main appeal of working for them would be getting a work contract that provides very good job security compared to many other jobs.
To be fair, you also get to make a very clear difference in the everyday life of millions, solving actual problems for real people - instead of finding new ways to display despicable ads.
It is because of the cookie banner. It makes the rest of the page grayer to highlight the banner. Once you close it, it is black on light-gray, which is actually the most palatable combination for me (reasonable contrast between text and background).
Yet another reason why cookie banners suck. I'd say this site's cookie banner is less sucky than others, actually.
I get you and mostly agree, but using GA on its gov.uk websites is probably the least intrusive surveillance the UK does. GCHQ were pretty heavily involved in those Snowden leaks, and I don’t imagine they’ve backed off at all since then.
> I'd say this site's cookie banner is less sucky than others, actually.
So a cookie banner which makes the entire page unreadable without showing, you know, a cookie banner is less sucky than others?
I had no idea there was a cookie banner. Was the unreadable text supposed to give it away? Most cookie banners show some text which lets me approve or reject cookies.
Nice one