I'm working on a website where we have users' avatars pulled from their Facebook profile picture and sized down to a thumbnail.

Now that users can upgrade to premium memberships to unlock advanced features I would like to denote that they are a premium member everywhere their avatar is shown. So far I've just been framing their avatar with a 3px gold border.

Any additional ideas, thoughts, inspirations?

  • Have you received feedback that the gold border is not working or that its not clear enough what it means? What is the reasoning behind changing it? – tblessander Jan 11 '13 at 4:39
  • 2
    Yes, requirements from above my pay grade. – TJ WealthEngine API Evangelist Jan 11 '13 at 11:21

Though using a gold border is nice (and I don't think you should remove it) it may not be very obvious to people. I assume that you want it to be quite noticeable in order to get more people to upgrade to a premium account.

Is there anywhere that you show more info about the user?
For instance on ux.stackechange the users name, rep, badges are shown next to the avatar and (for those users with higher rep) rollover shows even more info.

If you already show more info then this would be the place to add it either as a badge with a tool tip or just as text saying 'Premium Member'.

If you do not show more info then I would suggest one of several options:

  1. Add more info about the user either next to their avatar or on rollover as mentioned above.
  2. Add a small badge (icon) somewhere on or near their avatar (though be careful - on the avatar can interfere with it). This would be just like the badges that you see here on ux.stackexchange. Be sure to include a tool tip as an icon on its own is not always clear as to its meaning.
  3. Add the text 'premium member' just below or next to their avatar.

If you do want more people to upgrade then it would be worth linking any mention of premium members to more information about what the benefits are and an opportunity to sign up.

  • This is exactly what I was looking for. I swear sometimes in design the inspiration is right in front of you if you keep your eyes open, ala the badges on this site. – TJ WealthEngine API Evangelist Jan 11 '13 at 11:23
  • Thanks for your detailed answer and many options. I think a combination of badge, tooltip and text is perfect. – TJ WealthEngine API Evangelist Jan 11 '13 at 11:23

I am with tblessander, why change it?

If it is a user error issue, vanity, or design thing, there are a couple different options. You can always add a gold crown, gold star, pro badge, etc.. You can even go as far as add the [PRO] before or after the username.

  • Agreed, it comes from higher than my pay grade as well as an urge to improve, not clutter, but improve. Thanks for the tips, I love the guild like text of [PRO] – TJ WealthEngine API Evangelist Jan 11 '13 at 11:24
  • Flickr is a good example of a site that adds [PRO] after premium member's user names on their profiles. – Moshe Katz Mar 12 '13 at 21:44

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.