over 4 years ago from Jason Etcovitch, UI Developer / Full-Stack Designer
Hey everyone!
I'm trying to figure out the best way to show how difficult something is; what are some interesting but clear design patterns you've seen that do this well?
IE: 5 stars for movies
Thanks!
I think Officevibe does a good job at Likert-style rating UI. Great illustrations for each stage and text to make it especially clear.
Great question btw.
Thanks! And yeah, those are great! I want something like that for sure; illustrations that carry the message clearly, but still add the right attutiude
Just some ideas:
Haa! I love the emojis, it's not something I'd considered but could work really well for my app. It would need to be very clear though, which is challenging. But I love the idea.
Very contextually dependant, but in areas involving complex tasks with specific skills, you could use examples like education or age. Perhaps a slider between 'Simple enough for a child to complete' to 'probably needs a masters degree' or 'novice' to 'expert', maybe using green to red colour scale i the mix?
Besides what's already been mentioned I'd consider if "difficulty" is the correct metric. What makes the "something" difficult? That could be relevant for your scale.
Is it difficult for everyone or just beginners? Other similar parameters are: complexity, intensity, familiarity/expertise
While the colors and illustrations are not great aesthetically, some Rate of Perceived Exertion (RPE) scales do a good job of clearly communicating difficulty when rating physical activities or, as in the example below, pain.
I see what you're saying; our decision to call it difficulty was not an easy one. Maybe its not the right word, since these ratings have to do with a timespan (a longer timespan is a 10 vs. a short timespan is a 1). However, having the keyword duration just doesn't say enough about what the rating entails. I know I'm not giving you a lot to go on here.
Anyways, I do like the RPE example you've shown. I think that something that detailed would work when assigning a level of difficulty, but something simpler would make more sense when just displaying the predetermined level.
Intent: To give a clearly recognizable scale (assuming 1:10)
So To tackle this you are going to want to use something like the 5-star rating system. HOWEVER stars have a very clear connotation with rating something. Because difficulty doesn't equal quality rating, I would avoid the use of stars.
Perhaps the use of simple dots could convey it well, I don't see a need otherwise for anything else.
depending on what you are working on, Consumer reports uses a center weighted scale that goes from normal to bad or to great. Food for thought.
I agree against the use of stars, for sure.
Simple dots could do the trick, but a line of 10 dots is rather long. Cutting some of them in half is so close to how stars are used, its too similar.
What about having a numbered system, where the user sees the number rating?
Numbers don't mean anything without reference. How about just telling the user? Easy, moderate, hard. If you need more level you could use 6 step bar alongside the word to give a visual que.
recently i noticed that more and more ratings on websites are skewed to have only 1 or 5. rating between 2-4 is apparently too much work for the users. so something binary like thumbs up / down works for me.
It could be worth looking at video game UI patterns for this. Difficulty rating is something that games frequently use and could be a pattern people could be accustomed to.
Thats a great suggestion! I've looked at a few, and they all seem very tailored to the specific game. Super Smash Bros. has some interesting ways of solving this.
Aside from a visual paradigm which many have already proposed in this thread, I would also pay attention to anchoring. Give the user a baseline either in the manner of an example (i.e., this task is harder than task X but easier than task Y) or something more general like time to finish (similar to how recipes typically have a time to prep and time to cook stat).
I absolutely agree; that's something that users will learn as a part of onboarding and ideally will be clear once the rating has been displayed (if they see the number 2 they get a description of what a 2 is)
I would say that it depends a lot on the context.
Consider also that things become way more difficult when you want to introduce items to an already underway voting
Login to Comment
You'll need to log in before you can leave a comment.
LoginRegister Today
New accounts can leave comments immediately, and gain full permissions after one week.
Register now