.

交互视频组件|可轻松实现互动H5视频形式

小常发表于:2024年06月07日 18:31:00更新于:2024年06月20日 16:04:15


一、应用场景

交互视频组件可以实现视频在特定时间上进行元素触发的操作,例如:在视频播放期间添加关键帧选择触发行为,需要在交互视频组件上面完成,主要用于:视频操作交互。

 

二、功能更新

已上线功能:

1、支持对视频播放器操作设置(播放、加载、暂停);

2、支持对视频添加关键帧设置(时间节点添加);

3、支持对关键帧进行触发设置(到达关键帧时);

4、支持对视频再次操作设置(添加、删除)。

三、案例演示

我们通过一个 DEMO 案例来演示下 「 交互视频组件 」的效果

企业微信截图_fd1dc702-e893-4cef-88fc-8e0e67c6c597.png

 

四、组件说明


使用权限:最低专业版账号,专业版以下用户可以免费插入样例学习体验。


1、交互视频组件在组件组件下面打开,选择点击添加。

0016662e1b70b13213969695bad43f5

 

2、添加交互视频组件时,可以选择创建方式,空白作品是需要自己添加视频进行操作,选择样例作品可以进行增删关键帧和设置触发行为参考学习,但无法替换自己的视频素材。

0016662e1c45c238877e6970a238684

 

3、创建空白作品点击下面图标按钮,跳转到素材库,选择本地上传的视频进行添加。


0016662e1d584148bbaf65b658f3a34

0016662e1dedf6a7c711c3e36d03da5


4、添加视频之后支持对视频的播放效果进行设置,在右侧编辑面板进行勾选或取消。

0016662e21c974cf12f494088b00162

 

5、编辑器下方时间刻度线会显示视频长度,在视频播放区间选择时间点拖动播放线标记其关键帧,右侧编辑面板则显示关键帧名字,根据视频播放时间顺序排列。

0016662e22bce42af22e196c5c59bdf

 

6、选择关键帧支持对关键帧名字修改,支持对当前关键帧添加触发器行为,进入触发器页面进行选择。

0016662e2460013e2fcb68de626a49e
0016662e2603190ef0ade5c70e71482