After creating your story by uploading a video or a static image, you can start personalizing it by choosing your widgets from a more than 15 templates. Users will interact with those widgets via personalized content and that's what makes a story dynamic.
Create an Event
On C-S studio you can put as many widgets you want but always keep an eye on adding to much to avoid a confused ad.
Widgets can appear at the time you want or be triggered by another widget.
So, let's start!
- On the right side, just below the video preview, click on "New Event", to add your first widget;
- Name the event you are adding and then setup when to trigger it through the timecode;
- "Save and Add Widget".
Set Up a Widget
After creating your event, you will be prompt to the "Widget Data" page:
- Description: name your widget so that you will always be able to recognize it in the future (i.e. CTA, logo, video click...);
- Widget Type: most of the times you have to select "Instant app" unless you want to create a quiz or a poll which work differently and have their own field in the drop down list;
- Mode: select "Show" if you want your widget to appear at the selected time or hide if you need to let a widget disappear at the time you chose;
- Widget ID: if this is you first widget select wcd-1, if it's the second one choose wcd-2 and so on;
- Name: here you can write the same name you put in the "Description" field;
- 5. Some widgets (such as Polls,Hotspots and Interactive Element) can be added as an overlay to your videos, 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 Interactive Element, Interactive 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:
- Poll
Quiz
Photo Gallery
- Custom Widget
*Any other form of widget can be customized according to requirement.
For a Visual example visit the Widgets Showcase section.
Add a 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
- Description: choose the name of your widget, it's good if the name allows to recognize it in the future (i.e. if your widget is a Call to Action, you can name it CTA)
- Widget Type: select "Instant App"
- Mode: select "Show"
- Widget ID*: if this is your first widget, select wcd-1 and if you add more select wcd-2 and so on**
- Name: you can insert the se name name you put in the "Description" field
- Template: see more
*Each new widget content will replace the previous one in the overlay 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: on the "Mode" line select "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, example in Widget Showcase.
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.