2

I have to capture details of 30 sportsmen through a web form. Data can be the same for all the players but some could also have different values. I am using a checkbox (use same details for all) which allows to override values for all the players. I want to avoid a table for capturing the data of 30+ players as it will create clutter in the screen and there could be many input fields and even conditional inputs. So I believe a table is not the right tool.

But my solution has the following issues :(

  1. Only one player will be visible at a time
  2. The drop down is obscure. User cannot see which player is carrying different value.
  3. The long list of players in the dropdown (30+) is hard to navigate

Would like to get advice and any reference of a similar problem.

enter image description here

Improve this question
1
  • Why do you think a table would cause too much clutter? If you want to view multiple items that have similar details, a table would seem best in my opinion. Tables are entirely dependent on the designer. You can make a clean, uncluttered table by keeping just the important information and hiding/discarding the rest. Aside from viewing items one at a time, or comparing 2-4 side by side, I think a table would be the best choice. I would rethink your reluctance to use a table, but if you describe the main reason for this feature maybe that'll change
    – Gene
    Commented Oct 9, 2023 at 21:21

3 Answers 3

Reset to default
1

Well, I guess you definitely need a table if you want to see all the players added, although you don't need a complicated UI to fulfil this, since you only have 30 rows. You have the same form including the table, this will help you achieve the requirement of viewing all the players as well. Please check my reference attached and see if it helps.enter image description here

Improve this answer
0

This is an interface from mp3tag, a mp3 tagging tool. You have the selected songs on the right (table) and a form component on the left.

If all selected songs have the same value for a field, it is displayed as such (e.g. Year 2016). If they differ, it shows "" and if you click on the dropdown it will show you all the values found in the selection. There is also an option "" to clear the value for the whole selection.

mp3 tag interface

Improve this answer
0

Your requirements clearly point to a table, and the problems you mention are due to your reluctance to use a table. The table is a standard design pattern for exactly the problem you're facing, so I would start from that after all, and work my way from there on mitigating the problems you see with the table. It sounds to me that you're sacrificing usability in favor of a good-looking UI, and that's rarely a good UX decision. I would look for ways to improve the table visually (Designing Better Data Tables is a good place to start).

Improve this answer

Your Answer

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

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