I'm building wireframes for an intranet site. The user needs to be able to select states so they can see articles for that particular state. They need to be able to select multiples states because sometimes they'll want to see articles for multiple states in the same list. I have three designs:
1) I don't really like the checklist in a drop down. This keeps the states hidden and it just seems like there's too many things going on to make it easy on the user. They may have to scroll to see all of the options and then select multiple states. There are plenty of flavors of this approach out there. If I went this route I would also add a label called "selected states" and list out the states they have checked next to it to reduce cognitive load.
2) This works except I'm building multiple sections with the same type of layout. Some sections will have six navigation buttons on the side and not just one. If it turns out they need a functionality like this it'll be pushed way down the page.
3) Imagine this is styled better with two columns. It completely removes the user from the update page and makes them focus. I feel like it's a little too prominent for the task they're doing. Also, it's hidden so they can't just see their options really quick. They should know the options though. I would also put a label on the page to indicate the states they chose like I option 1.
The number of states will not increase or decrease (at least for the foreseeable future). I know I'll need to test this with users, but I'm just trying to get to a solid starting point. I'm facing resistance from higher-ups on getting to the users of this site right now.
Which of these is the best option to get users to quickly and easily make selections and get on with their reading? Why? Is there a solution I haven't thought of?
Some reading I came across:
Both of these have the dual lists as options, but at that point, the list is becoming very prominent. I don't really like this because the focus shouldn't be on the list(s), it should be on the articles that display based off of the selection in the list(s).
This answer does just say to go with checklists though:
Both of these refer to a plugin called Chosen, which is still kind of the same thing as option one with some variation: