myautoma / myautoma.github.io

39 stars 15 forks source link

Simplify number input UI/UX #5

Open erikhuizinga opened 4 years ago

erikhuizinga commented 4 years ago

The number input UI/UX can be simplified a bit. For example, in Wingspan, sometimes the player has to tell how many points the automa scores. This input value is a slider that starts 0 and ends at 9. It might be easier to just show 10 buttons so the value can immediately be entered.

The same UX improvement can be applied to the end of round goal scoring: the player will have a count of 0 to some higher number of 'units' that count towards the goal, but lower values (< 10) will likely be more common. A similar UX with 10 (or e.g. 20) buttons could make it easier to enter the correct value. Here, it's probably safe to assume that 10 (or e.g. 20) buttons will not suffice, so a manual numerical input field is necessary here too.

There are alternatives too. For example, a design with increment/decrement buttons might work too, e.g. see below. N is the current value.

[-10 <<<] [-5 <<] [-1 <] N [> +1] [>> +5] [>>> +10]

The starting value of N could be 0, or it could have the automa's value when the player's score needs to be compared (e.g. in case of Wingspan's end of round goals). For the comparison cases, a UI/UX with just 3 buttons for 'greater than', 'equal to' and 'less than' would suffice!