15. Advanced interactive editing (v3 Pro)

Updated : Dec 20, 2016


With the new Interaction editing panel, you can now trigger actions based on your user behavior on each element of a given sequence.
These interactions impact properties of one or multiple element of your sequence (image, video, text, ...) on rollover, click or any touch event on another element. Through these interactions, you can, for example, play a sound when you click on an image or change the style of an element when hovering over it, or interact with the player (eg. go full screen) when you click on another element in your sequence.

NB : This feature is only available for the Klynt Pro Edition and Academic Editions of Klynt 3 (Student, Academic & Campus)

N.B: See some examples of interactivity browsing our demo project.


Edit an Interaction

1 / Select the “source” element of your interaction. Here are the different ways to do so:

  1. On the scene: Right click on the element> "Edit interactions"
  2. On the track: Right click on the element> "Edit interactions"
  3. In the interactions panel: When the panel is open, you have access to the stage and the timeline of the sequence. So just click on an element to open a dedicated tab to edit the element
  4. Cmd + I (Mac) or Ctlr + I (PC) when the panel is closed to open for editing the selected element
 

2 / Choose the type of “event” to trigger interaction: 

  • Mouse: Click, Double Click, Rollover, Rollout

A new edition box is then created, where you can select the target element that will be impacted, the type of action (style, position & size, etc.), the parameters, values, duration, time and the easing.

3/ Set the “target” element: 

From the drop-down list, select the target element you want to affect. The list contains all the elements of the sequence, classified by type (photos, videos, texts, ...). 
If the target element is the one you want to interact with, then select "This element". 
If you want to create an action on the project playback, select "Player". (See the list of actions below)

NB. You can define as many targets as you want for the same “source” element.
 

4/ Editing parameters, animation timing and easing: 

The types of actions proposed are different by the type of file of your target. It is possible to change the style, size and position of all types of elements. However, if you choose an audio and video media, then you get additional parameters you can change like the playback properties.

When you choose a target and a parameter, the default value that appears is the one specified in the sequence. 

The animation timing is defined by its execution time and its delay (waiting time before execution). These values are shown in seconds.

The easing sets the pace of the animation (eg constant speed, slowed at the end, acceleration, bounce ...).
 

Copy / Cut / Paste Groups of Interactions:

There are several ways to copy / duplicate / paste interactions: 
  1. On the scene: Right click on the element > "Copy interactions", then right click > "Paste interactions" on another element. 
  2. On the track: Right click on the element > "Copy interactions", then "Paste interactions" on another element. 
  3. In the interaction panel: select one or more interactions, then right-click > "Copy" and paste in the space of another element.
 

Delete interactions: 

There are several ways to delete interactions: 
  1. Right-click the element on the Stage> "Delete interactions" 
  2. Right-click the element on the timeline> "Delete interactions" 
  3. In the interaction panel: select one or more interactions, then right-click> "Delete"
 

List of available actions:

Player control

(change the behavior of the player)

Style
(change the style of an element)

Size & Position

(change the size and position of an element)

Media Control

(change the behavior of a specific media file)

Play / Pause

Play

Pause

Stop

Mute / Unmute

Mute

Unmute

Volume

Go to

Go to + Time

Show Controls

Hide Controls

Toggle Controls

Toggle Full Screen

Enter Full Screen

Exit full screen

Close the overlay

Sharing window

Previous sequence

Reload the browser

Opacity

Background

Rotation

Border

Shadow

Left position

Top position

Bottom position

Right position

Current position + X

Current position + Y

Width

Height

Scale

Order of the track

Bring to Front

Send to Back

Fit to window

Play / Pause

Play

Pause

Stop

Mute / Unmute

Mute

Unmute

Volume

Go to

Go to + Time

Show Controls

Hide Controls

Toggle Controls



 

Language



Contact Us

email: support[at]klynt.net

Webinars


maria@klynt.net
http://assets0.desk.com/
false
desk
Loading
seconds ago
a minute ago
minutes ago
an hour ago
hours ago
a day ago
days ago
about
false
Invalid characters found
/customer/en/portal/articles/autocomplete