How to keep list of selected items when search / filter / facets change - without taking up too much space?

Question

I'm designing a multi-page/step wizard/flow where one of the pages needs to focus on findability and extensive filtering options - but also selecting (or deselecting them across searches).

Since the user will need to search multiple times and gradually select items, I need to keep selected items around across searches / changes in filters.

There is not enough visible space on screen to both offer extensive filtering options, a table / graph / list with enough info - and also a selected items list at the same time.

I've considered pushing selected items to a tab, however since it's the primary goal of the page, it doesn't feel right. It doesn't make it stand out as a primary action that is required to continue the flow.

I have some whitespace left, so I was wondering if anyone had some great ideas for alternative visualizations which emphasizes that items have been selected, and possibly give the user to show them in some creative way.

Here's what I have so far.

With tabs:

With alternative way of visualizing selected items:

I guess as you can see in the images, I'm also very much in doubt where to place the progress bar and whether to make the step in that bar clickable or if using back and next buttons is necessary, however that is not my primary concern.

Edit:

Could a combination between 2 and 3 be viable?

In that case is there a better way than the round circle (green check or red exclamation mark) to highlight that selecting is the primary action that needs to be done. Is a simple popup with a message when you try to click next enough?

Answer 1

Not knowing what the other steps (before and after the selecting step) are it is difficult to come up with a solution.

What often is a good starting point to finde a solution is to find existing patterns that do similar things. What you are describing feels like the behavior one would do in an e-shop. You search for items and put them in to a shopping cart. 'Shopping cart' might be the wrong wording in your case but the pattern could still be used.

Since you have steps bevor and after that 'shopping' you probably should show the shopping card as an overlay or you could ad an additional step for that. This totally depends on what is going on in the next steps.