JungleDragon has a sophisticated reputation system that works based on karma credits. The amount of karma credits you earn determines your class in the foodchain. A class, in turn, also give you an advantage over lesser classes:

• It determines your voting influence (Influence)
• It determines your defense against negative comments (Defense)
• It determines how much content you see on a single page (Sight)

In addition, some classes give you special abilities, such as:

• The ability to view images in their original size
• A larger upload quota
• The ability to edit image details of images uploaded by others (social image editing)
• The ability to edit tag metadata for special tags (social tag editing)

All of this is of course next to the visibility effect of a good reputation position in the community. Anyway, so far I have visualized such class abilities like this (partial screenshot highlighting the relevant area):

Fairly descriptive, but not attractive. My worry is that it will not be easily understood by end user. Hence, the following improvement:

There are now clear, color-coded progress bars to indicate the strenghts of each class, decorated with icons. Hovering one will explain what it means using a tooltip. Next to class strengths, class abilities are now clearly seperated and called "Powers". The progress bars animate into their final position, which is a nice effect to see. I hope this visualization makes more sense to users, but only time will tell.

The above screenshot is taken from a dedicated screen that shows classes. However, a user's class is visualized pretty much everywhere a user is mentioned, so I made the above visualization consistent. For example, here you can see how it is embedded on a user profile (click to enlarge):

The right sidebar shows the user's reputation quite prominently. This will not only be a trigger to the current users, but also to other users viewing this profile to learn about the reputation system. While we're at the user profile screenshot, there are two other visual changes I made:

• Notice the country flag on the top right. When a user fills out his country as part of his profile (optional), his country flag will show there. I currently support the flags of roughly 240 countries.
• The user profile holds quite a lot of content, divided into several tabs. As you can see, these tabs are now organized into sections of related options.

RATE THIS CONTENT (OPTIONAL)

	Was this document useful to you?
	Rating:	Awesome  Good  Average  Poor  Useless

CREATE A NEW COMMENT

	Name:
	Email:
	Website:
	Content:	HTML is not allowed. Hyperlinks will automatically be converted.