Passive selection

Question

Working on a mobile UI for viewers to see available insurance plans.

Context: this is a marketplace where the employer is shopping for health insurance for their employees. The marketplace is different then a tradition plan selection marketplace. The business owners are signing up for a service that allows the insurance company to send out as many plans as possible to their employees that FIT the employers budget and contribution level. The employee can then select a plan that fits. Instead of the employer selecting the right plan.

So this example is showing 25 available plans. The employer can deselect the plans they don't want.

Question: The green dot is an indicator of the plans that are included. Is there enough affordance to let the user know they can deselect a tile and remove the plan from the number of available plans.

Answer 1

Personally, I wouldn't have known that the tiles were tappable. I like the aesthetic of the green dots, but it doesn't seem intuitive to that the green dot means "selected".

Another thing to consider is the target area for selecting these tiles--do you really want the entire tile to be tappable? I would think that might lead to accidental taps as the user tries to scroll down this potentially very long list, but this could all be user tested.

Instead, I'd recommend:

• A check box: indicates that something is selectable
  • Represents a selected/deselected state
• Toggle: indicates that something is able to become active
  • Represents an active/inactive or on/off or enabled/disabled state

Pick which fits your mental model more appropriately.

---

As a side note, I might not make the deselected tiles as light as they are. I would think that it would be more useful if I were still able to easily read the plan details without selecting it.

Answer 2

Two issues:

1. The green dot does not provide enough affordance because it's almost always used as status indicator, rather than input control.

2. Fading out unselected tile reduces legibility.

Given that this is a mobile app, I recommend going with something like this, because thick outlines make it clear that the entire tile is clickable. (vs. using checkbox).