HomeGuidesChangelogDiscussions
Log In
Guides

Leveraging Conditional Visibility to Personalize Screens

Conditional visibility allows you to show or hide components within a Screen based on user interactions or user data. It helps you build dynamic, personalized Screens without needing to duplicate them.

What is Conditional Visibility?

Conditional visibility controls whether a component is displayed or hidden at runtime, depending on predefined conditions.

Conditions can be based on:

  • Screen interactions (what the user does in the Screen)
  • User data (who the user is or what is known about them)

Enabling Conditional Visibility

  1. Select a component in the Screen composer.

  2. Enable Conditional visibility.

  3. Choose a Condition type

  4. Configure the condition that determines when the component is shown (see below)


Screen Interactions

Use Screen interactions to control visibility based on the user’s actions within the current Screen.

Available interaction triggers:


Plan selected

📘

Compatible with SDK v5.0

Plan-based rules are retro-compatible until SDK v5.0

This interaction lets you show a component only when a particular plan is selected. This is particularly useful when you want to change the price or CTA.

To assign a visibility condition to a particular picker:

  • Enable the condition visibility

  • Condition type: select "Screen interactions"

  • Interaction trigger: select "Plan selected"

  • Then select the desired Plan picker ID y

  • And finally select the desired Plan




Example:

In the example below, the Yearly Plan has a free trial but not the Weekly Plan.

To display different CTA copies depending on the Plan selected:

  1. duplicate your CTA and adapt the copy
  2. configure a Conditional visibility rule for each button and associate with the desired plan

Quiz answer selected

📘

Compatible with SDK v5.0

Answer-based rules are retro-compatible until SDK v5.0

This interaction lets you show a component only when a particular answer is selected in a Quiz. This can be useful if you want to display additional information when the user selects a particular answer.

To assign a visibility condition to a Quiz answer:

  • enable the condition visibility

  • Condition type: select "Screen interactions"

  • Interaction trigger: select "Quiz answer selected"


  • Then select the desired Quiz ID


  • And finally select the desired Answer






Example:


Switch state

📘

Compatible with SDK v5.0

Switch-based rules are retro-compatible until SDK v5.0

This interaction lets you show a component depending on whether a switch is selected or not. This can be useful if you want to make the activation of a free trial optional.


To assign a visibility condition to a Switch state:

  • enable the condition visibility

  • Condition type: select "Screen interactions"

  • Interaction trigger: select "Switch state"


  • Then select the desired Switch ID

  • And finally select the desired state (on or off)




Example:


Tab selected

📘

Compatible with SDK v5.0

Tab-based rules are retro-compatible until SDK v5.0

This interaction lets you show a component depending on whether a particular tab / segmented control is selected or not. This can be update the header of a paywall based on the plan selected

To assign a visibility condition to a Tab selected:

  • enable the condition visibility

  • Condition type: select "Screen interactions"

  • Interaction trigger: select "Tab selected"

  • Then select the desired Tab component


  • And finally select the desired tab





Example:

User data

Use User data to control visibility based on the user’s properties.

Available user conditions are:

  • Eligibility for an Offer
  • User attribute value
  • User belonging to an Audience

Eligibility for an Offer

❗️

Requires SDK v5.6 and above

Eligibility-based rules are NOT retro-compatible with SDK below v5.6. You should upgrade to until SDK v5.6 and above to use them.

If your Screen is displayed by a SDK version below v5.6, components associated with this type of Conditional visibility ruled will simply not be displayed.

This user condition lets you display a component if the a user is / is not eligible to the introductory offer of one of the plans associated with the Paywall. Combined with Offer mode text override capabilities, this feature attribute has a specific value. This is particularly useful when you want to display personalize your Paywall or a component such as Screen depending on the "Blinkist timeline" - explaining user insights (e.g.: how the free trial works - only when the user can still benefit from the free trial. they answered to a Quiz).

To assign a visibility condition base based on the a user eligibility for an offer attribute:

  • enable the condition visibility



  • Condition type: select "User data"



  • User condition: select Eligibility to an Offer




  • And finally select the eligibility rule: is eligible / is not available for the introductory offer




Example:


User attribute value

📘

Compatible with SDK v5.0

This user-attribute-based rules are retro-compatible until SDK v5.0

This user condition lets you display a component depending on the value of a user attribute. This is particularly useful if you want to tailor your Paywall / Screen based on the user insights (e.g.: how the user has responsed to a Quiz).

It is limited to one single user attribute and 1 single value. If you want to combine several user attributes and values, check Audience-based conditional visibility rules below.

To assign a visibility condition based on a user attribute:

  • enable the condition visibility



  • Condition type: select "User data"



  • User condition: select User attribute value







  • And finally select / type the desired value


Example:


If you want to visualize a component associated with a user attribute, you can use the Preview widget and check the desired rule.

More info about the Preview


User belonging to an Audience

📘

Compatible with SDK v5.0

This conditional visibility rule is retro-compatible until SDK v5.0

❗️

Only works with a Placement or within a Flow

For an audience-based rule to work, you need to display or fetch the Screen through a Placement.

If the Screen containing the rule is directly fetched or opened from another Screen (using the Open Screen action), the Audience will not be evaluated and therefore the component associated with the Audience will not be displayed.

This user condition lets you display a component depending on whether the user belongs to a particular Audience. This is particularly useful to tailor the Screen or Paywall based on the user insights. The Audiences used are the same ones as those used for target users in a Placement.


To assign a visibility condition based on a user attribute:

  • enable the condition visibility



  • Condition type: select "User data"


  • User condition: select Audience




  • Finally select the desired Audience or create a new one





Example:

If you want to visualize a component associated with an Audience, you can use the Preview widget and check the desired rule.

More info about the Preview