Premium Content Lock


Users need to know which content is for free and which is not.


Show previews of premium content and mark it visually


Use when

You are designing a commerce sites where users need to register to get the premium content. Typically these are news sites or sites where particular content can be downloaded.


Premium content and non-premium content are displayed together. In order to make clear which content can only be seen/obtained by registered users, a visual marking is placed near the premium content items. When such a marked item is clicked on the users are asked to register or login. After logging in the item is shown and no more markings appear.
The usage of the 'lock' must be explained on the page, typically as part of a Footer Bar.


Visual markings make it clear that there is something special about these item and the icon of a lock enforces the idea that they cannot access it directly.

More Examples

At CNN, a 'star' is used as a visual marking which is explained in the footer bar:

plml logo


0 comments have been added to this pattern

Add a comment
Do you have something to add or say about this pattern? Perhaps some more examples of how this pattern is used in the wild? Add a comment to this pattern and I'll update the pattern when necessary. Please abstain from misuse. I reserve the right to delete or modify inappropriate postings.

Your Name


Enter the verification code you see in the image below