UX: Sample/Batch creation workflow

[straight-shoota]

In order to create a new sample or batch, you hit the + button on the samples or batches page and then you're asked whether you want to create a sample or a batch:

This intermediary step seems unnecessary. It burdens the user with a context switch. Instead of a single button that takes you to this selection page, we could directly present two buttons, one for creating a sample and one for creating a batch. That would improve the workflow because the user needs fewer clicks to get to ther desired form.

We also discussed the option of having only a single button with behaviour depending on which tab is selected (samples or batches). But that would be confusing because the tab do not easily distinguish by their content. And in many use cases it would still require an additional intermediary step.

An alternative to two separate buttons could be a drop down selection on a single button or a modal window. That still requires two clicks but there's no / less visual context switch.

[ysbaddaden]

My main grief on this modal is that only the > icon can be clicked. It should be the whole box!

[straight-shoota]

Yes, that's another UX issue. It doesn't need fixing here if we get rid of the selection step, though.

Btw. it's not a modal, right? For me it's a separate page, a separate visual context.

[ysbaddaden]

It's probably not, I likely got confused with the invite user/institution which is a modal (and the whole block is clickable).

[diegoliberman]

@gbatiston @jkicillof what do you think? I personally like the idea of saving 1 click.

[jkicillof]

What would happen when the third tab is selected (transferred items)?
The initial idea was that the header was independent from the selected tab since that was just a granularity selector (or view selector in other sections). Then the filters needed to change upon tab selection, after that the third option (transferred items) was added and finally the add button could also change its behavior upon the selected tab.
This is odd since the header hierarchy is above the tabs.

[diegoliberman]

@jkicillof yep, I think we all agree that option isn't so nice. But what about the other suggestions?

... we could directly present two buttons, one for creating a sample and one for creating a batch.
An alternative to two separate buttons could be a drop down selection on a single button or a modal window. That still requires two clicks but there's no / less visual context switch.

[jkicillof]

I don't see the gain, we still have 2 clicks and we swap a title + description with an icon

[diegoliberman]

@jkicillof the idea that we tried to explain is to place 2 buttons here:

1. The first button could be for creating Samples.
2. The second button could be for creating Batches.

Hence, there won't be 2 clicks, just 1.

[jkicillof]

ok, 1 less click but we still loose clarity and create another variant for the header.

[straight-shoota]

I don't see how this proposal would reduce clarity. I would even argue that it does the opposite. Currently, it's not clear what happens when you click the + icon on the samples and batches index views. And it behaves differently from the other add buttons which bring you directly to a form for the currently viewed resource type.

With icons that clearly indicate the type of element that it relates to, this is much clearer.
And it does not really create another header variant. It's the same header. There is just not only a single side link, but two. There is enough space available besides the filters to even add a third button there. So no design change is necessary.

I've made this simple draft to show what I mean:

I think it's clearer and easier to use than the current button.

[jkicillof]

I think what bothers me is that no other section works like this. I think I'd feel more comfortable having 2 different sections, one for samples and other for batches. This looks like a double section, you can create 2 different entities, list them in a table showing different fields and filter them with different criteria. Anyway, that's how I envisioned this and that's not necessarily what works best for the users.

[diegoliberman]

This issue could be solved with a more general approach described in #1550.

[straight-shoota]

This was resolved in #1586. We have completely separate pages now for batches, samples, and transfers. Each page has a dedicated "New" button.