Take the 2-minute tour ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.

A lot of sites out there allow their users to either vote-up or vote-down content to determine both it's quality and relevance (just like this one!). My question is which set of symbols would be more effective to complement a voting system that has 2 selectable options (as opposed to a 5-star rating system, 1-10 scale, etc.)?

  1. + / -
  2. upwards triangle / downwards triangle (or an up-arrow and down-arrow, respectively)
  3. thumbs up / thumbs down

After you choose, please explain why. Then, perhaps explain what kind of use-case would be proper for each option?

The project in question allows users to write a comment after voting on a piece of content. Their vote is tallied and their comment is posted. Their vote (and comment) does not effect the sort-order of the content nor the notoriety other than what the tally-total displays.

share|improve this question
    
Can you explain what you mean by two pronged? –  Lisa Tweedie Jun 14 '12 at 20:40
    
As in 2 selectable options (as opposed to 5 star voting, 1-10 scale, etc.); I apologize for the confusion :< –  Vin Burgh Jun 14 '12 at 20:41
    
No worries - completely clear now... perhaps edit your question to cover this. –  Lisa Tweedie Jun 14 '12 at 20:59
add comment

2 Answers

up vote 2 down vote accepted

The key for me is in your last line. The context is a simple binary vote. The vote doesn't result in the item moving up a list. Hard to decide exactly what fits your solution without understanding a bit more about the product. But since you said it doesn't use reordering I don't think you should use arrows.

There are other binary options e.g. tick and a cross, green light/red light, happy/sad face. Interested to know why you didn't go for a rating system as I would say that this is usually what is used for rating content - perhaps partly because it doesn't feel quite as harsh.

This is why context is important. In an informal app I might use a face symbol... in some apps. In a more formal one a tick and a cross.

mockup

download bmml source – Wireframes created with Balsamiq Mockups


Individual Use cases

+/-

This is really over used as a symbol. Think tree controls, maths etc. Even google amended it in the icon to +1 rather than just +. This is my least favourite.

Thumbs up

Facebook uses thumbs up because it means "like" which has a whole different semantics. Remember they don't have down votes. However I guess this has a more binary feel.

Voting Arrow

Up and down would fit well on a site like stack exchange or quora which have a sort. In other words it is a "send it up the list vote"

share|improve this answer
    
I included the thumbs up/down example with YouTube in mind. –  Vin Burgh Jun 14 '12 at 21:24
    
A scale-based rating system isn't necessary for this particular project; the data taken from it (binary; 0 or 1) is all we'll need. –  Vin Burgh Jun 14 '12 at 21:26
    
You tube has the word "like" on their icon now too. –  Lisa Tweedie Jun 14 '12 at 21:29
    
Right, as well as the thumbs down too. –  Vin Burgh Jun 14 '12 at 21:31
add comment

I am a huge fan of the upwards/downwards arrow for voting because it is so self explanatory that now days with some many sites using a voting system everyone and his cat knows what an up arrow and a down arrow mean. Also color coding the arrows, either on hover or at all times, furthers the explanation (Green = good, Red = bad). I would really only use the arrows on a voting system though.

Examples of voting arrows - StackExchange, Imgur, Reddit

The use of thumbs up/thumbs down is usually seen on articles sites and social networking sites where someone can either communicate "That's a dumb idea" or "Wow! I really like that". When I think of thumbs up or thumbs down I usually think of someone personal opinion in a matter and not good vs. bad info.

Examples of thumbs up/down - Facebook, Smashing Magazine, Pandora

I don't really see too many sites using the +/- just because it really would need to be explained well about what it does. I wouldn't use something like this because + and - could mean a lot of different things (Ex. "Add to my favorites" or "hide things like this").

Examples of +/- - Google+?

Then there are the cases that sites use a unique type of voting such as Twitter's "Retweet" and "Favorite", and Digg's "Digg"

For your project I would definitely give a enter image description here for the voting arrows.

share|improve this answer
add comment

Your Answer

 
discard

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.