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.

Think of a smartphone style flat list with items that can belong to one of three priorities: High, medium and low. Each priority is separated with an inline header.

Now suppose we have a small viewport, where you can only see a portion of the list at a time. If you scroll to a position, where the priority headers are not visible, you might lose track of which priority "section" you're in.

Thus we have a scenario like this:

Scenario with small viewport and long scrollable list

My question is:

If repeating priority on each item is too much redundancy and sticky headers (like in the iPhone contacts list) are unfeasible, what would be a good alternative way to communicate priority regardless of scroll position?

share|improve this question
    
What about indenting each section more the more you go down? –  henryaaron Jan 27 '12 at 8:12
add comment

5 Answers

Using colors can be sufficient enough.

Consider red, yellow, and gray respectively, or perhaps some other variations. Red is known to be an attention grabbing color (think warnings, alerts), whereas yellow is known to be yet another slightly-less attention grabbing color when it comes to web and mobile (think notifications).

share|improve this answer
    
Can you explain why? –  Rahul Jan 25 '12 at 15:01
    
Just modified my answer - sorry about that. While there's nothing ground-breaking about this approach, it's easy to adopt for just about any user. –  Vin Burgh Jan 25 '12 at 15:03
    
Heh. You beat me to the answer. Color-coding is a great solution. –  dnbrv Jan 25 '12 at 15:09
5  
Be careful with reds and yellows, make sure they're at least visually distinct enough for colorblind users. –  Ben Brocka Jan 25 '12 at 15:10
    
@VinnyBurgh Removed my downvote :) –  Rahul Jan 25 '12 at 15:11
show 6 more comments

You can use colors (see comment above) or symbols. In addition you can insert a exclusive or non-exclusive priority filter "High", "Medium", "Low" if the number of items is to big.

share|improve this answer
add comment

Any type of indication of clear grouping would work. Colors, as already mentioned, font styles, background patterns, borders etc. Make sure that the use of colors works if people are color blind.

share|improve this answer
add comment

What about some including some indicator on the left hand side of the content. Using colour as a starter but not relying on it. I would be wary of using a very bold colour. Also you could use a line markers which I have seen used a bit (example 2Do on the iphone). So ≣ for most important ₋ the least important.

share|improve this answer
    
I was considering something along the lines of what you suggest. Perhaps sparsely repeated text labels (High, Medium and Low) - rotated 90 degrees counterclockwise - could work? –  agib Jan 26 '12 at 13:44
add comment

You can use bullets for the Items made of little squares with H, M or L in them, colored or not depending on your design. The user should make the connection between the small square bullet with H inside and the 'High priority' header and associate them.

Of course, coloring them would make it even more easier. You can try to use less saturated colors with low value if you don't want to use bold ones.

As an example, kind of.., change the colors of a label in Gmail. You'll see some little colored squares with 'a' in the center.

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.