I'm working on a case where a customer wants to choose how much points to distribute for each question of a survey.

The points depend on the location of the survey. Depending on the location where the survey is targeted the customer can choose a different amount of points for each question answered.

My question is if there are reasons on how to represent the interaction. Currently I drew 2 options:

1 is to first choose the location from a dropdown and enter image description here

2 is to open an accordion under each question and enter the points per Location (target). enter image description here

Does it make sense ? Is there a more user friendly way to interact?

  • 2
    How many questions and locations can be exist? Commented Sep 4, 2018 at 11:57
  • Hi @KeivanSina the only fact that I have is that the locations are currently up to 4 and the questions can be up to 10. Commented Sep 4, 2018 at 12:03
  • 1
    Will the questions be different depending on the location?
    – Kevin M.
    Commented Sep 4, 2018 at 12:39
  • Very good point. They will be the same 99% of the time. Commented Sep 5, 2018 at 6:42

4 Answers 4


I would suggest to use an accordion to reduce the amount of space used and minimise the risk of user getting confused.

I have created a fiddle for better visualisation: https://jsfiddle.net/oyLng91s/21/


It depends

An illustration showing an animal that can be either a duck or a rabbit.

This is a classic many-to-many UI issue, similar to:

  • Which classes the student takes?
  • Which students are in a class?

Normally the answer for these depend on the user's mental model (and it is not unheard of that both will be useful - depending on the task at hand).

Which is more likely:

  • I assign the payout based on other questions' payout for this location (option 1).
  • This question should have different payout based on location (option 2).

So really - which one is it?

Win win?

Given you say you have 4 locations and up to ten questions, you could use an editable grid. Roughly:

A grid component

This way:

  • You don't make decisions on behalf of your users.
  • They can easily 'switch' between the two approached.
  • They get a good overview of the whole dataset.
  • Can you make a table of the problem in the Win Win section. It might be me but the example in the 'win win' section currently is not close to the problem the user has, all I see is a normal table while the users table should change depending 'classic UI issues'. I agree with the first part though.
    – Kevin M.
    Commented Sep 4, 2018 at 13:16

Because of your number of questions and locations, I think this design is a good solution:

Table design

This solution can be implemented with up to 6 or 7 locations and infinite questions. all of questions and their locations are available in one page and all of them are grouped in a proper way. customer can edit every score, just by one click.

You can make it responsive like the right screen.


I hate making assumptions without any understanding of how your particular users create surveys, but here goes. They're probably better served by seeing the points set within the context of an individual survey. (Your option 1.)

If, for some reason, they need to be able to see and compare points across surveys, then option 1 won't work. But, especially if the surveys are large, users will design them offline, using your tool to only build them from that plan. In that case, they're not making decisions and comparisons on the fly and your option 1 is good again.

(Tip: go watch some people create surveys.)

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.