Create expanded interactive menus

*Supported on screenpublishing App for Android 4.2.0+ and Windows App 9.1.1+

You can create at most ten different screen zones in a campaign layout. Anything else would look too cluttered. Hence, you are not able to create a single menu with more than ten buttons at a time. You will need to create a second menu by changing the background zone image. See an example below:

Learn how to create two menus by reading the instructions below. We have used an screenpublishing interactive campaign taught in the previous interactive tutorial. We recommend you do this first. If you have already, download the image files used in this tutorial campaign and follow the instructions below to create a second menu.

1. 1. Create a menu image with a next icon at the bottom (see image below). Replace it in the menu area of your Timeline.
   2. Add a screen division for the “next” button. Again, drag a PNG transparent image to this area on the Timeline like you have done for the other three buttons of the campaign in the previous tutorial.
      
   3. Create a second menu image. It should have different buttons and a back icon on the bottom (see example below). For now, only upload this image to your screenpublishing platform – do not place it in the timeline.
      
   4. “Save” the campaign.
   5. On the loaded page, click on “Interactivity” on the sidebar menu.
   6. Click the “add interaction” button. From now on, we will set all remaining interactions to our buttons.Our first goal is to trigger the second menu when the “next” icon is clicked. So fill the settings as below:
      • Which one: Region 6 (next button).
      • Action: Replace.
      • Destination: Region 2, as we want the menu to change.
      • When playing: As the “next” button belongs to menu 1, set the action to be carried out only when “menu 1” is playing.
      • With media: Select “menu 2” and hit check.

The “next” button will now lead to the second menu. Next, we need to add filters to all actions that are already set for the menu 1 buttons. Set “menu 1” for the “When playing” field. This will avoid that content from menu 2 is shown when we click a button from menu 1.

Now, we need to configure all actions of the second menu. Instead of choosing “menu 1” for “When playing”, we have to select “menu 2”. Set the file you want to trigger for “with media”.

At last, configure the “back” button on the bottom for changing the menu back again.

Tip: If you replace media items on a screen zone, set long display durations if you want the user to navigate freely through the content. If you keep a shorter time duration, it might happen that the user is interrupted while reading the text.

1. Hit “Save” when you are done. Wait for the player to synchronize the modifications and check out the outcome on screen!