medialab / hyphe-browser

Browser version of Hyphe (WIP)
GNU Affero General Public License v3.0
29 stars 4 forks source link

Improve design of fast action buttons in Linked entities cartel #192

Closed boogheta closed 3 years ago

boogheta commented 3 years ago

Now that fast actions include merge as well, we have a potential issue to read the names of the entities. There is the hover tooltip to compensate but in many case, it would be more convenient to actually see which entity we are precisely working with, for instance if it is Twitter.com or a specific account like in the screenshot below

Capture du 2020-12-09 13:55:27

@robindemourat do you think we could try to redesign these buttons to leave more space for the entity name? For instance we could make the buttons smaller and fitting in one vertical line on the right like below? Or move the "cited by" info to the top right and put the action buttons on one horizontal line below instead? Or any better idea?

Capture du 2020-12-09 14:05:22

robindemourat commented 3 years ago

I agree on the problem.

I like the reduced-size option and two-lines option.

Below a two-lines option test:

Capture d’écran 2020-12-10 à 14 03 18

Right now I don't see other options indeed.

Pros for the 2-lines option IMO:

Pros for the reduced-size option IMO:

I am not sure of which one is the best... what's your opinion guys ?

boogheta commented 3 years ago

The pros arguments for both options all make sense, it's a hard choice! :p I think I would be more in favor of the vertical reduced size option, mostly for the easier position allowing to click in series by scrolling vertically.

Let's ask more people! Do you have a preference @mydu @thomastari @audreybaneyx @Yomguithereal @heloisethero @bmaz @d3scmps @AmelieVRL @arnaudmolo @jacomyal ?

To sum up the question, we currently have this:

Capture du 2020-12-09 13:55:27

And we are wondering between moving to:

Capture du 2020-12-09 14:05:22 with the following advantages:

or:

Capture d’écran 2020-12-10 à 14 03 18

with the following advantages:

mydu commented 3 years ago

I personally like the two lines option, but it looks a bit empty on the right side if in stack list (because there is not merge button), maybe we should keep the original EntityCard UI in stacklist view but change to two lines in linked entities view Screenshot from 2020-12-11 14-37-24

AmelieVRL commented 3 years ago

It's a very hard question without context. Reading the first posts I would have said 2 lines option ; I agree on the fact that there is few elements in the list and user wil have to scroll but I am convinced that's better to have info with the URL. 2 tips to think about:

boogheta commented 3 years ago

Regarding buttons, these are global design choices from @robindemourat which are present in multiple places in the app so I don't think such a change is on the table, sorry :) Same thing about the window enlargement unfortunately, this is in the webentity sidebar of the browser which we cannot afford to make bigger (and is even smaller on small screens actually).

Yomguithereal commented 3 years ago

What about smaller icons in the line below, just to merge the two propositions :P ?

Yomguithereal commented 3 years ago

Else I think I prefer the option with icons on the line below as I would probably favor being able to read an entity's name most of the time if possible.