Page 1

“Gated” access to content / Learn

Screen & interaction flow

All none-gated links will be clickable (icons & links). In the case of a PDF file, the file will not go to ‘download’ but instead open up in a new window.

A user who hasn’t filled a form (registered) yet would see any “gated” link with the lock-icon. Clicking will load the next page 

This page provides general information about the content item (in this case – a webinar). When the user fills out the form and click ‘Submit’, the next page loads 

This is the same page but without the form and now the video is showing. This page should have a unique URL that can be copied & shared. The ‘Share’ button at the top should follow the same interaction currently existing in the .com site today.

A user who filled out a form may share this link with a user who didn’t. The new user will land in the screen prior to this one (with the form) and only after filling out the form will he be able to view this screen (the video)

Once a user filled out a form, his next visit to a page will show all “lock� icons in their relevant un-gated form.

High-level CSS

Please use same font style as the link titles are today.

‘Datasheets’ & ‘Success Stories’ are both open content categories – no gating is needed. Their relevant icon is the above “doc-like” icon (no need to use the lock-icon).

‘Webinars’ & ‘Whitepapers’ are the only two gated categories of content. All links under these titles are using the “lock-icon” until the user fill out a form, changing them to the relevant icon.

Same button & functions we use ion the website.

Letâ&#x20AC;&#x2122;s use the <H4> style for now â&#x20AC;&#x201C; just like the page titles on the website.

Height: 100px Width: 100% across the screen (repeat X) Color: #1ca5c1

Learn gated interaction  
Learn gated interaction