How to define the number of people assigned to an activity in a friendly way (with regular updates)?
I work on a gaming web app. The user (player) has to assign people to different kind of activities on multiple views. Each view has 1 to 5 activities and a max amount of people. The user can assign 0 to MAX people split between the activities. The max amount of people will increase through the time.
Here a example for one of these views. Let's say there are 3 activities (A, B, C) and 10 people available. Below some example of possible distributions:
A | B | C | Total
case 1: 10| 0 | 0 | 10
case 2: 3 | 3 | 4 | 10
case 3: 1 | 0 | 2 | 3
case 4: 0 | 1 | 3 | 4
The user will regularly update these assignments. And I'm looking for a way to manage it easily.
I thought about the following elements/ui.
Sliders : the percentage of people assigned is important, that's why I thought about sliders. Sometimes the user doesn't care if 4 or 5 people are assigned to an activity, he just wants a 50-50 distribution. Con: it's not easy for the user to define a specific amount of people (number input next to the slider?)
[+][-] buttons with input number: the user can click on plus or minus buttons or directly define the number of people assigned to the activity. Percentage could also be displayed next to the input. Con: the user can't assign all the remaining people available without calculation (or spamming [+] icon).
(source: bootsnipp.com)
Zero, decrease, increase, max: may be something similar to page navigation could also be useful. It's like [-][+] but also allows the user to assign all the remaining people if needed. May be arrows aren't a good UI choice but just to give you an idea:
What do you think? Should I try a mix with [-][+] and min/max with the percentage displayed? Is the sliders could help?