forcecraft/aion

[UX/UI] Gameplay view

Opened this issue · 2 comments

Type
Enhancement

Motivation / use case
It's probably the most important views of all and it requires a lot of improvements.

  • Change general layout
    Proposal 1: Question displayed at the top of the page, just under navbar to drag attention. Bigger input field just below that takes 3/5 of the page and the picture takes rest 2/5 of the space. Scoreboard and event logger should be below.
    Proposal 2: Question takes 3/5 space at the top, picture takes 2/5, input below 100% width, scoreboard and event logger below.
    Will try to provide some mockups

  • Make it clear what is a static content and what is an input
    Current version definitely has a lot of ambiguity which may be really confusing, maybe even discouraging to a user.

  • Expose question input filed
    It should be clear where user should put his answer.

  • Submit button should be more subtle
    In most cases it will not be used, but should be there to indicate where is an input and that you can submit it.

  • Headings should be more subtle / smaller
    When user is in the room playing, he does not need a big indicators how room is called like it's done now. I can be smaller label and should not be that significant part of UX.

  • Make scoreboard more compact and distinct
    Currently it's easy to take scoreboard as some kind of input field which may be confusing and misleading.

  • Get some inspiration from modern online quiz pages

Proposal 1 doesn't make much sense imho in case of questions like "Who is the actress on the picture?" As long as the image is not a vital part of the question and just an addition it's okay (but it isn't the case quite often).

  • there is no autocomplete "off" option in Bootstrap.Input. If there's no reason for using bootstrap here, I think we could switch back to generic elm input to get rid of the input history.

EDIT actually there is and I've already fixed that in #191