I am writing a small open-source web application to manage characters in a fantasy role playing game.

When a new character is generated, 6 random values between 3 and 18 are generated by the application and assigned one each to the "Strength", "Dexterity", "Constitution", "Intelligence", "Wisdom", and "Charisma" ability scores.

The player can then rearrange them in any order, assigning each of the original 6 numbers to the ability scores of their choosing. They cannot add or remove any of the 6 numbers and must use all 6 of them. Note that the input fields for each score are read-only.

Once the players are satisfied with their choices, they can click the "Lock Scores" checkbox. This will cause the input fields to become read-write (required for later increasing the scores) and the arrow buttons and re-roll button to disappear.

I've designed the following UI (mock-up):

UI for arranging scores

Is there a better UI for handling this type of user interaction?

  • Hi Ralph, welcome to UX.SE. Questions posed as general "site-reviews" are typically off-topic. Is there a specific and solvable UI/UX problem you are having with your design?
    – Alan
    Jan 17, 2018 at 14:12
  • I was hoping for a more user-friendly suggestion for how to do this. It seems that my design is awkward.
    – Ralph
    Jan 17, 2018 at 14:14
  • @Alan This doesn't seem like a site review question to me. The question would read just the same without the hyperlink. Jan 17, 2018 at 15:08
  • I removed the hyperlink.
    – Ralph
    Jan 17, 2018 at 15:10

1 Answer 1


One program that I have (RPGSuite's Traveller Character Generator) allows assigning scores to character attributes; the way they do it is simply to dump the scores into a "tray", and allow the user to drag-and-drop them in the appropriate attributes, which are presented in the conventional order for Traveller.

  • I've considered using drag-and-drop exactly as you describe, but I am worried about how well it will work if the user opens the application on a tablet.
    – Ralph
    Jan 17, 2018 at 13:41
  • I don't see that that should be a problem; drag-and-drop does work on tablets. The key there would simply be to assure that the presentation is large enough for the typical finger to hit what it's aiming at. Jan 17, 2018 at 13:44
  • My immediate thought was drag-and-drop. Most devices allow this type of interaction now. 10 years ago, click to re-order one at a time was one of the few solutions, but now we have much better technology. :)
    – Dwev
    Jan 17, 2018 at 15:14

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.