27 ms·

In loving memory of square checkbox

• romwell 3y ago
  Windows 95 remains the pinnacle of clear, discoverable GUI. It's like the companies rolling out UI elements don't even bother running them past people, and are guided solely by what the design department thinks looks cool that day.
  • function_seven 3y ago
    I’m might quibble a bit and choose Windows 2000, or even XP despite the Fischer Price skin, but generally I agree. Clickable things should have some minimal skeuomorphic detail and scrollbars need to be a minimum of some thickness.
    • emayljames 3y ago
      Especially scrollbars. For a webdev trying to figure out what element triggers the scrollbar is extremely difficult with thin disappearing scrollbars.
    • ginko 3y ago
      You could disable the Fischer Price skin in XP. Many people did.
  • beders 3y ago
    It was IBM who established the standards with its CUA books. https://en.wikipedia.org/wiki/IBM_Common_User_Access https://en.wikipedia.org/wiki/IBM_Common_User_Access
  • TheChaplain 3y ago
    This with MacOS 9 and GTK2 not far behind.
  • vultour 3y ago
    Windows 7 was the last one that let you select the "classical" pre-XP theme. I was the only person I know who used it, and I miss it to this day.
    • seabass-labrax 3y ago
      Lots of educational institutions and public libraries used it here in Britain. I think it was good at squeezing a few years of extra life out of the hopelessly underpowered machines that they bought, but I rather think removing the myriad copies of Java Updater and the McAfee Virus* would have been more effective. * Officially called the McAfee Antivirus, but I've never understood why
• dexwiz 3y ago
  I like the checkboxes and loath the toggle. But after surveying people outside of the tech scene, for anyone with processing issues like ADHD, they report check boxes as easy to misinterpret. Something about the physical movement of the toggle helps them. So I relent and implement toggles. But yeah, fuck round checkboxes. Shows the people driving now are more business oriented and have no love for the culture.
  • dheera 3y ago
    I like toggles, they are much larger touch targets and easier to hit one-handed when you're running late to a meeting and can't hold your phone still.
  • orangepanda 3y ago
    I dislike toggles as the on/off state is not always obvious. Some fun examples I've encountered: * red is "on" and by default already selected, black is "off"; * black is "on"; * saw one cookie consent form with red meaning "on", and green meaning "off".
    • emayljames 3y ago
      That is frustrating, and very bad accessibility. It should always be grey = off, darker = on.
      • jameshart 3y ago
        Except in dark mode when lighter should be on.
    • mike256 3y ago
      If you like to design good UX, you shouldn't look at any cookie consent forms.
    • masklinn 3y ago
      > saw one cookie consent form with red meaning "on", and green meaning "off". Cookie consent forms are specifically designed with all sorts of misleading and user-hostile patterns, so I would not take them as an example of anything. I'm sure there are consent forms out there with checkboxes where checked means no.
• vasvir 3y ago
  Nice Article with a lot of research to gather all these screeshots that sent me down the memory line. What can I say? The world (of computing) changes under our feet. Nostalgia on Sunday morning...
• ggm 3y ago
  In a similar vein, try explaining to a senior with fading skills that under material design literally nothing is a clue that a region on your screen is a button you can press. Only prior use can inform what is active, and what is not.
  • Smoosh 3y ago
    And making it worse, past experience with other apps cannot be relied upon.
    • arcanemachiner 3y ago
      And the UI completely changes every year or three, because progress or something.
  • Dalewyn 3y ago
    I am a mid-30s senior by this definition. Well, maybe I am a senior. I know I spend far more time screaming at clouds nowadays and grow increasingly distant from what kids today are into.
    • deleted 3y ago
      [deleted]
    • sph 3y ago
      I don't blame the kids: the brutalist yet colorful zoomer UI design is much easier to parse for 30 year old seniors than the flat UI/material crap our generation created. I have no way to defend this argument but my eyes, but I can say that Google's Material design is the most bland, insipid of them all, and I would rather see Bootstrap again than another Material-inspired with its white cards on white background and tap animations. Just kidding, Bootstrap was as bland. I miss Windows 2000 every day.
      • zilti 3y ago
        What is that zoomer UI you are referring to?
• al_borland 3y ago
  It sounds like this may be done in an effort to improve the reliability of eye tracking in VisionOS when dealing with checkbox, not Apple just throwing the design book out the window for no reason. >In general, prefer circular or capsule-shape buttons. People’s eyes tend to be drawn toward the corners in a shape, making it difficult to keep looking at the shape’s center. The more rounded a button’s shape, the easier it is for people to look steadily at it. When you need to display a button by itself, prefer a capsule-shape button. https://developer.apple.com/design/human-interface-guidelines/buttons https://developer.apple.com/design/human-interface-guideline...
  • Mtinie 3y ago
    I may be missing a fundamental point of your comment or from the linked content, but given the minuscule number of users who’d be concerned with this in practical presentation, I sincerely hope that the UXers involved didn’t optimize for this use case.
    • al_borland 3y ago
      From the OP’s article: >Apple is the first major operating system vendor who had abandoned a four-decades-long tradition. Their new visionOS — for the first time in the history of Apple — will have round checkboxes. So the death of the square checkbox they are predicting is only in the context of VisionOS. Apple’s HIG explain why this decision was made (my link), so I don’t think it is part of a larger trend and we shouldn’t expect it to impact anyone not using VisionOS, or other such headsets with eye tracking. It was done for technical reasons relating how the person will interact with the device, not style reasons.
      • Dalewyn 3y ago
        [flagged]
        • ludwik 3y ago
          I don't understand why some people feel the need to attack the only person in this thread who provided context about the change being discussed. You may agree with Apple's decision, or you may not. You might believe that it will have far-reaching negative consequences for the entire industry. Regardless, al_borland sharing the reasoning behind the decision (and linking to the source) is valuable and is the opposite of 'living under a rock'.
• eviks 3y ago
  While the checkbox is less confusing than a lot of toggles (eg, the ones in Windows' settings are bad), relying on the unintuitive distinction between a circle and a square is just one of those bad old UI traditions that, I guess, persist until the next tech generation, little to love here. The better UI would be for the circles to be visually connected somehow to illustrate that only one selection is possible like you have in physical switches with more than two positions
  • saghm 3y ago
    > The better UI would be for the circles to be visually connected somehow to illustrate that only one selection is possible like you have in physical switches with more than two positions This is an interesting point. Radio buttons are kind of weird in terms of their initial position because unlike with checkboxes, there's no way to get back to the "empty" state where none is selected. It took me a bit to wrap my head around what you described, but the more I think about it, the more it seems like a "slider" with clearly marked stopping positions. If it's too confusing for people to have some sort of "default" option, maybe having a different color for the part of the slider that's moved based on whether it's in a valid position could help; at the top of the slider, it could be one color indicating "must be moved", and then when you slide and drop it at one of the marked options (or click the option; it could move automatically to the position like a scrollbar), it changes color to show it's valid.
    • eviks 3y ago
      Could be a slider with the same radio circles denoting the stopping position, could be those circle volume buttons with labeled marks, could be non-circle switches like these (other/position/steer on the right) https://img1.wsimg.com/isteam/ip/b81ca6f4-730a-4561-852c-0967c494c50f/20210408_165433.jpg https://img1.wsimg.com/isteam/ip/b81ca6f4-730a-4561-852c-096..., etc Re. the missing default - you can have an explicit element "none selected" with the slider positioned there Plenty of options to make UI more intuitive
    • xg15 3y ago
      Microsoft briefly experimented with this, in the "security zones" dialog in Windows XP: http://hs.windows.microsoft.com/resbox/en/6.2/main/9f04b9c9-cf6e-4797-92cc-a5d0cab42db6_76.jpg http://hs.windows.microsoft.com/resbox/en/6.2/main/9f04b9c9-... It's not the exact design you describe: The slider is there, but only the label of the selected option is shown, the other options are only represented as tick marks. I think there are two problems with the design though, (which would also still be there if all labels were shown): - The slider widget back then was normally used for selecting continuous numeric or at least interval scaled input values: That's what the mechanism of dragging it with the mouse was developed for. It could be configured with a small number of discrete values as options, but then dragging became awkward: Either the ticks were spaced very far, then you had to drag the cursor a long distance before there was any kind of visual feedback at all - or the ticks were spaced closely, like here, but then dragging the slider to one specific tick became difficult. - It's possible to click the slider, but there is no visual indication that you can do so. In fact, the visual indicators are almost inverse to how you'd need them: The selected option has a big handle that you can not click (only drag), the unselected options have no handle though you can actually click on the empty slider bar to move the handle in that direction. I guess that's why they never did this again after this one try - which is sort of a pity, because you could probably build a redesigned slider widget optimized for discrete input that solved those problems.
• squarefoot 3y ago
  Not to mention the confusion arising from checkboxes in web pages used in place of checkmarks. A checkmark alone should be the correct object to use for output only, while a checkbox normally would accept an input from the user. I don't recall where, but have seen this some times around the web and found it misleading.
• sumuyuda 3y ago
  I think the difference with the square checkbox is that it is for desktop UIs and clicking with a mouse. The circle checkbox is for mobile UIs where you are tapping with your finger.
  • deleted 3y ago
    [deleted]
  • deleted 3y ago
    [deleted]
  • emayljames 3y ago
    It removes the ability to instantly know whether you have a multiselect situation or a select-one situation.
    • hulitu 3y ago
      It doesn't matter. The user is an idiot. Just make sure that he enters its credit card details correctly. /s
      • deleted 3y ago
        [deleted]
    • deleted 3y ago
      [deleted]
  • mseepgood 3y ago
    You can't tap a square with your finger?
    • steezeburger 3y ago
      You might cut your finger on the sharp corners
    • deleted 3y ago
      [deleted]
• antonyme 3y ago
  Great article, and terrible idea. Wonder why the UI guidelines were bent here. It's astonishing how many web designers have no idea about the difference between inclusive and mutually exclusive options. I see checkboxes used all the time when they should be radio buttons. It's not rocket surgery. https://www.nngroup.com/articles/checkboxes-vs-radio-buttons/ https://www.nngroup.com/articles/checkboxes-vs-radio-buttons...
  • tussa 3y ago
    All in the name of simplicity. Eventually Apple devices will just have one button that says "give us money".
    • deleted 3y ago
      [deleted]
    • tialaramex 3y ago
      Pressing a button would be optional. No need to give Apple's customers a confusing choice - just transfer all their money to Apple who can prioritise Apple's needs appropriately.
    • 5- 3y ago
      the technology is already there[0]. we're just a few reforms[1] away from having that commercialised. [0] https://pubmed.ncbi.nlm.nih.gov/3492699/ https://pubmed.ncbi.nlm.nih.gov/3492699/ [1] https://reason.com/2021/04/03/abolish-the-fda/ https://reason.com/2021/04/03/abolish-the-fda/
    • vitiral 3y ago
      The MacBook Wheel! https://youtu.be/9BnLbv6QYcA?feature=shared https://youtu.be/9BnLbv6QYcA?feature=shared
    • ClassyJacket 3y ago
      That's called a poker machine.
    • __MatrixMan__ 3y ago
• beachy 3y ago
  Much as I love a good rant like this, I have to wonder if this is just the world moving on. I used to hate it (still do a little) when I toggle a checkbox, then go to hit "Save" and realise that the checkbox had immediate effect. Now I observe that this is almost the norm. I guess I need to get over it. I also hate it when people changed the scrollbar behaviour in any way. Then today I realised that one of my micro-frustrations with eclipse is that some UX genius decided to make the scrollbars fade away if there is inactivity. (Inactivity of a few seconds in an IDE is pretty normal - it represents thinking!). But then I reflect that eclipse is a hard core programming tool, used by exactly the kind of people I would have expected to hate on this kind of thing. Instead, it seems that this highly technical audience is OK with this. This article is absolutely on the money, and using rounded checkboxes is deliberately sabotaging one of the few strong mental models that we are able to hold about a UI. But maybe this battle is over, and the UX enshittifiers have won.
  • demondemidi 3y ago
    > hard core programming tool lol. eclipse is a bucket of rusty panels held together with duct tape, but embedded companies that can't afford software devs and have never heard of UX/UI cling to it.
  • Kwpolska 3y ago
    Eclipse is a hardcore masochism tool, try IntelliJ IDEA for Java or just about anything else. That said, is this behaviour actually Eclipse's, or is it following the settings of your OS? Windows 11, macOS, and probably some Linux things, decided that scrollbars are not cool and should be hidden or shrunk — but there should be an option to disable that (in Accessibility settings in Windows, in Appearance on macOS). Eclipse might also have its own setting.
  • hulitu 3y ago
    > if this is just the world moving on. It is just running in circles. It took Microsoft 3 releases to insert a background color selection in Win 10. I think that around Win 12 it will regain the option for foreground color. /s
• rubymamis 3y ago
  Apple ditched square checkboxes long ago in Apple Notes: https://imgur.com/a/HLrnXn3 https://imgur.com/a/HLrnXn3 I believe it was this way since the introduction of iOS 7 in 2014[1] (article from 2016). [1] https://osxdaily.com/2016/01/25/how-to-add-checklists-to-notes-in-ios-os-x/ https://osxdaily.com/2016/01/25/how-to-add-checklists-to-not...
  • deafpolygon 3y ago
    This may be petty, but this is one of the reasons why I don't use Apple Notes. The design.
    • rubymamis 3y ago
      I like its design - it's simple and familiar and just works. The circular checkboxes are annoying tho.
    • sph 3y ago
      I bought a Macbook in 2015 because I always loved their UI design. Safe to say, whatever's going on with Apple Notes was not what I had in mind. The best designers in the world, keeping alive the worst UI trend of making everything flat and white without any separation, border or shading whatsoever.
• Calzifer 3y ago
  If I think of square checkboxes I think of sharp corners. Maybe I should write an article "In Loving Memory of sharp corners" because I definitely miss them but they seem to be extinct from the modern Web and GUI in general. If I skim the article only old screenshots contain sharp corners. None of the new once. I have a browser where I configured "border-radius: 0 !importent" as userContent.css for fun. Was sometimes surprised how much it is used. Especially how many circles are today actually boxes with a large border radius.
  • Kwpolska 3y ago
    border-radius: 50% is the easiest and most compatible way to make a circle in CSS.
    • moon_moon 3y ago
      [dead]
  • chrismorgan 3y ago
    > Especially how many circles are today actually boxes with a large border radius. HTML is all about rectangles. If you want circles, your choices are a straightforward CSS border-radius, or an SVG <circle>. And let me tell you, if you can just slap style="border-radius:50%;overflow:hidden" onto an <img>, or faff around with <svg>, <image>, <clipPath> and <circle> (or maybe you can even use clip-path="circle() fill-box" these days, can’t remember if support is there yet), I know which a sensible person will prefer.
• annabyrd 3y ago
  This made me feel warm and fuzzy inside! TY
  • hi083 3y ago
    me too
• lstamour 3y ago
  I’m surprised nobody has mentioned that iOS has had round checkboxes since forever? https://ux.stackexchange.com/questions/116712/apples-round-checkboxes-where-and-when-are-they-used https://ux.stackexchange.com/questions/116712/apples-round-c... Likewise I thought the article’s punchline was going to be the increasing use of on-off toggles instead of checkboxes. Like how the settings app on macOS now has more on-off toggles than ever before. Personally though, my fav pet peeve remains the unclear toggle button. When the icon is white, is it on? Is it off? Does the line through the microphone mean it’s muted? Or that it mutes when tapped? No one knows, tap it a few more times to find out…
  • cyclotron3k 3y ago
    Google Mail and Google Photos on Android also have round checkboxes.
    • gardenhedge 3y ago
      Yeah Gmail immediately came to mind for me. It feels natural tbh
  • ncruces 3y ago
    The toggle is supposed to convey immediateness, like a light switch turning on bluetooth is immediate. A checkbox is like filling a form, it requires submission for the action to take place.
    • ratg13 3y ago
      The parent comment is talking about how the colors are often set on a toggle. That the user never knows if the toggle is in the on or off position.
      • stavros 3y ago
        Your parent is talking about their parent's second paragraph, about toggles in settings.
• pgeorgi 3y ago
  I suppose people forgot what "radio buttons" are (and where the name comes from). At least I haven't seen them on non-vintage devices in ages. WIth that, it might make sense to reevaluate if they're still a useful UI language idiom, and if the different handling is still necessary.
  • Kwpolska 3y ago
    The name might be antiquated, but the difference is still important and understood.
  • skgough 3y ago
    I also think the visual idiom doesn't hold up, especially since implementers don't use radio buttons correctly half the time. To help people get the idea that they are possible choices for the same attribute, I like to wrap them in a <fieldset> with a <legend> that explains what their [name] attribute is associated with. I think this is how Win95 did it back in the day too
• NoZebra120vClip 3y ago
  Around 2015, I authored my résumé in LibreOffice, and I sprinkled in an assortment of bullet points. Some were indented. I used open squares, filled squares, open and filled circles, right-arrows, stars, etc. I brought it into an employment center for critique, and my mentor informed me that those shapes all had different meanings and functions. It was a wake-up call for me. I am not a UX/UI designer, so my experience with the UI elements in applications had been intuitive, and moreover, disconnected from the activity of authoring a non-interactive document. So I believe that these UI features were imitating paper-based forms. Those ovals or circles on Scantron sheets: you'd better not fill in more than one per line! And being named "radio buttons": yes, if you pressed "AM" then the "FM" button popped out. If you had six presets in a car--wait a minute, those were oblong...
  • teddyh 3y ago
    > my mentor informed me that those shapes all had different meanings and functions. I have never heard of this. It sounds dubious, like those “flower language” lists which are all different.
• crucialfelix 3y ago
  Actual radio buttons in cars were for the most part rectangular https://www.shutterstock.com/search/radio-buttons-old-car-radio https://www.shutterstock.com/search/radio-buttons-old-car-ra... There's a good explanation of how they worked here: https://www.physicsforums.com/threads/how-do-old-timey-radio-buttons-work.956716/ https://www.physicsforums.com/threads/how-do-old-timey-radio...
  • barnabee 3y ago
    It's obvious with hindsight, but I had never realised that that is why they're called radio buttons!
    • arcanemachiner 3y ago
      Imagine the poor bastards in the future trying to comprehended the floppy-disk "save" icon.
      • crucialfelix 3y ago
        Those poor bastards are here now. I'm teaching my 7 year old all these strange words and icons. We carry so much historical garbage.
      • Izkata 3y ago
        I remember seeing a post like a decade or more ago of someone asking why you click on a little TV to save documents.
    • seabass-labrax 3y ago
      Me too! I had assumed that 'radio button' was a bastardization of 'radial button', referring to the very shape which the author notes is conventionally used for them.
• xg15 3y ago
  My impression is that in modern UIs, both checkboxes and option buttons are being phased out: Checkboxes seems to be replaced with apple-style toggle buttons, which I guess are more intuitive for some people? Option buttons don't have any direct replacement that I can think of, you just see them incredibly rarely. My guess is that they always were one of several possible means to have the user select from a set of choices, the other prominent ones being a plain listbox widget or a combobox/dropdown widget - or of course, just use plain buttons. For some reason, designers seem to prefer plain buttons or a dropdown for this usecase today.
  • toyg 3y ago
    > apple-style toggle buttons, which I guess are more intuitive for some people? You seriously overestimate the average competency in UX circles. The algorithm outside Apple is basically "what would Apple use here?". The algorithm inside Apple is basically "what will make people talk about us?" Serious studies are for boring people. Design hipsters don't want to look boring.
  • lou1306 3y ago
    Toggles are actually not that bad as a checkbox replacement. But I feel they convey a lot of meaning through color (in iOS, sliders turn green when selected), whereas checkboxes reimain immediate even in b/w. I wonder whether people with severe colour blindness have any issue with that? Ahh why didn't I take interface design as a career :)
• ipsum2 3y ago
  TIL radio buttons were named after the physical buttons used on older radios to select preset stations[0]. IMO they look nothing like the actual buttons on radios. 0: https://en.wikipedia.org/wiki/Radio_button https://en.wikipedia.org/wiki/Radio_button
  • eskodhi 3y ago
    Yeah the name definitely refers more to the functionality/behavior of the buttons. You'd push one of those buttons in to select a station and it'd stay pressed. When you push another button in to choose another station, the previously pressed button would "pop" back up/depress (thereby "unselecting" itself), thereby enforcing the mutual exclusivity of a station selection.
    • thaumasiotes 3y ago
      That wasn't anything to do with radios though. That was just the way mutually exclusive buttons worked. I had a portable tape player where the playback controls were the same way.
      • moon_moon 3y ago
        [dead]
  • jeroenhd 3y ago
    We have controls that mimic the actual radio buttons in the form of toggle buttons (buttons that stay depressed after pressing them), but in many APIs the programmer needs to toggle the press state of all other buttons in the group to use them. Preset radios came in a huge variety and some of them were actually round. Car radios (the radios that have stuck around the longest) need big and bulky buttons so you can operate them without taking your eyes off the road, but some home radios had smaller, circular buttons instead. The "radio" buttons I used as a kid were small, rectangular sticks poking out of a metal plate that you pushed in. Every brand had their own shapes and designs. Unfortunately, I can't find any pictures of older radios on the internet because every image searching site seems to have been overtaken with badly generated AI art, stock photos, and cheap, plastic "retro vintage" Amazon listings.
• at_a_remove 3y ago
  If it is round, it isn't a checkbox, it is a checkhole. People see something round, "box" isn't the first word that comes to mind. In my previous history as a ... as a web person (I think that's both broad and vague enough to encompass the yes-I-did-that-too sense of things), I had an ever-growing disdain for the designers who were off on their own flights of fancy. Usable? Explainable? Accessible? Senior-friendly? Then, late to the party, I got this iPhone thing and I was astonished at how much the device expected me to know about how the interface worked, on a deep level. I tried to get my mother into an iPad and, frustratingly, could find no good cheat sheets on the "gestures," to the point where I made a laminated, color-coded and numbered set of sheet on gestures, screen, etc. I help out an even older senior with her computer and ... well, I think the i-UX people are frankly out in their own la-la land and their hubris is sustained only by Apple's inertia/network effect/market dominance. In a kinder, gentler world, these UX teams would be required to make a general style sheet document, which would be applied to various real-world applications, and then they would be forced to watch a senior citizen attempt to navigate their trash to, say, get a test result from the hospital. Should this not be accomplished in under five minutes, they are thrown into a hell of leather-clad demons who beat them with sticks while patiently explaining that their design, in fact, sucks. UX design has begun to resemble fashion in an Oscar Wilde manner, "so intolerable that we have to alter it every six months." It's getting divorced from meaning and utility, and worse yet, constancy. Nobody wants to relearn UX for your crap app just so you can be cutting edge with sliders that resemble the phases of the moon.
  • wruza 3y ago
    This makes me rethink the idea of buying i-things for my grandma, thanks. That said, I see her struggle with android-based devices everyday. Both get shittier and shittier with years, we just tend to suffer less due to the boiling frog situation. I fully support the proposed initiative.
• userbinator 3y ago
  Apple seems to have been one of the main forces behind the trend of adding rounded corners everywhere in UIs, which frankly is a style I don't like at all. The irony is that some of their hardware has painfully sharp corners, the one place where rounding them would greatly improve comfort --- anyone touched the edges of a MacBook or Mac Mini and thought "why did they not smooth these off"?
  • thaumasiotes 3y ago
    When I had a macbook, I had to buy a plastic case for it, because otherwise its hard, pointy metal surface damaged my fingernails.
  • yreg 3y ago
    That's a matter of preference. I like the sharper iPhone forms more (4, 5, the first SE, 12 and onwards). I also love the sharp look of Mini and iMacs (especially the 2007 - 2015 ones).
• seydor 3y ago
  they are replaced by those slider-switch that came from mobile and are supposed to resemble lightbulb switches. A specific type of switch that seems to be popular in america, and it s hard to immediately grasp for most others
• its-summertime 3y ago
  > That’s why it’s common to see radio buttons containing checkmarks The radio-buttons prior all included an additional inner circle to imply a selected state. You can't just have empty and filled, since filled could be off, and empty could be a filled circle over a filled circle, in other words on. La, the prior was only good design because it was common design.
  • the_gipsy 3y ago
    It's the same for radio and checkox. All combinations of checked/unchecked, enabled/disabled, and focused/unfocused exist.
• musha68k 3y ago
  Since ~2013 Apple designers have been throwing over board lots of conventions the company had been itself establishing for decades. I remember user interface design class at my university ca. 2005 where 20 out of the 30 best practice interaction design patterns originated at Apple! Steve Jobs for the most part really cared and you could feel those priorities clearly: "it's how it works, not how it looks!" Aside from some natural missteps, the "form over function" critique at the time was predominantly false. Apple is slowly getting there though, joining "ignorant web" as correctly called out here by Nikita. The thing is that none of this is a joke or could be taken however lightly. It's 2024 and by now we've fundamentally realized the "Software is Eating the World" prophecy; living in a digitally permeated world. Bad design is a moral issue, in worst case scenarios it has been killing people before and will increasingly kill or harm even more going forward. It always starts with the little things, especially so in design / engineering. I desperately hope that Zoomers at least will start to realize that Millenials really fucked it up in that regard. I know, I know it also were the bosses pushing for this but we clearly should have said "no" much more often as the professionals (?) implementing this stuff. There is much satisfaction waiting in learning; a full-grown craft with deep history. Zoomers: Alan Cooper's "About Face" is a great start, probably super cheap these days as seemingly no one cares anymore.
  • deleted 3y ago
    [deleted]
  • anon373839 3y ago
    For a few years in the last decade, it seemed that UX design was getting recognized as a serious discipline rooted in user research. Then, somehow, it devolved into fashion. When/why did that happen?
    • kibwen 3y ago
      > When/why did that happen? There's no money in making a thing that works well, only in making things that look good. Effectively 100% of people who are using software are using it for things that fundamentally don't matter, so why should they care if the functionality is shit? Personal computers and phones are fashion statements, not useful devices. Business computers and phones exist to facilitate the bullshit jobs that employ the majority of the white-collar population. Follow the money; nobody with money cares.
• alentred 3y ago
  I remember reading a book about UX years ago, and one of the fundamental principles there was the discoverability and the intuitive use, which boiled down to sticking to conventions that are rooted in everyone's experience. Stuff like using check boxes and radio buttons properly, having the "OK" and "Cancel" buttons in their regular places (and not a "Maybe later"), using unambiguous confirmations (unlike the "Are you sure you do not want to not unsubscribe?"), sticking to the same navigation patterns users see in most other apps. Now, I don't subscribe to it in full. There needs to be room for innovation. To my taste, it was quite boring when all software looked literally the same. Nevertheless, I agree there needs to be some reason too. Some short time ago every new app looked like a new game where you needed go through a tutorial to learn the basics. That was probably too much. But, I don't know, as of late it feels like this iteration comes to and end, the apps start being intuitive again and reuse some patterns. The sidebars, user menus, etc. all in the same place. Mostly. So, yay discoverability and intuitive use. But that doesn't mean we can't innovate in UX, while keeping it intuitive. Just not the "Maybe later" abusive way, please.
  • jeroenhd 3y ago
    There's nothing wrong with innovation, of course. A lot of controls needed to change to work well on touch interfaces, like the sliding toggles iOS use(d), and the large, connected touch areas that have replaced the small labels and click targets that computers used to have. There's no reason to abandon the toggle button/checkbox distinction, though. They're still used distinctively, there are common practices to indicate those distinctions that go back decades, and I don't see any need to unify these controls.
• AlienRobot 3y ago
  Is everybody insane? I go to Windows, terrible GUI choices. I go to Linux, GNOME makes terrible GUI choices. (Thank God for KDE) I hear about Mac, terrible GUI choices. Did all the people with experience in graphical user interfaces die off or retire?
  • zilti 3y ago
    Pretty much so, yes. It is cheaper to just get some random dude on Fiverr who has no clue about GUI design, but can whip up something pretty that impresses the manager who has no idea about UX and GUI design either.
    • yreg 3y ago
      I don't think Apple outsources visionOS design through Fiverr.
• Findecanor 3y ago
  BTW. Motif (on X11) used small bevelled squares for check boxes and a bevelled diamond shape for radio buttons. There was no checkmark, cross or coloured circle. Bevelled in was active. Bevelled out was not. Example: https://www.oreilly.com/openbook/motif/vol6a/Vol6a_html/V6a.03.06.eps.png https://www.oreilly.com/openbook/motif/vol6a/Vol6a_html/V6a....
  • josephg 3y ago
    For some reason I've always found this design incredibly ugly. My eyes just hate it for some reason.
    • Findecanor 3y ago
      When GTK 1.x and WindowMaker copied Motif's diamond, I hacked/themed both for personal use to make it a circle. SGI had their own version of Motif with a look that was more like Mac and Windows of the time.
    • Nevermark 3y ago
      Nearly all gray, with flat black, no gradients to smooth anything. Gives the impression of harsh lighting. Very sharp-edged 3D boxy window design creates heavy cumbersome feel. Inconsistent pixelly fonts. Oddly aligned text in button. Diamonds happen to be a shape that maximizes pixelation. Indent in vs. out is cognitive heavy to process, relative to something less pure-dual. Black selection border doesn't have consistent widths. Separation line between big button and little buttons, despite obvious size and shape differences that already make that distinction. Extra little borders defining window box corners from horizontal and vertical borders - a distinction that surely didn't need highlighting. No rounding. (Granted, rounding would look pixelated.) TLDR; It looks like an industrial lead brick you really don't want to drop onto your foot.
      • FrontierProject 3y ago
        > Extra little borders defining window box corners from horizontal and vertical borders - a distinction that surely didn't need highlighting. This actually designates an area where you can click and drag to resize the window. I'd argue that this behavior has become a ubiquitous expectation because of this design.
• punkspider 3y ago
  I chuckled when switching to dark mode on this website. The result is hilarious. When clicking it the page becomes dark and your cursor becomes like a flashlight. Definitely doesn't help with reading. Feels like it's a statement against dark mode. I love opinionated blogs like this.
• Eikcalb 3y ago
  This site somehow made me dislike dark mode in a good way. That was wayyyy too dark
• almostnormal 3y ago
  If I remember correctly Borland claimed compliance with some standard for the TUI toolkit provided as part of Turbo Pascal. I cannot remeber which ISO it may have been, or if details like checkboxes were covered by it. Does the current ISO 9241 cover that topic? The three recent main losses of clarity/usability seem to be: 1) links no longer visually identifiable, 2) changes applying instantly instead of only when pressing apply/ok and no cancel button to revert, 3) now the loss of visually identifiable checkboxes. Shouldn't things become easier and more clearly identifiable to use with todays user base of 100% of mankind compared to limited few persons 30 years ago? Why is the opposite happening?
• deleted 3y ago
  [deleted]
• davidverhasselt 3y ago
  I'm missing a good reason why the distinction needs to be made visually clear. More about this at the end. I think a lot of this design thinking is stuck in the past, and we should be able to challenge and throw off some of the shackles or crutches that made sense back then, but might not anymore today, in order to advance and give priority to different goals. In this specific case, it should be clear that you can select multiple options from context or by text, or it should be encouraged to try it out (i.e. easy to undo). If you need to rely on the visual difference of the icon, then you've already lost more than 50% of the people who don't realise this. My thesis is that this visual difference is only useful to a select, minority group of people who have an above average level of interest in software, who would even be aware of it. Yes, they were probably the target market decades ago, but nowadays software caters to a wider group than that, and I wonder if you would survey a group of "normies" how many would actually rely on the visual distinction in any way (even just supportive). I'm late 30s and I remember being confused about the difference between "radio buttons" and "checkboxes" when trying to learn HTML4 when I was young - even the name "radio button" was back then already only something older folks would be able to understand, why it's called that way. The distinction, even conceptually, was more confusing than helpful. It's really just a property of a list of checkboxes, how many you can select, not an entirely different class of UI component. To continue on from my first sentence, and conclude my argument, this whole article does not contain a single good reason why that visual distinction is important in 2024. The closest I could find, is this line which implies confusion: "There was a brief confusion up until 1986 when Apple used rounded rectangles instead of circles". Just the fact that the article has to describe the difference and show visual examples, tells me that this is just no longer a concept that's important, as it may have been 30 years ago, from when it originated. Instead, it only makes references to "tradition", "convention", "internal training", or arguments from authority such as "art director says so". I think that kind of supports my point - in the context of UI of 2024, the only reason that one would keep the distinction visually is for tradition, not for any actual practical reason anymore, or the practical benefits that may still be there have diminished in value so that they don't outweigh the downsides or extra constraint anymore.
  • simion314 3y ago
    >It's really just a property of a list of checkboxes, how many you can select, not an entirely different class of UI component. Not really at all. Radio buttons are part of a group so 3 radio buttons are related and exclusive, there 3 check-boxes represent 3 different unrelated things. The typical example is selecting your gender/sex , you use a radio btn group and put 2 radio buttons or if you are less competent dev you recreate this with checkboxes, scripting and extra validation.
• hermitcrab 3y ago
  Damn you Apple!
  • deleted 3y ago
    [deleted]
• neilv 3y ago
  > I’m not sure when the distinction between square/round was introduced, but it seems to already exist in the 90-s: I always thought everyone was mimicking the 1984 Macintosh on this.
• endofreach 3y ago
  > How should we even call these? Radio checks? Check buttons? Duh, obviously it's a quantum-radio button!
• matricaria 3y ago
  Apples Reminders app has been using round checkboxes for a long time. Not to defend that choice, but visionOS is not the first occurrence.
• wigster 3y ago
  the horizontal switch has doomed us all. terrible design. i absolutely loathe them. is it on or is it off? erm, hard to tell so let's put a little mark inside it to show its on. a little mark. a check mark. you know, like a check box. ffs
• atoav 3y ago
  There are two explainationa for apple deciding to make checkboxes round: - they don't know the difference between radio buttons and checkboxes - they know the difference between radio and checkboxes, but don't care I don't know which of those is worse.
• Nevermark 3y ago
  Forgive me for reflexively jumping to one of my favorite critiques of the universe: Flat design weeds out a myriad of built in affordances of our visual system: - Color to help us more quickly distinguish between things, what the things are, and their roles. - Borders, to demark edges of active usable elements, communicate roles, encapsulate closely related things. - Translucence as a way to combine subtle elements into a single form in a way our visual system can quickly interpret. - Texture as another means of quickly communicating topic separation and indicating roles. Especially useful for areas containing other elements. - Shading that our native visual system naturally interprets as rich 3D information. For processing separation, function, including the state of dynamic function. - Smooth motions to draw attention to, and indicate changes of state. I am NOT suggesting graphical interfaces should: - Resemble a rainbow Christmas tree of "look-at-me!" ornaments. - Organize hierarchical information in n-level nested Mondrian boxes. - Be performatively stylish: overly glassy, shiny, lickable. - Have unsubtle textures, or painstakingly recreate leather, felt, marble, or (dear baby Zeus) grass. - Spray shading and shadows onto everything in an attempt to recreate VR on a flat screen. - Sparkle, blink, bob and weave, and otherwise snow and distract us with motion. I am suggesting that it is madness not to sparingly use large dimensions of our visual processing system, to communicate visual information. These extra dimensions not only provide richer information for our visual fovea, but to our peripheral vision. Our brain is constantly processing peripheral vision to create context. A classic case of form over function. A classic case of "simple" as in "less design work, trivial brand language consistency", not "simple" as in "easy to discover, understand and use". (As with the check/radio/button/selector, I cannot process that Apple fell for flat design. Such corporate amnesia. From design leader to lowest common denominator follower.)
  • xuhu 3y ago
    At some point material design will advance far enough that we can create material design apps in the terminal. I'm looking forward to it.
    • kridsdale1 3y ago
      You can with a terminal AI chat bot tuned for app development
• usrbinbash 3y ago
  > I therefore officially announce 2024 to be the year when the square checkbox has finally died. Or, alternatively, I could just not put up with Apples crap and use something else ;-)
• herbcso 3y ago
  Fuuuuuuuuuuuuuuu... I am DEEPLY offended by this travesty! Why can't we have nice things!? The enshittification is real...
• cloudking 3y ago
  Took me a while to find CSS property "accent-color" to style the color of selected checkboxes.
• toastercat 3y ago
  This blog's neon yellow color scheme makes it unreadable. Luckily, it has a dark mode... which is unusable on mobile. Ironic this post about design is on a blog that's poorly designed.
• HackerThemAll 3y ago
  "people on the Web think conventions are boring. That regular controls need to be reinvented and redesigned. They don’t believe there are any norms." That's why we have the accept button in dialogs (e.g. OK) on the left, or on the right, or in the window's title bar, depending on the intensity of mental disorder of the one designing the website theme.
  • jesterson 3y ago
    It’s not necessarily mental disorder. In some companies, when management runs out of ideas what to do, they start changing UI and pull revenue fluctuations as consequences of those “improvements”.
    • javajosh 3y ago
      It would be a real tragedy if they discovered you could write a webapp such that all such "pushing around the plate" activity could be done via CSS. But of course that is insufficient "drag" to dissipate managements excess energy, so this activity requires backend work as well. Note that this only applies to management at cash cow businesses - startups have plenty of real work to do. This sets up an interesting dimension in the tension between the needs of Enterprise ("make small changes labor intensive") and startups ("make large changes quickly"): too much developer productivity would eliminate 80% of a huge set of bullshit jobs.
      • jesterson 3y ago
        They know about it, but they need to generate some activity. Just changing CSS is way too simple and you can’t claim much credit for that
        • sfink 3y ago
          You can if you do it with an A/B test where you can argue about the percentage of treatment, the duration of the test (is the difference persistent?), and do precise time tracking to log how long the user takes to take an action. That'll bury the actual change in a mountain of configuration, documentation, rollout plans, etc.
• karaterobot 3y ago
  Though I have seen a few instances of it happening, I don't see a widespread lack of square checkboxes. I think he's cherry-picking. But then I spend more time on the web than in mobile. In general, I'm not worried about this. To the extent that it is confusing to users, and to the extent that confusion causes problems, it will be corrected in time. Nobody is incentivized to have bad UI if it costs them money. People on HN seem to think designers run everything, and that they spend most of the day trying to make things harder for users (out of native malice, or because it makes them feel smart). The reality is that in most places, designers actually want things to be better, and product choices are driven exclusively by money made by users successfully using your app. "We can't fix our bad UI because it will make our designers angry" is not something I have ever heard said at any company I've worked for.
• rc_kas 3y ago
  This makes me more angry than I expected to be or should be. Fuckin Apple, fix your checkboxes.
• palisade 3y ago
  I think maybe the concept of () vs [] for radio buttons and checkboxes respectively is in part due to the mathematical concept of a bounded number range where the numbers at the end of the range are included inclusively or exclusively. I'm not saying they're the same concept, but that it might have inspired their usage. Just a theory.
• eduction 3y ago
  Actually!, having two subtly different click-on selectors was never a good idea. There should be no “radio buttons” only checkboxes and then use select menus for exclusive selection. Physical push-in radio buttons have not been in new cars since the 1970s. Even digital radio preset buttons are gone now. Select menus, the kind that popup when you click on them, are unambiguously exclusive-choice menus. Just use those.
• secondcoming 3y ago
  First they came for our scrollbars and I said nothing, Then they came for visible control edges and I said nothing... UI design has had some really questionable 'improvements' over the years.
• mtillman 3y ago
  Good grief Sonoma looks like garbage. Hadn’t looked at side by side comps before. Going to adopt a “don’t hire designers from Apple” policy like the old “don’t hire product people from yahoo” policy.
• scelerat 3y ago
  Small nit: I'm pretty certain the Mac System software from pre-1.0 up until System 7 had identical UI widgets for things like check boxes, radio buttons, buttons, etc. The screen shot in the article is from the Control Panel desktop accessory (DA) which is showing radio buttons in a compressed or stylized way because of the compact nature of the DA
• krick 3y ago
  The only place I've noticed this is Telegram UI, and this really throws me off every time. There's absolutely no way to tell if it's a multiple-choice and since you usually cannot just un-vote in Telegram, it is very confusing.
• crest 3y ago
  What the fuck is wrong with accepting well established intuitive conventions? How does such an braindead anti-feature ever get past a second person in reviews?
• stainablesteel 3y ago
  i'm honestly annoyed that you don't have example checkboxes that i can toggle
• a1o 3y ago
  Microsoft Teams has square checkbox in their Planner app that behaves like radio button. Super not confusing.
• MythTrashcan 3y ago
  This change serves us negatively. What reason is there to make them look the exact same? Not even a bit of difference.
• deleted 3y ago
  [deleted]
• domador 3y ago
  Is there any realistic way to keep big, influential corporations from imposing their bad UI choices on the rest of us? Can we at least get the word out to everyone else that this is not a fad worth copying and making into the new standard? (I'm looking at you, toggle switches, skinny scrollbars on desktop UIs, and the white wasteland UI designs that don't put any kind of borders between different sections of the screen.) I thought this article was going to be about the replacement of checkboxes by toggle switches, and was displeased to see that it was about something even worse.
  • esafak 3y ago
    If you want to get a word out, start a web site with dos and don'ts, or write a book. So if anybody wants to share recommendations, comment below!
• racosa 3y ago
  Spotify on Android too: when saving a song, you have to select one or more playlists using round checkboxes. Why?
• squigglydonut 3y ago
  Nah apple just cut costs and hired some year of efficiency designers. Usability will fail and they will need a visual distinction.
• j45 3y ago
  Some parts of UI/UX design are cyclical. Maybe a circular checkbox was more approachable in user testing than squares.
• elzbardico 3y ago
  There was a definite shift in User Interfaces that we can associate with the huge influx of people from the advertising and media space in the ad-supported web. Early web sites were mostly programmer affairs, with the ocasional designer to build a few assets here and there. UX people were mostly psychologists or even computer scientists that were more interested in arcane issues like accessibility and semantics, they didn't even call themselves UX, they were usability specialists. Now UX is mostly a territory of designers forged intellectually in the media and advertising space. And this has spread even outside the web. Yeah, UIs now look gorgeous, but a lot of times, the beauty comes at the expense of functionality and usability. In any culture that is dominated by advertisers, form dominates function. Appearance trumps content.
• moi2388 3y ago
  This makes me experience more negative emotions than a human ought to have about a checkbox.
• uxjw 3y ago
  Years ago, when Apple made all the icons in the Finder sidebar grey and then thin outlines, it became obvious the focus is about just changing things to set trends and ignoring the basic rules of usability. I still can't find what I'm looking for as quickly without the colors and strong shapes instead of monochrome outlines.
• lowkeyokay 3y ago
  Have you never mistaken a checkbox for a radio? I have not. At least not to the point I’ve noticed. Consistency within an app is important, but done well, I think it’s okay to break with conventions.
• hooby 3y ago
  May I draw your attention to the light-mode/dark-mode toggle-switch-button-thingy of this very blog? ;)
• esskay 3y ago
  I'm mostly surprised Windows defaults to rounded. I know their UI is a complete shambles but they seemed to be leaning towards non-rounded user interfaces over the last few years.
• walteweiss 3y ago
  What a dark mode on a mobile, woah! Just try it yourself.
• garfolino 3y ago
  It didn’t die. It’s just trans.
• neycoda 3y ago
  Checkboxes looking like radio buttons is a clear sign of things getting stupid. People defending this aesthetic is a sign of stupidity being trivialized. People being ignorant to the problems the stupidity causes is a sign of a subconscious desire to self-destruct.
• rcarmo 3y ago
  Oh goodness. I hope Bruce Tognazzini hasn't seen this.
• thomastjeffery 3y ago
  What we never talk about is how we could have avoided this entire mess in the first place. We should have never put configuration in the same place as presentation. Presentation is what you are telling the user. Configuration is what the user is telling you. By mixing the two together, we have muddled the context of both. What is your configuration presentation meant to say? 1. The user has rewritten (present/past tense) your set of declarations. This shall be read as a positive: [x] volume muted [x] unsubscribed 2. The user declaring a set of future changes to your set of declarations. This shall be read as a negative: [x] volume mute [_] unsubscribe Neither of these is guaranteed to be unambiguous. Neither of these is even expected to tell you which one it is! This is why configuration files are so well-regarded. The context they exist in defines the tense of their contents. Somehow, we never invented the GUI-equivalent of a filesystem, and we are all the more confused for it.
• jtotheh 3y ago
  Abort/Retry/Fail
• urbandw311er 3y ago
  For me it’s the check that makes the ‘check’ box. So the Apple Vision ones are, IMHO, to spec. Radio buttons don’t have a check, they have a filled circle inside.
• neop1x 3y ago
  It is similar to the introduction of borderless buttons by iOS and Google. User interfaces have gotten so bad that they are hardly useable anymore. One of my favorite mess ups is the latest redesign of Google Translate on android year ago (maybe iOS also, don't know). It is so much harder to use than the previous version. People were complaining in the reviews but nobody cares. A modern UI designer with an astronomical salary has done its job and you have to shut your mouth up and adapt... and their responses always like "we are constantly working to improve the experience"
• albert_e 3y ago
  The first thing that MKBHD sees when he puts on Apple Vision Pro for the first time is ... a checkbox! https://www.youtube.com/watch?v=SaneSRqePVY&t=15m34s https://www.youtube.com/watch?v=SaneSRqePVY&t=15m34s
• triandi 3y ago
  [flagged]
• michaelcampbell 3y ago
  This sort of thing has been an "issue" forever. I remember reading a similar thing last century about WYSIWYG systems vs. layout systems a la TeX/LaTeX. I tend to agree with "stick with norms" vs the "I like it how I like it" crowd, but I'm old and lived through this change; most in this industry only know the latter.
• cryptophreak 3y ago
  Checkboxes Are Never Round (2015): http://danieldelaney.net/checkboxes/ http://danieldelaney.net/checkboxes/
• artk42 3y ago
  () designing UI () fixing the world () saving the drowning not a todo list then..