Connected Stories offers different varieties of widgets that can be implemented in your story. Users can interact with widgets via personalized content and that's what makes a story dynamic.

Below is a sample execution of how to add different types of widgets to your story.

How to Set Up a Widget

It is important to understand that widgets need to be timed. Therefore each widget is linked to an event. This allows you to have widgets that dynamically interact with your ads to appear and disappear as you wish.
1. On the right end side, just below the video preview - click on New Event.
2. Name the event you are adding and the setup when to trigger it through the timecode. Then select "Save and Add Widget".

3. You will be prompt to the add widget area. Here you can insert a description of your widget and select the type of widget you want to add.

4. Select "Show" under mode in order to have the widget appear at the time you selected. You will select "Hide" when you want the widget to disappear.

5. Some widgets (such as Polls,Hotspots and Superimage) can be added as an overlay to your assets, you may choose to make your widget a webcontent or webcontent-overlay under Widget ID box.
6. Choose from any of the readily available templates for your widget's dynamic lay-out by choosing from the template drop down options (For example Super image, Clickable logo and much more)
7. Some widget, such as Quiz and Poll have an Advanced option. Click on "Advanced" to further edit the widget such as adding a background image or other items to it.
8. When you are done click Save. You will be redirected to the Story editor.
9. If you want your widgets to disappear at a certain point of your ad, you will need to create another widget event for this and then input the timecode you wish the widget to disappear at.. This is when your widget will disappear.
10. Select the specific widget type you want to disappear and then under mode select "Hide". Click save when you are done.
11. After you can resize and repositioning the widget in overlay in the left box.
12. After setting up your widgets, you can preview how they would look like by clicking on the "Open Preview". This will give you a clear idea of how the story rolls out.

Connecting the Widgets

The most fascinating aspect of Connected-Stories is the chance of defining a sequence of widgets based on user interactions. In order to understand and define the logic behind it, we encourage you to visit the Storyboard section.

Here you will see how to actually connect widgets (events) after a storyboard has already been designed for the story.

1. Click on new event or hit on edit if the event you want to connect has already been created.

2. Under the "Key Value" box, choose from the list of choices available to associate with a particular event.

3. Now hit on "Open Preview" to see how your story evolves based on the events you connected within the underlying rules engine.

*FYI: Status/Key Values are the final blocks you placed in the rules engine logic. These are the ones you must connect to a particular event for the dynamic storytelling to be implemented. More of this in the Storyboard.

Types of Widgets

Here's a list of all the widgets currently available:

*Any other form of widget can be customized according to requirement.

Poll

Applicable to any format
Companion or Overlay
Provide 1 Question
3 Answer Min.
Provide Countdown time if applicable

See sample of Poll Companion here

Back To List ^

Quiz

Applicable to any format
Companion or Overlay
Provide 1 Question
3 Answer Min.
Indicate True of False
Provide Countdown time if applicable

See sample Quiz Companion here

Back To List ^

Photo Gallery Companion

Applicable to any format
Companion or Overlay
Image size depends on format
Min. 3 images
Landing page for each image

See sample Photo Gallery Companion here

Back To List ^

Custom Widget

Custom Widgets are built in HTML5 and applicable as a companion or overlay to any kind of format.

The process of adding a custom widget is identical to the one to adding a new widget.

How to add a Custom App to a Story:

Create a new event at the desired timestamp
Click on the "Add Widget" button underneath the event to open the Widget page
Select the Widget Type "Instant App"
Mode select "Show"
Widget ID select:
1. Webcontent - for the Instant App to appear in the companion area*
2. Webcontent-overlay - for the Instant App to appear as an overlay** on the video

*Each new companion content will replace the previous one in the companion area based on the timeline and rules set.

**Overlay:

once created it is possible to drag and drop the overlay on the preview area of the video in order to choose the exact position.
to make an overlay disappear repeat the same process as "To Add an Instant App to a Story" but select the Mode "Hide"

"Key Value" field in the Widget Data page

It is possible to track and assign a Key Value to each instant app. This allows to establish conditions in both the Storyboard and the Journey Designer based on user interactions with the widgets. The Key Value would work as a reference for the condition.

Custom Widget Templates:

A reasonable number of templates are available and ready to be used, together with their relative structure, in the platform.

We continuously add new templates based on feedback coming from our clients and our marketing team. Each Template can be insert in overlay or in the companion area.

Here's the list of current available templates (for updates and new templates, contact your account representative):

*Any other form of widget can be customized according to requirement.

Interactive HotSpot

Applicable to any format
Overlay on Video
Drag/Drop and Resize
Choose Color/Size/Animation

See Interactive Hotspot sample here

Back to Templates List ^

Interactive Logo

Applicable to any format
Overlay on Video
Drag/Drop and Resize
Provide CTA text to tap the video
Assign tappable/clickable areas on the video
Provide images to appear for the trigger action

See Clickable Logo sample here

Back to Templates List ^

InTouch Overlay

Applicable to any format
Overlay on Video
Drag/Drop and Resize
Provide CTA text to tap the video
Assign tappable/clickable areas on the video
Provide images to appear for the trigger action

See mobile InTouch Overlay sample here

See desktop InTouch Overlay sample here

Back to Templates List ^

Interactive Element

Applicable to any format
Companion or Overlay
Drag/Drop and Resize
Image size according to format and its position
Provide Landing page for image

Interactive Element with Card:

*Note: To make the overlay disappear before the end of the video create a new event, follow the same steps as to add the widget and select the mode "hide" on the widget data page.

See Interactive Element sample here

Back to Templates List ^