4

enter image description hereHow to display an item as premium to a user? In my card design there is triangle at the top-right corner () and a lock icon in the image. Does it signify to user it is premium ?

  • Does lock and triangle badge at top-right corner signifies it's premium item? – NB4 Oct 28 '16 at 11:31
  • Could you share a better preview of what the whole item looks like. Maybe a premium and a non premium. – Anders Oct 31 '16 at 10:16
  • Try a bunch of things and print them out. Show them to people and ask what they think the icons and symbols mean. Let us know what you learn! – Ken Mohnkern Oct 31 '16 at 13:47
  • Data point: to me, this triangle means "unread" / "new". – msanford Oct 31 '16 at 17:00
  • 1
    Might be useful: ux.stackexchange.com/questions/100466/… – Alvaro Nov 3 '16 at 22:56
3

There are a number of design issues that you have raised here, so perhaps breaking them down into separate issues and discussing the factors at play will help you make that decision:

HIGHLIGHTING (within the UI element)

  • Position: are there other elements that share the same space or position? Is there enough distinction between the premium versus other types of highlight you want to introduce, is there an order of hierarchy in case there is a conflict (i.e. more than one are present/available)
  • Visual style: in your case you have referred to the colour, but there are other things like shape, texture or font (if you are labelling with text as well) that can be considered. Again you have to take into account what the other types of categories exist (or potential ones in the future) so you can make a clear distinction
  • Iconography: you need to consider the overall use of icons and symbols across the website to make the decision on the choice of icon (if you feel like it is a suitable way to indicate this), because it may also conflict with the colour you choose and any other visual styling that needs to be combined to make it work effectively.

INDIRECT HIGHLIGHT (through other UI elements)

  • Call-to-action button: this can be just as effective because the highlight is provided at the time of need rather than when users are still reviewing a lot of information. This can be as simple as an additional label to the button.

  • Sort/filter criteria: this can show the order of products and services in terms of price or available features to indicate the premium category, or a filter that hides other categories of products/services.

So you probably need to determine the technical and design constraints and choose a strategy (or combination of strategies) that will help achieve the outcome you are looking for.

  • Thanks for commenting..:) I have two views grid & list view. In grid view there would be just title and below it an image and at the end a CTA. In this case I will have badge at the top-right corner for premium item only. In list view I've an image at the left then title beside the image. I have attached the image in my question. – NB4 Oct 31 '16 at 14:45
  • @NB4 so is there only the 'normal' items and 'premium' items? I think if you were to introduce something new to differentiate between only two different types of items then it is sufficient, but if there are potentially more categories then you would have to take a number of the points I raised into consideration. – Michael Lai Oct 31 '16 at 22:14
  • I have added a new design. – NB4 Nov 3 '16 at 4:38
0

Complement whatever icon you use with the work "Premium" otherwise it will be unclear.

Using a color or icon might signify the card as sponsored and might be ignored.

Also, also consider other icons and colors in the page. Users might derive a different meaning by comparing the icons.

There are hundreds of possible meaning outcomes. So you really need to label the thing as premium.

0

Add a badge around the item or seperate section for a premium. Add a dollar sign next to item.

In your case if it is premium user has to purchase it..i think having a dollar sign is good.

For artistic items like stockimages,graphics end user has to actually see the original item and then user will tend to purchase it.

A lock works in game process.

A ollar would be good, or make a premium badge and add it

  • premium badge as in ? Dollar sign works out. Thanks :) – NB4 Oct 28 '16 at 12:23
0

Use a highlight background like a gold color, and add another icon like star or money...

Example: enter image description here

  • You can't represent 'gold' as a colour on a screen. It would just be yellow. Also, can you expand on this? Why does Star or Money represent 'Premium'? You need to give more detail in your answers, not just brief statements with no rationale. – JonW Nov 4 '16 at 10:04
  • well, explaining better – liwston Nov 4 '16 at 11:15

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.