[HN Gopher] Always Use "Buttons" for Size Selection
___________________________________________________________________
Always Use "Buttons" for Size Selection
Author : oedmarap
Score : 110 points
Date : 2021-02-11 12:36 UTC (10 hours ago)
(HTM) web link (baymard.com)
(TXT) w3m dump (baymard.com)
| ehutch79 wrote:
| I thought buttons were only ever supposed to be used for actions,
| and it was ux mistake to use them instead of radio selection or
| dropdown?
| wiml wrote:
| Semantically, I think the buttons this article talks about are
| radio-buttons (if exclusive) or checkboxes (if not).
| fbrchps wrote:
| Are these buttons not for the action of "select this size"?
| CarVac wrote:
| Using dropdowns instead of radio buttons is a huge pet peeve of
| mine.
|
| Dropdowns are only appropriate if the quantity of choices is
| large and the user already knows what the choices are, and then
| you should be able to type your selection in. This would be
| things like birth year, country, and state/province.
|
| Otherwise you add extra clicks, extra scrolling, and visual
| search of a brand-new element that can't be evaluated ahead of
| time.
| weinzierl wrote:
| > _Dropdowns are only appropriate if the quantity of choices is
| large and the user already knows what the choices are, and then
| you should be able to type your selection in._
|
| Large, but not too large. You might think this is a silly
| objection and no one can get that one wrong but I actually have
| an example: I once worked for a company with a six digit number
| of employees and they introduced a new ticket system for
| company wide support. This was some years ago and also the
| transition from a dedicated desktop software to a browser based
| web UI.
|
| Someone had the idea to make the ticket number selection a drop
| down, which looked nice in testing and a few hours after
| production roll out, but the fun ended quickly - with thousands
| of tickets it was completely unusable within a day.
| CGamesPlay wrote:
| Concur (an enterprise expense tracking app) used to require
| you enter the city of the expense you were tracking. It
| provided you with an alphabetical list of every city they
| knew about in a dropdown. Haven't used the software in the
| better part of a decade, so hopefully it's gotten better.
| kevincox wrote:
| It really bugs me when they use drop downs for numbers. We have
| a "number" type entry. Use that.
| arielserafini wrote:
| there are issues with input type="number".
|
| https://technology.blog.gov.uk/2020/02/24/why-the-gov-uk-
| des...
| vntok wrote:
| No, do not use that input type. Please have a deep read of
| sibling commenter's link. Its numerous flaws make input
| type=number completely inaccessible and therefore almost
| useless to the very kind of users who would normally benefit
| the most from simpler & more specialized inputs.
| klyrs wrote:
| Mobile interfaces are the worst. "Enter your birthday" but the
| year is a "dropdown list" that you need to scroll from 2021 all
| the way down to however old you are.
| david422 wrote:
| I think you've summed it up nicely when dropdowns should be
| used vs buttons.
| systemvoltage wrote:
| Just allow me to filter your entire stock list by size. No one
| does this.
|
| "OMG, this shirt is awesome" followed by "Damn it, it's out of
| stock", after opening it and has M (Medium) greyed out.
|
| Disappointment pattern, I call it.
| LeanderK wrote:
| it's possible in germanys zalando. I always do this.
| fbelzile wrote:
| Along the same lines: if your store has multiple locations,
| allow me to filter by location. Sometimes I don't care so much
| about the exact product (think audio cables), I just want to be
| able to go to the closest store and pick it up.
| nine_k wrote:
| Showing an attractive item which is currently out of stock
| would make complete sense, if there'd be an box to put an email
| and be notified when it's back in stock.
| ch4s3 wrote:
| Off the top of my head three are a few places that do this:
| REI, Norse Projects, End Clothing, Mr. Porter, adidas, and a
| few others. It should be more common though. I wonder if it
| used to be harder to know at search time if you were OOS on a
| particular UPC.
| Steltek wrote:
| That bugs me less than being able to exclude features that I
| don't want, especially popular ones. I can not think of a
| single store that allows me to exclude things using the same
| set of filters.
|
| For example, let's say I want bluetooth-less headphones. Simply
| selecting "wired" isn't enough as it will show me headphones
| that support both wired and wireless capabilities. Sometimes I
| don't want a feature, even a popular one, and it's extremely
| tedious to wade through results of stuff I will never want.
| sfRattan wrote:
| I want this feature as badly as you do. In my case, to filter
| _out_ any smart TVs when shopping for a replacement
| television. I recognize though, from working in retail and
| from looking at the front and back ends of the human process
| (and the front and back ends of POS, ERM, and other software
| that manages a business ' inventory)... That the world itself
| will probably never be well ordered enough to support
| reliable logical operators with accurate results when
| searching most inventory out there.
|
| You have to nail the software that developers have to write
| to understand the inventory it's keeping well enough for
| those operators to work. You have to nail the human process
| of keeping the inventory itself (and any
| tagging/categorization in the software) manually up to date.
| You have to deal with the malincentives of all the people
| selling product on to you at the distributor level, and how
| that affects the information they provide with the product.
|
| I wish for consistent, comprehensive logical operators in
| product search but I just don't see it happening. I think
| it's an example of a 'wicked problem'[1], and one that
| someone could probably make a killing solving.
|
| [1] https://en.wikipedia.org/wiki/Wicked_problem
| JulianMorrison wrote:
| It should save your size in your profile and pre-filter the
| whole site.
| greggturkington wrote:
| You can filter the entire stock by size on Amazon
| https://i.imgur.com/3QGQVZI.png
| nkrisc wrote:
| This is even worse with shoes or pants online, where you have a
| large matrix of size by color.
| karaterobot wrote:
| I'm always astonished by how it's 2021 and Amazon doesn't know
| my shoe size. Rather, they must know it, they just refuse to
| use it to help me find shoes.
| genericlogic wrote:
| This is not an uncommon feature. The word I have used for this
| is 'facets' (unsure if its correct or not). Look at Gap.com for
| an example. For example click on "Men > Shop All Styles" then
| click whatever 'facet' you want on the left.
|
| Of note I was part of the team that helped build this feature
| over 10 years ago.
| systemvoltage wrote:
| That's awesome, kudos to you!
|
| I just have a memory of shitty Shopify templates that small
| clothes manufacturers use. I think its pretty uncommon on
| small merchants.
| jcampbell1 wrote:
| Just as an FYI, "shop all styles" excludes categories like
| jackets. A novel take on the word all.
| wiml wrote:
| In some markets this is called "parametric search".
| mikepurvis wrote:
| Digikey and McMaster-Carr are the kings of this.
| RobertKerans wrote:
| Ah, Digikey is excellent. I've used McMaster-Carr for a
| while as a reference model when I'm writing
| catalogue/search UIs, nice to have another one to hand.
| heisenzombie wrote:
| The product database behind Digikey is much larger but
| the metadata of lower quality than McMaster. It means
| that filtering can be very frustrating if the parameter
| you're filtering on has entries for, say,
| 1 in 1.0" 25.4mm 1" 1lpi
|
| Another example: If you're buying something like a cable,
| they have a parameter for "end 1" and "end 2" with each
| product making an arbitrary choice about which end is
| which.
|
| I guess my point is that the taxonomy and cleanliness of
| the product database is just as important as the front-
| end UI
| aasasd wrote:
| > _However, some sites have a default preselected size for
| products -- for example, a 39 x 27 inch poster size selected by
| default -- which enables users to add a product to the cart
| without reviewing and selecting the size option at all on the
| product page. During our eye-tracking study, we observed that
| several users at AllPosters never even looked at the size drop-
| down, instead going with whatever size was the default._
|
| Sorta have to question now whether such usability studies show
| real behavior of people. Because I can't conceive of someone
| buying a poster and never thinking whether it would fit in the
| space on the wall. At least if the person isn't drunk.
| Geeflow wrote:
| I wouldn't be much surprised. The amount of things people do
| _not_ notice is staggering. When I do usability tests there's
| almost always something that doesn't get noticed although I
| thought it obvious and/or important.
|
| Personal anecdote: I managed to buy paper for my printer and
| only noticed upon arrival that it was the wrong size. The
| product photo looked right to be. I did not bother to check the
| details - or even the product title. -\\_(tsu)_/-
|
| Also, regarding "if the person isn't drunk": There's a great
| short talk called "the user is drunk" which makes one much more
| sympathetic to such seemingly unexplainable comprehension fails
| that sometimes drive product designers mad:
| https://www.youtube.com/watch?v=r2CbbBLVaPk&feature=emb_titl...
| jhunter1016 wrote:
| Pretty good research on the same topic from this firm a few years
| ago: https://baymard.com/blog/drop-down-usability
| CivBase wrote:
| All of the "bad" examples shown have common issues that are
| ignored by this article. They use inconsistent styles for their
| fields (particularly when mixing buttons and dropdowns). They
| also do not group all fields together as one form. Instead, the
| size field is presented in some other part of the page, making it
| difficult for users to navigate through the form.
|
| Meanwhile, the "good" examples all use consistent styles for the
| fields and group all fields together in the same part of the
| page.
|
| Dropdowns might be part of the problem, but considering the
| examples given in this article, I think that problem is being
| significantly overstated. I would caution against forming any
| general opinions about dropdowns from just this article.
| ShockedUnicorn wrote:
| Why does the site need access to my VR headset?
|
| https://i.imgur.com/Tg5G6Ma.png
| kwhitefoot wrote:
| Site works for me in Firefox with uBlock Origin active and
| blocking Javascript and remote fonts, doesn't ask for access to
| anything.
| beervirus wrote:
| This is the only way to browse the modern web.
| LeonenTheDK wrote:
| I've been seeing a tonne of VR permission requests lately, and
| always on the most unassuming sites. Never seems like there's
| actually any VR content available.
|
| Heck, I haven't even had my VR headset plugged in since
| Christmas. Does the browser cache that it existed, know there's
| drivers or some such on your system, or would it be asking
| regardless?
| Farbklex wrote:
| It's because they use Vimeo to host the videos and use the
| embedded player there.
|
| Apparently Vimeo can be played inside the VR headset? I am not
| sure but I get this message everytime I open any website with
| an embedded Vimeo player.
| TonyTrapp wrote:
| Sounds like browser fingerprinting for ad profiles
| bux93 wrote:
| I'm very unlikely to buy a size that won't fit me or my immediate
| family members. But somehow, no clothing shop seems to allow you
| to set up a couple of profiles (women's clothing size M, men's
| clothing size L) and filter the entire catalogue by default.
|
| I'm reminded of the highstreet, where I've only found one shop
| that sorts clothes on the rack based on size. I suppose this is
| to encourage browsing and inquiring if your size is 'in the
| back', but it's excrutiatingly inefficient.
| Garvey wrote:
| Yoox.com has exactly this iirc, allows you to set sizes for for
| shoes, trousers and shirts etc I believe.
| CharlesW wrote:
| > _But somehow, no clothing shop seems to allow you to set up a
| couple of profiles (women 's clothing size M, men's clothing
| size L) and filter the entire catalogue by default._
|
| DXL (a big and tall retailer) allows you to create a "size
| profile" and then turn on "Shop by your size".
|
| Zappos does something similar in a different way, allowing you
| to turn on an option to auto-apply size filtering for
| subsequent searches ("turn on auto-apply for men's size(s): 14,
| 15, 14.5").
| arkitaip wrote:
| Of course they know that would be the most same option for
| customers but when vanity metrics and crash management
| practices take priority, customer satisfaction usually suffers.
| FriedrichN wrote:
| This is assuming that whatever you're selling the customer only
| wants one size, which would be the case for clothing but not for
| all things.
|
| One case would be lengths of cables or different weights of
| barbell plates, there the customer would want to buy several of
| different sizes. In that case all sizes should be visible with
| inputs for the desired quantities.
| rjmunro wrote:
| Sizes in online clothing shops should be global persistent
| settings. If I am shoe size 10, no part of the site should ever
| show me anything that isn't available in that size.
|
| You could use checkboxes to enable searching for more than one
| size at the same time, e.g. it might be useful for searching for
| clothes for my kids, or if I know that I can usually fit more
| than one size because I'm on the border between 2.
| ojagodzinski wrote:
| There is something like https://www.esize.me/ where You scan
| your feet in one shop, upload scan to them and use it on
| different e-shops like http://eobuwie.pl/. Poland-specific but
| resolution to Your problem is there ;)
|
| There should be open-sourced service where you can pair your
| email address + PIN with collection of sizes.
| dukeofdoom wrote:
| I tried buying a jacket online. Was a little confused when I
| pressed a L button and it did not register. Took me a while that
| they sold out of that size. Not that I think about it, not really
| sure how to best handle that UI situation.
| SamBam wrote:
| In the design suggested by the article (and also used in places
| like Amazon) the L button should have been visibly disabled. I
| think this is pretty clear to most people that it means that
| size is not available.
|
| It sounds like the issue you encountered was that the styling
| of the option didn't make it clear that it was disabled.
___________________________________________________________________
(page generated 2021-02-11 23:02 UTC)