I have some ideas how the selection of clothing sizes in an online shop should work, but that’s a question for another day, today is about bra sizes.
There are several systems out there internationally. For the sake of argument let’s limit this to the major European one which has underbust sizes with step increments of 5 (from 65 or so) and strictly alphabetic one-letter cup sizes. All other systems work basically the same, i.e. they pair a number and a letter (possibly repeated).
Numbers and letters grow together, but not in a simple linear fashion. That means, 65G is unlikely and so is 110A.
The next best fitting sizes for a woman with measured, say, 75C breasts is neither of 75B, 75D, 70C and 80C, but should be 70D and 80B. That means, decrease one value, increase the other and vice versa.
If you want to filter a list of bras on a shopping site, what’s the best approach to select the nominal size and the two adjoining ones?
Multiple select widgets
- Two separate multiple-selects, which would give all the right and wrong sizes mentioned above.
Underbust: 65, 70, 75, 80, 85
Cup: A, B, C, D, E - Long list of multi-select checkboxes
- sorted by circumference first: … 70D, 70E, 75A, 75B, 75C, 75D, 75E, 75F, 80A, 80B …
- sorted by cup first: … B80, B85, B90, C65, C70, C75, C80, C85, C90, C95, D70, D75, …
Table of multi-selects
70A 70B 70C
70D
75A 75B
75C
75D 75E
80B
80C 80D 80E
70A 75A
70B 75B
80B
70C
75C
80C
70D
_75D 80D
75E 80E
Single select widget
Include a switch for “include next best fits”/“loose matching”.
- Long list of single-select radios
- sorted by circumference first … 70D, 70E, 75A, 75B, 75C, 75D, 75E, 75F, 80A, 80B …
- sorted by cup first … B80, B85, B90, C65, C70, C75, C80, C85, C90, C95, D70, D75, …
- Table as above
- Text input with auto-detect, e.g.:
75 C
(EU) ≈C75
(JP) ≈III C
(IT) ≈34C
(US/UK) … Hierarchical drop-down
70
75 ▸ 75A 75B
75C
75D 75E
80
▼
▲
B
C ▸ 70C
75C
80C
D
▼
- New two-dimensional selection widget (especially for swipe gestures)
▲
◂ 75C ▸
▼
How much does the best way depend on the position of the filter control, e.g. sidebar or topbar next to search results or part of dedicated search page?
PS: I don’t need this for an actual project, I just started to wonder about it when I recently went shopping with my girlfriend.