13 ms·

Letting users tick a ‘none’ checkbox

413 points by open-source-ux 5y ago

aaaaaaaaaaab 5y ago
gov.uk is what the Web should be. Lightweight, accessible, simple. It takes a certain kind of maturity to ship something so unapologetically utilitarian without giving in to any of the “modern” Web trends. No wonder it takes none less than a nation state to pull this off… It’s beautiful.
- bspammer 5y ago
  > It takes a certain kind of maturity to ship something so unapologetically utilitarian This reminds me of a quote I’ve seen a few times: “When I was younger I thought alcohol was the adult drink. When I got older I realized water was the adult drink all along”
laputan_machine 5y ago
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. Nice one
- wutwutwutwut 5y ago
  Yet the linked text shows as black on darkish gray background to me, making it very hard for me to read.
  - laputan_machine 5y ago
    it's almost black (#0b0c0c) on almost white (#f3f2f1), you can this by inspecting the CSS
  - wongarsu 5y ago
    For me it's black text on white background, in one narrow easy to read column of text.
  - emerongi 5y ago
    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.
    - chronogram 5y ago
      > Yet another reason why cookie banners suck. More like yet another reason why that government wanting to track its citizens via Google analytics sucks.
      - smcl 5y ago
        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.
    - wutwutwutwut 5y ago
      > 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.
- astura 5y ago
  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.
  - philwelch 5y ago
    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.
    - bspammer 5y ago
      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.
      - philwelch 5y ago
        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.
  - david422 5y ago
- vanderZwan 5y ago
  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: https://designnotes.blog.gov.uk/2021/06/24/were-hiring-interaction-and-service-designers/ https://designnotes.blog.gov.uk/2021/06/24/were-hiring-inter... I'm sure the positions are filled now, but it also goes into what they are looking for in interaction and service designers.
  - toyg 5y ago
    AFAIK they are always hiring, more or less. I expect pay rates will be toward the low end of the scale, particularly for London.
    - vanderZwan 5y ago
      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.
      - toyg 5y ago
        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.
- xenocyon 5y ago
  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.
  - thrashh 5y ago
    I don’t think it’s malice at all. 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.
  - reaperducer 5y ago
    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.
  - dkarl 5y ago
    > gray area between incompetence and malice Meaning there's enough incompetence going around to provide plausible deniability for routine malice.
amanzi 5y ago
A great example of how much thought has gone into this can be seen with this paragraph: "Avoid giving directions like ‘none of the above’, as this implies a visual reference that may not be relevant for users of screen-reading software. Instead, use ‘none of these’ or similar." That's not something I would have thought of straight away, and it's a great reminder of how important accessibility is.
- bgro 5y ago
  Everyone remembers the smartass tests in school with the directions that say to sign your name and then hand in the test... Or some other form of smartassery where you must pick the MOST correct answer which has some stupid theoretical technicality that somehow invalidates all other answers as 100% wrong no partial credit. I remember endless multiple choice tests where the correct answer was "All of the above" but it was located below "None of the above" Or the first answer would be "All of the above," but as item[0], it has nothing above to select. Or "None of the above," which is always correct by default if it's the first item in the list. I was never allowed to argue these were correct when it applied to me, though.
  - infogulch 5y ago
    > Or "None of the above," which is always correct by default if it's the first item in the list. If that works anywhere it would be in a logic class that covers logical implication.
    - afiori 5y ago
      It also works in legalese > Party A must satisfy all the following condition to receive a premium: > EOF As there were no conditions to satisfy Party A was able to satisfy all of them and is entitled to the premium.
consumer451 5y ago
Somewhat related: I have seen some twitter polls with "Just show me the results" as the last option. I think this would end up with more signal in the poll results, as some users are likely to just click any answer to see the results. I was thinking that all twitter polls might benefit from this. Is this a good idea in all cases?
- conradludgate 5y ago
  For some polls it is by design that it blocks you. If you can see the results before you click, you're biased but the results.
noodlesUK 5y ago
As always, I'm really impressed (and a little proud as a Brit) by the gov.uk team. I've had the misfortune of having to deal with the various levels of US federal, state, and local govt for basic administrative tasks, and every time I long for gov.uk. I love the look of the little or divider. Nice touch.
- BrandoElFollito 5y ago
  I am also starting to like the french .gouv.fr sites. They are slowly becoming modern. It is just our love of PDF that is holding us back (really?, PDFs that are fillable on a computer but no web forms to avoid the save & send by email? (or print))
  - mbesto 5y ago
    > They are slowly becoming modern. It doesn't even need to be modern. Just usable.
  - mschuster91 5y ago
    PDFs are accessible: a person distrusting computer transmission or without a computer can print out the form and send it via postal service. Also, you can save a filled out PDF (or copy a paper) to have a copy of what you submitted in your records, something that is impossible to do with most webform solutions.
    - BrandoElFollito 5y ago
      > PDFs are accessible: a person distrusting computer transmission or without a computer can print out the form and send it via postal service. Yes, this is very useful when you do not have or want to use a computer. But if you fill in a PDF form on a computer, better go for the web app whihc will be easier to read and has a higher chance to actually work (the govt PDF will always have that one weird field that cannot be filled). > Also, you can save a filled out PDF (or copy a paper) to have a copy of what you submitted in your records, something that is impossible to do with most webform solutions. It would be enough for the web form to send you a confirmation, making it also an acknowledgement of your request. We already have this for taxes for instance.
readflaggedcomm 5y ago
>Use this new feature wherever services already have a ‘none’ checkbox. So I guess this is mostly about standardization in the toolkit, which makes the whole thing easier to work on and modify (or translate into a different front end) in the long run.
- johnday 5y ago
  And of course, it's standardised for users too, who can now expect a more unified way of interacting with government digital services.
wongarsu 5y ago
It makes perfect sense. For a question like "which types of waste do you transport" you ideally want to differentiate between "None, I don't transport waste", "Other, I transport waste that isn't on the list", "I don't know/don't want to tell you" and "I forgot to answer this question". But it's really easy to design a form so that all of these map to not checking anything, which will probably lead you to drawing wrong conclusions when looking at results with lots of no-answers. And in this case they did the right thing and don't allow you to both check "none" and any of the other checkboxes, preventing you from giving nonsensical answers.
- memco 5y ago
  They do have logic for reconciling the responses so you can't check "some" and "none", yes. But the article states: > Finally, we also added some JavaScript code to prevent users from ticking the ‘none’ checkbox as well as one of the others. This is to avoid users giving contradictory answers. I hope they have server side checks as well because this enhancement comes at a cost of state management that isn't guaranteed to happen if JS is the only barrier to reconciling incompatible selections.
  - xmprt 5y ago
    Why would the server side code have to change for this? A none checkbox could just be translated to an empty array and passed down to the server as if none of the options were checked.
    - wildrhythms 5y ago
      A particularly annoying problem with front-end validation is that it's not difficult to circumvent the Javascript logic, check both 'None' and 'All', and send it to the server. It becomes the server's responsibility to make a decision about whether 'None' or 'All' takes precedent.
      - nicoburns 5y ago
        In this case the server likely doesn’t have a ‘none’ option. The none option in the client will be translated into an empty array (or false for all the other options). So circumventing the client isn’t likely to get you very far.
open-source-ux 5y ago
This is a nice pattern - simple and effective. Although adding a 'none' option may seem like a minor detail, it's a small detail that can improve any form. Here is a bigger screenshot of the pattern. In this example (from booking a vaccination appointment), you are asked if you have any access needs (or none): https://i.postimg.cc/R0D0Fn9Y/online-form.png https://i.postimg.cc/R0D0Fn9Y/online-form.png This 'none' pattern can work well on paper forms too. For example, on some paper forms I scribble N/A (not applicable) when there is a long list of options but none are applicable to me.
- jffry 5y ago
  The introductory paragraph links to their high-quality component documentation, which contains not just code examples but also clear guidance on things to do and avoid when using it. From there it embeds an interactive example: https://design-system.service.gov.uk/components/checkboxes/with-none-option/index.html https://design-system.service.gov.uk/components/checkboxes/w...
mg 5y ago
I experimented quite a lot with "3 state checkboxes" at Product Chart. The Product Chart interface offers a ton of checkboxes. Because the most typical use case is that a user wants to "tick" a feature. Like "I want a laptop with a touchscreen": https://www.productchart.com/laptops/ https://www.productchart.com/laptops/ But sometimes, users want to exclude a feature. Like "I want a 3D printer that is not assembled". After some experimentation with custom 3-state checkboxes, I decided to go with this type of dropdown: https://www.productchart.com/3d_printers/ https://www.productchart.com/3d_printers/ By default it displays "Feature". And when dropped down it has the options "√ Feature" and "√ No Feature". So far, users seem to grasp this intuitively. The nice thing is that it is self-explanatory and takes up only one line of space.
- noctune 5y ago
  Nice site. I'm not sure the dropdown looks great on OS X though. On OS X, the selected option is prepended with √, so it looks like √ Feature √ Feature √ No Feature Selecting the second element then shows Feature √ √ Feature √ No Feature It ends up looking somewhat odd.
  - mg 5y ago
    Oh wow, you are right. The same happens on the latest iPadOS. Must have changed since I tested it last time. I guess that's why nobody is using native elements. They can break any time the browsers change their appearance. Guess I will have to create a custom element that "simulates" a plain dropdown.
    - mwcampbell 5y ago
      > Guess I will have to create a custom element that "simulates" a plain dropdown. That would probably be a regression for accessibility.
    - voussoir 5y ago
      Another option might be to rephrase them as "Assembled or Disassembled", "Assembled", "Disassembled". At the moment you're using the checkmark to disambiguate between not-chosen and chosen, but rewording the not-chosen to clarify that it includes both could achieve the same goal.
notafraudster 5y ago
Last year while working on some public opinion polling software I ran into an issue where I found that analysts often wanted to know the difference between someone selecting "None", someone skipping the question, or someone not being asked the question due to branch logic. It's a pretty easy problem to solve -- if you represent the response as a string, you use "None", "", and "Not Asked"; if you represent as numeric, you just set numeric codes for each. But the interesting thing is just that it's sort of an invisible distinction until you think about it, just like this one is. I don't really do a lot of UX stuff myself and it was kind of a cool moment to have to think about it a little.
gorpomon 5y ago
I'm new to the UK and the gov.uk sites are a true breath of fresh air. I still wish they gave more context on questions, but the quality of the site and using their forms is excellent. The consistency is also amazing, every form I've used behaves consistently, so it's easy to build up a muscle memory in using them.
stoned 5y ago
This is great, especially since the none checkbox can probably be added with minimal overhead on the frontend and no changes to the backend. Great research and post. Would have never occurred to me but makes total sense.
- irae 5y ago
  It would still be a good idea to have backend check for this. - If javascript breaks, (or get blocked by extensions) there should be a check for contradictory answers. - If on future iterations on the UI (more often than backend) logic breaks, backend help improve how to debug the UI update Just to mention a few reasons.
  - iudqnolq 5y ago
    I'd guess they do. Another commenter mentioned that when you leave feedback or ask for support they log whether you have JavaScript enabled or not.
samizdis 5y ago
A slight tangent here, but one that I enjoyed: I've used gov.uk services/sites quite a bit and find them easy to follow and almost always written in unambiguous and clear language. So, having seen this post and the positive comments it generated about gov.uk, I went to the main site and posted a shout-out for the team (especially UI/UX) with a link to this thread. I left my name and email address in the boxes that allow you to request a reply. I received two automated responses. One contained a tracking link to see the status/progress of my query/comment. The other contained a copy of my comment for my records, and also some info about my set-up at the bottom: > [User agent] Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.4638.69 Safari/537.36 > [JavaScript Enabled] false > Thank you, > GOV.UK User Support Team That's a nice touch, in my opinion, and it made me smile.
- d1sxeyes 5y ago
  Their internal guidelines on ease-of-reading is to target a reading age of 9. There's a blog that mentions it here: https://gds.blog.gov.uk/2016/02/23/writing-content-for-everyone/ https://gds.blog.gov.uk/2016/02/23/writing-content-for-every... I don't remember exactly where this is published formally, but I've come across it before.
e2le 5y ago
If only more sites took inspiration from gov.uk, "modern" sites might not be the barely usable mess they are today. Unfortunately some see gov.uk as an "eyesore" and not something to learn from.
- frosted-flakes 5y ago
  Governments around the world have taken inspiration from gov.uk and the GDS. Even my own province's website closely resembles gov.uk in many ways.
johnmato 5y ago
I'm really impressed by this initiative.
adrianmonk 5y ago
> allowing all checkboxes to be unticked means that users might accidentally skip the question, perhaps assuming that they’ll return to it later This also means the software can validate that the user hasn't skipped the question. With a "none" option, the user can distinguish between not answering and answering in the negative, and so can the software.
- throwawayboise 5y ago
  It also make coding the backend somewhat easier, as unchecked checkboxes/radio buttons are not included in the POST data. Not sure how much this is an issue with modern frameworks but when I did HTML/Forms work this was a constant surprise to newer developers.
adrianmonk 5y ago
An alternative UX pattern is to have a "yes" checkbox and a "no" checkbox for each one of the options, with (obviously) neither checked by default. If a user positively answers yes or no for each option, then an all-"no"s response equates to a positive "none". It's very tedious, so you should probably not do this most of the time. But it could be appropriate if it's extremely important to encourage the user to individually consider whether each of the options applies. By forcing them to click on each line, you discourage them from rushing through without reading, skipping to the end, and just checking "none". I've seen this UX pattern on paper vaccine forms, for example. They want to know if (1) I'm pregnant, (2) I'm allergic to eggs, and (3) I have Guillain-Barré syndrome. They could ask me to check all that apply, but instead they have yes/no for each one.
- hunter2_ 5y ago
  As much as I prefer electronic forms over paper, the ability to draw a continuous vertical line through all of those "no" boxes is quite nice compared to actually marking each separately.
  - adrianmonk 5y ago
    I smell an opportunity for someone to create gesture-based HTML forms. Seriously though, this brings up an important point. People don't like excessive paperwork, so this pattern should be used very sparingly. Users' time and attention is a scarce resource. You can't magically create more of this scarce resource by applying a UX pattern. People will respond by putting themselves on "click no, no, no, no, no, no, and no" autopilot.
    - graywh 5y ago
      I build data collection instruments for biomedical research and we often put "yes to all" and "no to all" at the top of a table of yes/no questions
      - aembleton 5y ago
jorgeudajer 5y ago
Impressive and quite comforting to see a public entity tackle an issue that many private companies (even in the UX industry!) ignore.
zucked 5y ago
Not from the UK, but I poke around on the portal from time to time. It's a true breath of fresh air. I love how you can deep dive into a specific topic of interest without really leaving your place. Example: https://www.gov.uk/browse https://www.gov.uk/browse The way the menu behaves is both predictable AND useful for browsing around. My local government site is constantly whisking you off to separate sites, each with its own design language and unclear path back to my place of origin. The team responsible for all this does it right.
frereubu 5y ago
Whenever I see a blog post like this about the gov.uk design system I think about the millions of person-minutes small changes like this must save. My wife is Spanish and whenever I have to interact with Spanish bureaucracy it's like night and day. (This is partially to do with the inherited culture in each bureaucracy - we needed a certified translation of our marriage certificate, and the translator told us that the consulate had put the wrong email address on their website for her. She spent so long trying to get them to update it on their website that eventually she gave in and created the incorrect email address so she could pick up the emails that people were sending).
- treeman79 5y ago
  20 years ago a friend noticed his social security cars as female. So he spent a few months trying to fix it. He eventually gave up.
  - marcodave 5y ago
    Missed opportunity to end the last comment with > She eventually gave up
rzzzt 5y ago
Slight tangent: is the plural form of carcass really "carcuses"?
- nielsbot 5y ago
  Wiktionary says no: carcass (plural carcasses)
  - rzzzt 5y ago
    Going the other way round, I found one article where "carcus" is mentioned in singular form.
    - nielsbot 5y ago
      link? update: Ha. Wiktionary has an entry which says "misspelling of carcass" https://en.wiktionary.org/wiki/carcus https://en.wiktionary.org/wiki/carcus

gov.uk is what the Web should be. Lightweight, accessible, simple. It takes a certain kind of maturity to ship something so unapologetically utilitarian without giving in to any of the “modern” Web trends. No wonder it takes none less than a nation state to pull this off… It’s beautiful.

bspammer 5y ago
> It takes a certain kind of maturity to ship something so unapologetically utilitarian This reminds me of a quote I’ve seen a few times: “When I was younger I thought alcohol was the adult drink. When I got older I realized water was the adult drink all along”

laputan_machine 5y ago

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. Nice one

wutwutwutwut 5y ago
Yet the linked text shows as black on darkish gray background to me, making it very hard for me to read.
- laputan_machine 5y ago
  it's almost black (#0b0c0c) on almost white (#f3f2f1), you can this by inspecting the CSS
- wongarsu 5y ago
  For me it's black text on white background, in one narrow easy to read column of text.
- emerongi 5y ago
  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.
  - chronogram 5y ago
    > Yet another reason why cookie banners suck. More like yet another reason why that government wanting to track its citizens via Google analytics sucks.
    - smcl 5y ago
      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.
  - wutwutwutwut 5y ago
    > 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.
astura 5y ago
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.
- philwelch 5y ago
  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.
  - bspammer 5y ago
    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.
    - philwelch 5y ago
      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.
- david422 5y ago
vanderZwan 5y ago
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: https://designnotes.blog.gov.uk/2021/06/24/were-hiring-interaction-and-service-designers/ https://designnotes.blog.gov.uk/2021/06/24/were-hiring-inter... I'm sure the positions are filled now, but it also goes into what they are looking for in interaction and service designers.
- toyg 5y ago
  AFAIK they are always hiring, more or less. I expect pay rates will be toward the low end of the scale, particularly for London.
  - vanderZwan 5y ago
    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.
    - toyg 5y ago
      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.
xenocyon 5y ago
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.
- thrashh 5y ago
  I don’t think it’s malice at all. 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.
- reaperducer 5y ago
  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.
- dkarl 5y ago
  > gray area between incompetence and malice Meaning there's enough incompetence going around to provide plausible deniability for routine malice.

amanzi 5y ago

A great example of how much thought has gone into this can be seen with this paragraph: "Avoid giving directions like ‘none of the above’, as this implies a visual reference that may not be relevant for users of screen-reading software. Instead, use ‘none of these’ or similar." That's not something I would have thought of straight away, and it's a great reminder of how important accessibility is.

bgro 5y ago
Everyone remembers the smartass tests in school with the directions that say to sign your name and then hand in the test... Or some other form of smartassery where you must pick the MOST correct answer which has some stupid theoretical technicality that somehow invalidates all other answers as 100% wrong no partial credit. I remember endless multiple choice tests where the correct answer was "All of the above" but it was located below "None of the above" Or the first answer would be "All of the above," but as item[0], it has nothing above to select. Or "None of the above," which is always correct by default if it's the first item in the list. I was never allowed to argue these were correct when it applied to me, though.
- infogulch 5y ago
  > Or "None of the above," which is always correct by default if it's the first item in the list. If that works anywhere it would be in a logic class that covers logical implication.
  - afiori 5y ago
    It also works in legalese > Party A must satisfy all the following condition to receive a premium: > EOF As there were no conditions to satisfy Party A was able to satisfy all of them and is entitled to the premium.

consumer451 5y ago

Somewhat related: I have seen some twitter polls with "Just show me the results" as the last option. I think this would end up with more signal in the poll results, as some users are likely to just click any answer to see the results. I was thinking that all twitter polls might benefit from this. Is this a good idea in all cases?

conradludgate 5y ago
For some polls it is by design that it blocks you. If you can see the results before you click, you're biased but the results.

noodlesUK 5y ago

As always, I'm really impressed (and a little proud as a Brit) by the gov.uk team. I've had the misfortune of having to deal with the various levels of US federal, state, and local govt for basic administrative tasks, and every time I long for gov.uk. I love the look of the little or divider. Nice touch.

BrandoElFollito 5y ago
I am also starting to like the french .gouv.fr sites. They are slowly becoming modern. It is just our love of PDF that is holding us back (really?, PDFs that are fillable on a computer but no web forms to avoid the save & send by email? (or print))
- mbesto 5y ago
  > They are slowly becoming modern. It doesn't even need to be modern. Just usable.
- mschuster91 5y ago
  PDFs are accessible: a person distrusting computer transmission or without a computer can print out the form and send it via postal service. Also, you can save a filled out PDF (or copy a paper) to have a copy of what you submitted in your records, something that is impossible to do with most webform solutions.
  - BrandoElFollito 5y ago
    > PDFs are accessible: a person distrusting computer transmission or without a computer can print out the form and send it via postal service. Yes, this is very useful when you do not have or want to use a computer. But if you fill in a PDF form on a computer, better go for the web app whihc will be easier to read and has a higher chance to actually work (the govt PDF will always have that one weird field that cannot be filled). > Also, you can save a filled out PDF (or copy a paper) to have a copy of what you submitted in your records, something that is impossible to do with most webform solutions. It would be enough for the web form to send you a confirmation, making it also an acknowledgement of your request. We already have this for taxes for instance.

readflaggedcomm 5y ago

>Use this new feature wherever services already have a ‘none’ checkbox. So I guess this is mostly about standardization in the toolkit, which makes the whole thing easier to work on and modify (or translate into a different front end) in the long run.

johnday 5y ago
And of course, it's standardised for users too, who can now expect a more unified way of interacting with government digital services.

wongarsu 5y ago

It makes perfect sense. For a question like "which types of waste do you transport" you ideally want to differentiate between "None, I don't transport waste", "Other, I transport waste that isn't on the list", "I don't know/don't want to tell you" and "I forgot to answer this question". But it's really easy to design a form so that all of these map to not checking anything, which will probably lead you to drawing wrong conclusions when looking at results with lots of no-answers. And in this case they did the right thing and don't allow you to both check "none" and any of the other checkboxes, preventing you from giving nonsensical answers.

memco 5y ago
They do have logic for reconciling the responses so you can't check "some" and "none", yes. But the article states: > Finally, we also added some JavaScript code to prevent users from ticking the ‘none’ checkbox as well as one of the others. This is to avoid users giving contradictory answers. I hope they have server side checks as well because this enhancement comes at a cost of state management that isn't guaranteed to happen if JS is the only barrier to reconciling incompatible selections.
- xmprt 5y ago
  Why would the server side code have to change for this? A none checkbox could just be translated to an empty array and passed down to the server as if none of the options were checked.
  - wildrhythms 5y ago
    A particularly annoying problem with front-end validation is that it's not difficult to circumvent the Javascript logic, check both 'None' and 'All', and send it to the server. It becomes the server's responsibility to make a decision about whether 'None' or 'All' takes precedent.
    - nicoburns 5y ago
      In this case the server likely doesn’t have a ‘none’ option. The none option in the client will be translated into an empty array (or false for all the other options). So circumventing the client isn’t likely to get you very far.

open-source-ux 5y ago

This is a nice pattern - simple and effective. Although adding a 'none' option may seem like a minor detail, it's a small detail that can improve any form. Here is a bigger screenshot of the pattern. In this example (from booking a vaccination appointment), you are asked if you have any access needs (or none): https://i.postimg.cc/R0D0Fn9Y/online-form.png https://i.postimg.cc/R0D0Fn9Y/online-form.png This 'none' pattern can work well on paper forms too. For example, on some paper forms I scribble N/A (not applicable) when there is a long list of options but none are applicable to me.

jffry 5y ago
The introductory paragraph links to their high-quality component documentation, which contains not just code examples but also clear guidance on things to do and avoid when using it. From there it embeds an interactive example: https://design-system.service.gov.uk/components/checkboxes/with-none-option/index.html https://design-system.service.gov.uk/components/checkboxes/w...

mg 5y ago

I experimented quite a lot with "3 state checkboxes" at Product Chart. The Product Chart interface offers a ton of checkboxes. Because the most typical use case is that a user wants to "tick" a feature. Like "I want a laptop with a touchscreen": https://www.productchart.com/laptops/ https://www.productchart.com/laptops/ But sometimes, users want to exclude a feature. Like "I want a 3D printer that is not assembled". After some experimentation with custom 3-state checkboxes, I decided to go with this type of dropdown: https://www.productchart.com/3d_printers/ https://www.productchart.com/3d_printers/ By default it displays "Feature". And when dropped down it has the options "√ Feature" and "√ No Feature". So far, users seem to grasp this intuitively. The nice thing is that it is self-explanatory and takes up only one line of space.

noctune 5y ago
Nice site. I'm not sure the dropdown looks great on OS X though. On OS X, the selected option is prepended with √, so it looks like √ Feature √ Feature √ No Feature Selecting the second element then shows Feature √ √ Feature √ No Feature It ends up looking somewhat odd.
- mg 5y ago
  Oh wow, you are right. The same happens on the latest iPadOS. Must have changed since I tested it last time. I guess that's why nobody is using native elements. They can break any time the browsers change their appearance. Guess I will have to create a custom element that "simulates" a plain dropdown.
  - mwcampbell 5y ago
    > Guess I will have to create a custom element that "simulates" a plain dropdown. That would probably be a regression for accessibility.
  - voussoir 5y ago
    Another option might be to rephrase them as "Assembled or Disassembled", "Assembled", "Disassembled". At the moment you're using the checkmark to disambiguate between not-chosen and chosen, but rewording the not-chosen to clarify that it includes both could achieve the same goal.

notafraudster 5y ago

Last year while working on some public opinion polling software I ran into an issue where I found that analysts often wanted to know the difference between someone selecting "None", someone skipping the question, or someone not being asked the question due to branch logic. It's a pretty easy problem to solve -- if you represent the response as a string, you use "None", "", and "Not Asked"; if you represent as numeric, you just set numeric codes for each. But the interesting thing is just that it's sort of an invisible distinction until you think about it, just like this one is. I don't really do a lot of UX stuff myself and it was kind of a cool moment to have to think about it a little.

gorpomon 5y ago

I'm new to the UK and the gov.uk sites are a true breath of fresh air. I still wish they gave more context on questions, but the quality of the site and using their forms is excellent. The consistency is also amazing, every form I've used behaves consistently, so it's easy to build up a muscle memory in using them.

stoned 5y ago

This is great, especially since the none checkbox can probably be added with minimal overhead on the frontend and no changes to the backend. Great research and post. Would have never occurred to me but makes total sense.

irae 5y ago
It would still be a good idea to have backend check for this. - If javascript breaks, (or get blocked by extensions) there should be a check for contradictory answers. - If on future iterations on the UI (more often than backend) logic breaks, backend help improve how to debug the UI update Just to mention a few reasons.
- iudqnolq 5y ago
  I'd guess they do. Another commenter mentioned that when you leave feedback or ask for support they log whether you have JavaScript enabled or not.

samizdis 5y ago

A slight tangent here, but one that I enjoyed: I've used gov.uk services/sites quite a bit and find them easy to follow and almost always written in unambiguous and clear language. So, having seen this post and the positive comments it generated about gov.uk, I went to the main site and posted a shout-out for the team (especially UI/UX) with a link to this thread. I left my name and email address in the boxes that allow you to request a reply. I received two automated responses. One contained a tracking link to see the status/progress of my query/comment. The other contained a copy of my comment for my records, and also some info about my set-up at the bottom: > [User agent] Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/95.0.4638.69 Safari/537.36 > [JavaScript Enabled] false > Thank you, > GOV.UK User Support Team That's a nice touch, in my opinion, and it made me smile.

d1sxeyes 5y ago
Their internal guidelines on ease-of-reading is to target a reading age of 9. There's a blog that mentions it here: https://gds.blog.gov.uk/2016/02/23/writing-content-for-everyone/ https://gds.blog.gov.uk/2016/02/23/writing-content-for-every... I don't remember exactly where this is published formally, but I've come across it before.

e2le 5y ago

If only more sites took inspiration from gov.uk, "modern" sites might not be the barely usable mess they are today. Unfortunately some see gov.uk as an "eyesore" and not something to learn from.

frosted-flakes 5y ago
Governments around the world have taken inspiration from gov.uk and the GDS. Even my own province's website closely resembles gov.uk in many ways.

johnmato 5y ago

I'm really impressed by this initiative.

adrianmonk 5y ago

> allowing all checkboxes to be unticked means that users might accidentally skip the question, perhaps assuming that they’ll return to it later This also means the software can validate that the user hasn't skipped the question. With a "none" option, the user can distinguish between not answering and answering in the negative, and so can the software.

throwawayboise 5y ago
It also make coding the backend somewhat easier, as unchecked checkboxes/radio buttons are not included in the POST data. Not sure how much this is an issue with modern frameworks but when I did HTML/Forms work this was a constant surprise to newer developers.

adrianmonk 5y ago

An alternative UX pattern is to have a "yes" checkbox and a "no" checkbox for each one of the options, with (obviously) neither checked by default. If a user positively answers yes or no for each option, then an all-"no"s response equates to a positive "none". It's very tedious, so you should probably not do this most of the time. But it could be appropriate if it's extremely important to encourage the user to individually consider whether each of the options applies. By forcing them to click on each line, you discourage them from rushing through without reading, skipping to the end, and just checking "none". I've seen this UX pattern on paper vaccine forms, for example. They want to know if (1) I'm pregnant, (2) I'm allergic to eggs, and (3) I have Guillain-Barré syndrome. They could ask me to check all that apply, but instead they have yes/no for each one.

hunter2_ 5y ago
As much as I prefer electronic forms over paper, the ability to draw a continuous vertical line through all of those "no" boxes is quite nice compared to actually marking each separately.
- adrianmonk 5y ago
  I smell an opportunity for someone to create gesture-based HTML forms. Seriously though, this brings up an important point. People don't like excessive paperwork, so this pattern should be used very sparingly. Users' time and attention is a scarce resource. You can't magically create more of this scarce resource by applying a UX pattern. People will respond by putting themselves on "click no, no, no, no, no, no, and no" autopilot.
  - graywh 5y ago
    I build data collection instruments for biomedical research and we often put "yes to all" and "no to all" at the top of a table of yes/no questions
    - aembleton 5y ago

jorgeudajer 5y ago

Impressive and quite comforting to see a public entity tackle an issue that many private companies (even in the UX industry!) ignore.

zucked 5y ago

Not from the UK, but I poke around on the portal from time to time. It's a true breath of fresh air. I love how you can deep dive into a specific topic of interest without really leaving your place. Example: https://www.gov.uk/browse https://www.gov.uk/browse The way the menu behaves is both predictable AND useful for browsing around. My local government site is constantly whisking you off to separate sites, each with its own design language and unclear path back to my place of origin. The team responsible for all this does it right.

frereubu 5y ago

Whenever I see a blog post like this about the gov.uk design system I think about the millions of person-minutes small changes like this must save. My wife is Spanish and whenever I have to interact with Spanish bureaucracy it's like night and day. (This is partially to do with the inherited culture in each bureaucracy - we needed a certified translation of our marriage certificate, and the translator told us that the consulate had put the wrong email address on their website for her. She spent so long trying to get them to update it on their website that eventually she gave in and created the incorrect email address so she could pick up the emails that people were sending).

treeman79 5y ago
20 years ago a friend noticed his social security cars as female. So he spent a few months trying to fix it. He eventually gave up.
- marcodave 5y ago
  Missed opportunity to end the last comment with > She eventually gave up

rzzzt 5y ago

Slight tangent: is the plural form of carcass really "carcuses"?

nielsbot 5y ago
Wiktionary says no: carcass (plural carcasses)
- rzzzt 5y ago
  Going the other way round, I found one article where "carcus" is mentioned in singular form.
  - nielsbot 5y ago
    link? update: Ha. Wiktionary has an entry which says "misspelling of carcass" https://en.wiktionary.org/wiki/carcus https://en.wiktionary.org/wiki/carcus