cozuya / secret-hitler

A web adaptation of the social deduction board game Secret Hitler. https://secrethitler.io
Other
840 stars 201 forks source link

Readability Improvements (UI/UX) #1583

Open Nopey opened 4 years ago

Nopey commented 4 years ago

Is your feature request related to a problem? Please describe. I find it hard to read some aspects of the gameplay interface Describe the solution you'd like I've interleaved these two, point by point. I'd rather not spam 4 issues, as they're all just UI problems.

  1. Click to vote/unvote is finicky, should perhaps have more feedback and or a seperate button (feedback idea: ticking sound if you havn't voted yet, button clack)

  2. Borders for both ELO glow and selectable players is kinda hard to read, got confused once or twice. Please either make the entire card blink, or move the ELO glows to a different area (out of the room? name text is already team-colored)

  3. Why aren't there CNH markers on the player cards? This is a feature of the physical game Tabletop simulator version :eyes:

  4. For Inv/SE/Bullet, there should probably be an icon when you're hovering over a player card that indicates what action you're about to take (I don't like reading the text above, might help if the text above also had the icon)

Additional context I'd be happy to implement these once I'm through my exams, roughly 23rd of April.

iounpaladin commented 4 years ago

Personally I agree with 1, 2, and 4 but I think 3 goes against the spirit of the game. Having information marked on the screen for Liberals is a slippery slope. The CNH card is definitely a fan innovation and not our invention! We have no plans to include it. ... Yeah, and that's a Bad Thing when the game is so well-balanced without the CNH card. I think confusion about CNHs is a feature, not a bug. - Tommy Gents, creator.

Nopey commented 4 years ago

There's also the problem of finding space in the UI for the CNH marker :wink:

Nopey commented 4 years ago

For 2, hiding the ELO glow while choosing a player is probably the most unintrusive fix.

Also, bonus 5: Players without experienced status have to look for the little rainbow icon to see if they're unable to join a match. I have a feeling the yellow glow is meant to provide this, but I'm unsure.

Screenshot, with me unable to join the bottom one

Steps to reproduce: Join with Github account. Link Discord. View games. Able to join email verified, even though they glow yellow.

Vigasaurus commented 4 years ago

re: 5

The yellow glow is actually just there to show a game is unstarted, but changing to show joinable may be a good addition.

Relevant: https://github.com/cozuya/secret-hitler/blob/master/src/scss/style-dark.scss#L461

Nopey commented 4 years ago

I'm unable to work on this, as I've not got enough diskspace to compile MongoDB, and all the binaries link to the original fork of libssl and libcrypto. Unless there's a way of working on the UI without having mongodb, but that seems unlikely.

Vigasaurus commented 4 years ago

It's not, sadly. Especially since what you're wanting to work on includes accounts, and thus would need mongo.

I'd recommend AWS EC2's nano free VPS, or Google Cloud Platform's Pico free VPS, or Azure's free tier for VPS to dev on if your local disk is insufficient.

stevenruidigao commented 4 years ago

You could also use a local server, depending on what distro you have.