87

As you know, you have to collect a combination of checkbox-style selections, and a filtered list of radio-style selections. Combine them both into one list. Checkboxes enable the primary "radio button" (a star in this mock up, but fit it to your design). Usually people tend to steer away from having a list of radio buttons with no default selected, but in ...


75

The Three-tier Pricing Strategy always works because often customers don't know what they need. So in one simple chart, you show them what they can get for different prices. They feel like they have a choice and do not feel like they are being swindled. You want to do business by making the majority of them choose the intermediate one. Much like many ...


43

One way of making a selection task less tedious is by increasing the selection target size to the full image + text size (e.g., as in the attached mockup). This decreases the effort that goes into individual selection and can provide an appealing and easy to see overview on which books are selected. Additionally, you can distributed the 100 books over ...


31

There are a few reasons behind this... Implicit Option If a customer is deciding whether to choose your product or not, and there is a single option available, then the choice is binary. They can choose to buy it or not. If you present 3 choices, then they tend to forget about the implicit option to not buy the product. Centre Stage Effect When 3 ...


30

For this kind of filter, I recommend to use button group: Buttons are easier to select and if you group these to show they work together, it is even more obvious for the user. Conversely, a dropdown is not efficient because the options are hidden.


21

I haven’t seen user testing data on this, but there’s an existing pattern that appears to work very well. In the course of on-boarding a new user profile, Netflix allows the user to select movies that he wants to watch or likes: Notice the top row. The left item is selected, the middle item is in the hover state, and the right item is unselected. Also note ...


19

This might be a wording issue. If you start with the primary option (1 out of N, so radio button) you can then present an "additional options" list where it's legal to choose 0 additional options (so checkboxes make sense). This makes additional sense because "primary" is semantically related to "first", so it's natural to start the dialog with "the primary ...


18

My expertise is in motivation theory and educational psychology, so I'll offer my 2 cents up from that perspective then on to the big picture. This is a very old and well studied psychological effect. In its simplest form, it is used by parents and teachers regularly: Scenario 1: Do it or else. You give a kid the choice between doing an assigned ...


18

@maxathousand's answer is really nice and clean, but I thought I'd add another option. I think a multi-select dropdown with dynamic list of radio choices would be nice and clear. Here's a little gif I mocked up: And a link to the mockup if anyone wants it: https://jsfiddle.net/gjudck24/


8

When I want to steer a user into clicking one button over the other, I typically do one or more of a few things to the button I prefer them to click: I pre-select (or focus) the button, which is an obvious way of showing the default action you wish the user to take. I use a different color background for the button showing a clear distinction between the ...


8

I can think of three improvements: Adding a filter Adding some order Improving scannability The filter is the easy one but I don't have a win-win idea for the other two, anyway I'll present some alternatives: If you're betting on text... Something that could help to searchability is alphabetical separation, maybe together with an index to each letter. ...


7

You can always suggest some books for the user to lend and communicate that he or she can choose more later. It will successfully onboard the user and not overwhelm with too many choices. The criteria by witch the books are suggested really depends on the purpose of the application (I particularly like Adam's idea of date last read).


7

As already noted in some comments, the three-tier product range design has both psychological and economic reasons. I would like to explain the economics a little more. One Tier Imagine you want to offer a service with only one tier. How do you price it? Your market research shows that you will have two groups of customers: professionals who would use ...


6

You could use this excellent jquery plugin called Chosen and allow them to select from a dropdown and this plugin will ensure the ones which are selected are then removed from the list but highlighted in the selection. This will scale even if the number of numeric codes increases and keeps the length of the form constant Note: I know this will become a ...


6

I would: present the user with a question "What is the primary ingredient?". The user makes his selection from a dropdown menu (which doesn't allow multiple selection) When the user choose the primary ingredient, the second question and the list of additional ingredients appear (either a list of checkboxes or a multi selection combo like in GammaGames ...


5

The way you have it mocked up isn't bad. I mean, if I know my task is to go through my entire library and select loan-able books, then I expect I'll have to go through my whole library. I'd expect to see a page full of my books. I would, though, make each item larger (showing them in 4 or even 3 columns) and make the clickable area bigger than that little ...


5

The best? Only testing will tell. Going to both your examples, the second one is way better from an user point of view. See both dropdowns: one has a list of TLD and nothing else. The other, a list of TLD PLUS the price. And in the domain business, this is a huge difference since the newer TLD use to be way more expensive than the classic original TLD. ...


4

Don't style options differently when they're variations of the same thing. It's pushy to offer two methods for registering and then nudge the user to the one that you want the user to use; you're not letting the user decide on his/her own without your bias. Code Maverick's example, while usable, doesn't actually apply to the original question. The Confirm ...


4

The Stack Exchange communities menu is messy but likely not without a cause. You see, the actual example in the Stack Exchange sites for a better comparison would be the Tags search: The reason is that in the Tags menu you already know what you want, so you'll just look for it and hopefully find it fast. For the communities menu you are meant to explore. ...


4

That design pattern is a multi-branching wizard. Wizards are ideal for walking users through steps to configure an application, service, or act as a more interactive form. UX Planet Article on Wizards and Best Practices Additional article on Multi-Branching Forms


4

The decision to use of a prev/next navigation to click through a range of colors is itself frustrating. Imagine having to click 50 times just to get to color #50, and once I'm in #50, having to click back 25 times to navigate back to #25 because I liked how it looked. Regardless how many options there are, the navigation solution is itself inefficient. ...


3

Why not show the summary first and let the user chose from available options? Just like the domain hosting sited do? e.g.


3

You could use a pair of toggle buttons, or perhaps simply checkboxes. download bmml source – Wireframes created with Balsamiq Mockups In both cases, the user can show both sets of data by activating both controls (button is "down", checkbox is "checked") or by selecting just one. Note that this only needs to be tri-state, not quad-state - if the ...


3

How about "Fixed width (original size)" and "Match my screen width"? Since your audience is 40+ and not really tech-savvy, they probably aren't going to know what "Adaptive size" is.


3

I like @Renaud's accepted answer and it's correct, but if you wanted to see what it would look like with icons as well, you could do something like this:


3

I think the best solution is to categorize the features. You could differentiate them by their destination, so for example: Bathroom Bathtub Shower Hydromasage Hairdryer Towels Toilet Recreation Masage Fitness SPA Swimming pool Also I would try to put them in columns (3 or even 4) - It should look way better than scrolling through a modal window, and ...


3

Well, I don’t see any buttons at all, which is a good thing, you only need one or two buttons for this. Of course, if you have buttons and they don’t even look like buttons, then you have real problems. But I assume you don’t mean buttons and it’s just a translation issue Anyways, if you’re building a form to gather user’s opinions, just keep it simple. Get ...


3

Its all different manifestations of cognitive bias. Every human is effected by cognitive bias, thereby it is a factor in all human transactions. Which is definitely fundamental to sales/marketing because you are selling and marketing to humans. This is a step in an overall transaction in which cognitive bias is used to influence a human to seek out an ...


3

This is an example of the decoy effect, as mentioned by others already. One always wonder why there is always three choices, as it is used to sway the potential buyer into either directions of the attributes (e.g. cost, features), by catering to the user attributes. Take a look of this link on the example, and some famous use of decoy effect by many ...


3

It seems like your first design concept is the more logical of the two given the task described: The end user must choose at least one of these options to be enabled The end user must choose exactly one of the enabled options to be the "primary" option. But I think the confusion comes from duplicating the second list which should only contain the ...


Only top voted, non community-wiki answers of a minimum length are eligible