User Experience Stack Exchange is a question and answer site for user experience researchers and experts. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I want to ask a question of my website that has users match items up.

For example:

Match the animal with its sound:
Cow    Bark
Dog    Neigh
Horse  Moo

If this were a question on paper I would ask the user to draw lines from one to the other. How should the interface to answer this question look on a website. Is there an existing JavaScript widget anybody has already built for this?

share|improve this question
up vote 5 down vote accepted

For a simpler implementation, use colors.

They are just buttons. You click one, and then click another one from the other side to pair them up, sort of like that puzzle game.

enter image description here

share|improve this answer

Drawing lines can feel like dragging and dropping... You're dragging a pencil to make a connection between two things.

How about dragging an object on the left on top of an object on the right? Then they would be displayed as "stacked"? The stacking also means you have less and less options on the left as you go, making it easier to read your remaining options.

Of course this assumes that people are comfortable with drag and drop...

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

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