Confusing UI of giving clue

[DarthGandalf]

Currently there are 2 independent lists of players. When I want to give a clue to someone, I need to look at their name, find that name in the other list (above numbers/colors selector for the clue), and select it there.

Why not make the list to be the same? E.g. move these buttons from above the numbers/colors to be near the players' hands. I can draw a mock UI if you want.

At first I couldn't figure out how to give the clue: I haven't noticed the other list at all, and I tried to click the player's name near their hand, which only shown a log of what that player did so far. When I introduced my group to this website, (they already knew hanabi both from real life and from BGA), they also were confused how to give the clue.

[Zamiell]

move these buttons from above the numbers/colors to be near the players' hands

With respect to the sum of mouse movement involved in giving a clue, this change would increase it exponentially, resulting in making it much more difficult to give a clue.

[DarthGandalf]

Maybe at least place the list of names vertically, one under each other? So that the top hand is still on top, and the bottom is still on bottom.

Or perhaps this could be an option... Though that probably wouldn't help the newbies.

With respect to the sum of mouse movement involved in giving a clue, this change would increase it exponentially, resulting in making it actually much more difficult to give a clue.

Another idea to help with that is to add a keyboard-only way to give the clue. E.g. QWERT would select the suit, 12345 the number, and ASDF the player

[Zamiell]

Maybe at least place the list of names vertically, one under each other? So that the top hand is still on top, and the bottom is still on bottom.

1) Keep in mind that not everyone plays in BGA mode. In Keldon mode, the hands aren't vertical, so having it be horizontal or vertical is arbitrary. 2) Furthermore, isn't it weird to have names be vertical, but colors/numbers horizontal? It seems more consistent to have all 3 things be horizontal.

Another idea to help with that is to add a keyboard-only way to give the clue. E.g. QWERT would select the suit, 12345 the number, and ASDF the player

What you are describing already exists. 12345 and QWERT work in the manner you describe. A and D are used for playing and discarding, respectively. You can use tab to cycle the players.

[marcmagus]

Is there any negative consequence to making it so clicking on a player's hand/name selects them to receive a clue (also depressing the button with their name in the clue UI so it's clear what's happening and hints at the existence of that faster-to-reach button) in addition to the current effects of clicking?

[Zamiell]

the negative consequence is that it causes players to accidently give clues to the wrong player

[DarthGandalf]

Here's a mock of a new UI. The new Zoom button near the name shows log of the player, which was the current behavior of the click on the name. Click on the name instead selects the player for the clue, just like the player buttons above color/number selector do. Having the new button has the following benefits:

• It becomes obvious that the player is clickable to get some additional information (it was not obvious)
• Player can click on the target player directly, without having to match the name
• Player still can select the player in the old selector, it's not going away. They don't even need to know that they now also can click the player directly instead.
• Click on the name doesn't show the log, so experienced players also won't accidentally give clue to wrong player, because they will notice that the log didn't appear, and then will see the button

WDYT?

[Zamiell]

seems fine. use a different icon than the magnifying glass though, because that is already the icon when you hover over someone's card(s)

[rogers-j]

I'm not sure I see how this meets the design goals. Having a smaller hit target to open the log will be a mild annoyance (not just on mobile), and clicking a bit to the side of it does something else.

In non-"BGA" layouts with 3+ players, some player frames are rotated, and this would imply a much narrower horizontal space to work with than you may be imagining.

Putting a symbol that indicates the interactivity of the frame by itself seems reasonable, but adding a second interactive point seems questionable.

[Zamiell]

closing this for now since the mockup does not seem very good

[DarthGandalf]

@rogers-j what is your suggestion to fix UI of giving clues?

I see this inability to give clues (because players can't find out how to give them) happens every time someone new tries to use the website.

[rogers-j]

The current design has the 'give clue' element with similarly-styled adjacent elements for the component parts of giving the clue. Maybe the problem is that these elements are not intuitively recognized as buttons?

[rogers-j]

Contrast radio buttons and groups thereof

[DarthGandalf]

[DarthGandalf]

[Zamiell]

I think you have succeeded in making it more obvious, but it also seems pretty ugly now

[rogers-j]

My point was as much about the idea of the radio button groups as about the dots.

I think the mockup screenshot above does seem to have adapted the radio button look to the "style" used by the client.

[DarthGandalf]

but it also seems pretty ugly now

only because you're used to see button without these dots. You can get used to the new look. If I switch between colorblind mode and back, the other look also looks ugly to me, for a while.

[Zamiell]

oh do the radio buttons only happen in colorblind mode?

[DarthGandalf]

Of course not. That wouldn't help beginners at all. The colorblind mode was an example of temporarily perceiving something as ugly

[rogers-j]

I suspect even with the radio buttons, a user may not infer the need to select one other player and one suit/rank before giving a clue.

Another way to approach the problem: what do users click on when trying to use this UI? The 'give clue' button?

If so, one approach might be to draw two invisible bounding boxes, one each for the player buttons and the clue/rank buttons, and have the appropriate box's outline briefly flash into visibility if the 'give clue' button is pressed prematurely. New players might see one or both boxes flash.

Experienced players might never notice the addition.

[DarthGandalf]

I don't know about other new players. Speaking for myself, I knew that before giving the clue I need to select the player and the type of clue, so I didn't try to press that button before selecting the player. I tried to select the player on the wrong place - by clicking their hands. Plus the button is obviously disabled, why would I try to click a disabled button?

This is why I initially suggested making it possible to click the hands to select the clue (1 year ago). The current solution with radio buttons is just a compromise to make these buttons more visible, because it was also hard to spot them at all.