I'm looking for some nice ways to visualize whether a user is a full member or a regular member. Assume a Facebook-style website with full membership option.

The profiles will be displayed as blocks of 80x80 with image and name in a box below.

  • 2
    What's the difference between the two membership types that would affect a users experience? – Peter Feb 10 '12 at 11:01
  • 1
    Is it like the difference between a regular LinkedIn member vs. someone who has upgraded to a Pro Account? Is there some sort of status conferred on a paying member vs. non-paying participant? – user11570 Feb 10 '12 at 11:16

Why do you need to display this information on a list of profiles?

Who is interested in this information?

Is there any actual benefit to other users?

For example, knowing someone is paid up LinkedIn member as opposed to someone who's just using a free account doesn't really affect me as another LinkedIn user. It doesn't change the way I can interact with that user. So in this scenario there is no utility to having that information displayed at all.

However, for a system administrator or marketing manager for the company running the site then having that information could well have utility and would need to be displayed to those users. In this case a simple "+" icon or the word "Pro"/"Full" overlaid in one corner of the image would work, as would changing the background colour of the user name perhaps.

If the goal is to convert free members to paid members then that's certainly a valid reason for differentiating the users. In this case, however you display it, some way of highlighting the benefits would be useful - this could be a tooltip or a link to the "become a full member and gain these rewards page". This could be from the icon I mentioned earlier.

Looking at this slightly differently on Stack Exchange where a "full" member is one that participates in the site posting questions and answers rather than just reading the content having their reputation score and badge totals next to their names is useful to me as user. It gives me clues as to how knowledgeable and helpful this person is, it also indicates whether I'm likely to find them in chat etc.

To sum up - work out your use cases and why this information needs to be displayed and to who. Once you have this the "how" might become clearer - or at least you can ask a more focused question.

| improve this answer | |
  • 3
    The status afforded by having a gold star next to your name doesn't affect someone else, but it does affect you, and that's worth something. And in the case of Stack Exchange, it does affect me - I know you have 2 gold badges and therefore aren't likely are worth listening to. – Rahul Feb 10 '12 at 12:02
  • @Rahul - good point. I suppose it boils down to what your definition of "full" membership is. – ChrisF Feb 10 '12 at 12:05
  • To be fair, SE badges have nothing to do with membership. They're achievement/XP/karma markers more comparable to the user labels you find on many forums indicating how many posts they've made. It does grant extra privileges, but that's not why they're meaningful. OTOH, my premium dA membership isn't meaningful to me because my name displays differently in chats or I get a little premium icon next to my avatar. It's meaningful because I have access to extra features. So the proverbial "gold star" denotes worth but doesn't confer it. It's there mostly for marketing. – Lèse majesté Feb 10 '12 at 12:14
  • 1
    @Lèsemajesté - that's why I put "full" in quotes. As I tried to point out you should only display this information if it affects how you can interact with other users. – ChrisF Feb 10 '12 at 12:16
  • @Lèsemajesté You're glossing over social proof and peer status. If I can show a badge that says I'm special, pro, VIP or whatever, and I'm extremely committed to the community, that can be very valuable. Don't underestimate it. – Rahul Feb 10 '12 at 12:26

A non obtrusive answer would be to use different color borders around the 80x80 image. This works as long as your states (full/non-full) are few in number.

| improve this answer | |

You can annotate profiles to show different membership status in a few ways (in order of what I would try were I in this situation):

  • The classic "gold star" or other glyph. Note that somebody seeing it for the first time might not know what it means other than "this one is special", but maybe that's ok. We all had to learn what the SE moderator diamond means once.

  • Changes in, rather than additions to, the rendering: border color (as suggested by Duane Gran), text color, text size, text styling (italics, bold, underlining), etc. These have the same learnability issues as glyphs but do not (necessarily) affect your basic layout. If profiles are text in a browser (as opposed to images), some text-styling changes might not play well with browser accessibility affordances.

  • Text ("full" for full members, absent for regular?). This has the advantage of more obvious meaning but the disadvantage of requiring more space (most likely) than anything else you might do.

| improve this answer | |

Think about what you want to achieve by displaying this extra information about your users.

Offering the information could be useful; it will potentially affect your site's internal culture by increasing your users' exposure to paid membership options - and the fact that paid membership exists.

Considering this further, one main benefit to providing 'pro' or 'full' status to paid members is the chance of increased conversion.

For this reason I would suggest:

  • adding a postfix label - as a link - to each paid / full member's name.
  • providing further information about paid membership via the postfix link.
  • aiming to make the label reasonably unobtrusive to ensure it doesn't complete too strongly with site content for the attention of site visitors.

An example of this methodology in action can be seen via Flickr:

Display of Pro users via Flickr

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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